2. What is HTML ? HyperText Markup Language. The authoring language of the Web is currently HTML, which stands for HyperText Markup Language. Future versions of the Web are likely to be based on XML which stands for eXtensible Markup Language

3. HTML: What is it? HTML is a document layout and hyperlink specification language HTML defines the syntax and placement of special, embedded directions (called “tags”) that are not displayed by the client browser HTML is concerned with the STRUCTURE of a document, not so much the APPEARANCE of that document

4. HTML did not support things like Sound, motion, video User interactions Counters and market information But these applications can be accomplished through external programming tools that run “under” HTML. (plugins)—heard of Flash? With new HTML5 this is changing (but not in this course)

5. HTML files and tags HTML files are simple ASCII files (aka “text files”) containing “embedded tags” describing the document layout of content authored by you HTML “embedded tags” are directions to the browser (e.g. Firefox, Safari, or Internet Explorer) The browser uses the information inside the HTML tags to decide how to display or treat that content Ex: the tag specifies the title you choose to use for the document

6. Who Governs HTML Development? Began as informal specification- Now used by millions Needed formal organizational blessing of -- World Wide Web Consortium (W3C) http://www.w3c.org http://www.w3c.org W3C manages the HTTP (HyperText Transfer Protocol) standard and markup languages that address that standard IETF (Internet Engineering Task Force)— defines the technology behind the Internet and WWW http://www.ietf.org http://www.ietf.org

7. Tools for Web Authors The minimum: an editor, a browser and if possible an Internet connection HTML editor or word processor? Your decision (both have advantages): Editors (pure ASCII) support “raw HTML coding” (aka “markup”) WP supports content development – (esp. spell check, thesaurus lookup, outlining)

8. Why not use a Web Authoring Toolkit? FrontPage, DreamWeaver, even MS-Word automatically translate your text into HTML. Why not take the easy road? Not all adhere to latest W3C standards Some may not render well across different browsers Most WYSIWYG HTML editors don’t have up-to-date built in browsers (so they may give misleading displays) You can lose control over your document space…

9. HTML -- Let’s Start HTML’s basic four tags z

10. HTML Container vs empty tags z Container ; z Empty Attributes (modify HTML tags) z z Four attributes (src, height, width, alt)

11. HTML - Heading/Paragraph Heading Elements - varies font size z Levels 1 (largest) to 6 (smallest) z z Inserts a line break before and after Paragraph Tag z z Inserts a line break before and after

12. HTML -- More Tags Line Break Tag z z Manual line break Text formatting z

13. HTML – Align Attributes Align Attribute z Modifies horizontal position of text z left z right z center z justify

14. Enough already! Let’s get started http://bengal.missouri.edu/~knottsb You become the publisher

15. Links Links are created by the Anchor Tag This is the tag also known as a href for Hypertext Reference Anchor tag is the HTML feature that defines both the source and destination of a hyperlink

16. Links (continued) Links/Hyperlinks z file in same directory z file in different directory; same machine z file on another website z send email

17. Links Link examples z File z Google z Email

18. HTML -- Lists Lists z Ordered -- numbered z Unordered -- bulleted z Definition

19. Making your HTML more exciting

20. Images Put this in your file for image display z Make it a link z http://www.missouri.edu

21. Getting Images Find on the Internet Make ourselves Digitize

22. Getting Images You create Software packages Photoshop, PaintShop Pro, PrintShop, your phone You get from others Free or Fee -- be careful http://www.corbis.com http://www.barrysclipart.com http://www.thinkstockphotos.com http://google.com Others you have used???

23. Images for web pages Consider format.tif – large, bitmap.jpg – smaller, photographs, many colors.gif – usually small, drawings/logos/icons, Animated gifs, fewer colors than jpgs Others– example.png but some image formats don’t work with all browsers

24. zHTML -- Color Color z Predefined Color Names z RGB color values (lots of charts on Web)charts

25. Predefined color names: The 17 standard colors are: aqua, black, blue, fuchsia, gray, grey, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow. (but which blue?)