1 After completing this lesson, you will be able to: Understand the basics of HTML coding. Use HTML tags. Plan an HTML site. Create a table with HTML. Assemble a home page and subpages using HTML.

2 !DOCTYPE CSS and HTML 4.01 standards: HTML 4.01 standards and deprecated HTML elements and attributes (most of which concern visual presentation): HTML 4.01, deprecated HTML elements and attributes, and frames:

3 HTML Document Information HTML text documents contain: Content – Text and graphic references HTML commands – Control how content displays

4 Opening a Text Editor Notepad—Click Start, point to Programs, point to Accessories, and then click Notepad. WordPad—Click Start, point to Programs, point to Accessories, and then click WordPad. TextEdit—Double-click the TextEdit icon on the hard disk.

5 Text Editor Views

6 HTML Rule #1 HTML tags consist of commands that appear within angle brackets (<>).

7 HTML Rule #2 HTML tags are not case-sensitive.

8 HTML Rule #3 HTML tags almost always come in pairs.

9 Tag Pairs Do you want butter flavoring on your popcorn or do you like it plain?

10 HTML Rule #4 Nested HTML tags should close in the reverse order in which they open.

11 HTML Rule #5 By default, HTML documents display a single space between text elements. Music Instruction

12 HTML Spacing

13 HTML Rule #6 Some opening HTML tags can contain properties (also called attributes) that further refine an HTML tag’s instructions. grass

14 HTML Rule #7 Numerous variations exist when it comes to the HTML nesting theme, properties, and use of tag sets.

15 File Organization

16 Save, Save, Save! Press Ctrl+S Click File, and choose Save Click (if available)

17 Previewing Display the contents of the folder containing the HTML document and double-click the HTML document’s icon. Open a browser application (such as Internet Explorer), and type in the HTML file’s location. Open a browser application, open the folder containing the HTML document, and drag the HTML file’s icon from its folder into the browser window or the browser’s Address bar.

18 Knowledge Understand basic HTML rules. Realize that the importance of saving HTML documents and images in designated Recognize the importance of saving often. Recognize the importance of previewing Web pages throughout the creation process.

19 Storyboard

20 Home Page Sketch

21 Button Graphics

22 Title Bar Banner Graphic

23 Standard HTML Tags

24 Tag Attributes

25 Table Tags delineates the start and end of a table. indicates a table row. defines the start and end of a cell within a table.

26 Table Code

27 Logo Code

28 Banner Graphic Code

29 Preview: Table, Logo, Banner

30 Navigation Bar Code

31 Preview: Navigation Bar

32 Footer Information Graphic Address Phone number Text links that correspond to navigation bar Copyright text

33 Finished Footer

34 Footer Code

35 Subpages index.html lessons.html recitals.html competitions.html performances.html background.html contact.html

36 Subpage Files

37 Subpage Code

38 Navigation Bar Test

39 Headings

40 Tag Attributes

41 Paragraph Content Code

42 Preview: Content

43 Block Quote Code

44 Preview: Block Quotes

45 Unnumbered List

46 List Code

47 Color Page

48 Template

49 Next Step Creating Web Sites with FrontPage

50 Exercise 1

51 Exercise 2

52 Exercise 3