1. CPT 499 Internet Skills for Educators Session Ten Class Notes

2. Introduction to HTML Define HTML Discuss the role of HTML on the WWW Describe the nature of HTML code Discuss the availability of HTML editor facilitates

3. Introduction to HTML Explain the process of creating hyperlinks Download graphics from the Web and include them in an HTML document

4. Introduction to HTML HTML - Hypertext Markup Language A set of codes (tags) that describe the appearance of a document when viewed in a Web browser An HTML editor generates the codes (tags) for you Can construct pages in any editor if you know the tags

5. Introduction to HTML Author of a document describes the document by specifying fonts, formatting, point size, images, sounds, etc. Good idea for author to story board a site before constructing a site

6. Introduction to HTML Web Resources http://www.w3.org/TR/PR-html40/ http://www.goliath.org/makepage/ http://www.nashville.net/~carl/htmlguide /index.html http://www.hotwired.com/webmonkey/ht ml/

7. Introduction to HTML Web Resources http://tstudio.usa.net/index.html http://blackcat.brynmawr.edu/~nswoboda /prog-html.html http://www.htmlgoodies.com/ http://www.utoronto.ca/webdocs/HTMLd ocs/NewHTML/

8. HTML Hypertext Markup Language [HTML] is the language in which all Web pages are written An HTML document consists of a set of codes [tags] that describe how the document is to appear when viewed in a Web browser.

9. HTML Initially, anyone creating a home page had to understand the use of the tags Today, it is easier since HTML editors exist The editors generate the codes for an individual We will cover the basic beginning tags over the next three days

10. HTML You can learn more about HTML through conducting a search on the Web and finding either an HTML Guide or an HTML Primer for your own personal use. Even with code generators you will need to know the basics in order to be able to modify a generated document

11. HTML Difference between a Web page and a Web site A Web page is a single page A Web site is a series of hyperlinked Web pages Web pages can be linked in a Linear fashion Web pages can be linked in a hierarchical fashion

12. HTML Web pages can be linked in a hypertext fashion Web pages can be linked in a mixed fashion The linking of pages creates a Web site Best way to learn the following information is to view the source code of Web pages

13. Structural Definition HTML Tags Appearance controlled by the browser’s preferences heading tags -- # can be replaced with the numbers 1 through 6 The larger the number the smaller the heading usually indented

14. Structural Definition HTML Tags emphasis - usually displayed as italic text strong emphasis - usually displayed as bold text citation - usually displayed as italic text author’s address

15. HTML Tags

16. HTML Tags Almost all codes [tags] have a <> beginning tag and ending tag Some systems are case sensitive, therefore, be consistent in your coding General HTML codes All HTML documents should have these codes

17. HTML Tags beginning and ending tags of an HTML document must be inside the tags Used to indicate the text that is displayed in the title bar of the browser’s application window

18. HTML Tags contains descriptive information Usually just after the tag must be inside the tags Used to present meta information comment tags information (******) not displayed by the browser

19. HTML Tags contains the bulk of the page All other formatting tags will be found between the tags

20. HTML Tags inserts a line break -- no tag needed inserts a horizontal line on Web page -- no tag needed alignment of rule thickness usually in pixels

21. HTML Tags width of horizontal rule in pixels <HR WIDTH=“#%” width of horizontal rule as a percentage of page width

22. Presentation Formatting HTML Tags Author specifies text appearance bold - displayed as bold text italic - displayed as italic text subscript - displayed as subscripted text - superscript - displayed as superscripted text center - centers text on page

23. Presentation Formatting HTML Tags underline - underlines displayed text displays text at a specific size - # can be replaced with the numbers 1 through 7 change font size upward - relative change based on current font size