Use the latest version of HTML and CSS to create the content of a webpage complete with text, images and hyperlinks. Then enhance the look and feel of websites using cascading style sheets (CSS) to modify page text and layout through hands-on practice in the classroom. You’ll be introduced to current coding standards and how to make pages work in today’s environment. By the end of class, you’ll be able to create and style a basic webpage. 

• Design Principles or equivalent knowledge  

Lesson 1: Create the structure and content of a webpage 

• Apply the appropriate DOCTYPE to a webpage 
• Use the document structure tags to create the skeleton of a webpage 
• Declare the document encoding 
• Create HTML comments 
• Apply heading tags to section headlines 
• Group content with paragraphs, blockquotes and addresses 
• Create unordered, ordered and description lists 
• Apply tags to inline text 
• Use character entities to insert special characters 

Lesson 1 Assignments 

• Lecture/demo 
• Book chapters 1, 2, 3, 8 
• Exercises 
• Skill check #1 

Lesson 2: Apply styles to a webpage 

• Write style rules using different kinds of selectors 
• Store style rules in the appropriate style sheet 
• Create a style sheet comment 
• Apply colors to page elements 
• Create styles to modify font properties 
• Create styles to modify text properties 
• Create styles to modify lists 
• Add backgrounds to page elements 
• Use the cascade to determine which styles will be applied to a webpage 

Lesson 2 Assignments 

• Lecture/demo 
• Book chapters 10, 11, 12, 14, 16 
• Exercises 
• Skill check #2 

Lesson 3: Add inline images to webpages 

• Insert an inline image on a webpage 
• Create figures and captions 

Lesson 3 Assignments 

• Lecture/demo 
• Book chapter 5 
• Exercises 
• Skill check #3 

Lesson 4: Create internal and external hyperlinks on webpages 

• Create hyperlinks between pages in a website 
• Create hyperlinks that jump within a webpage 
• Create hyperlinks to other websites 
• Apply styles to links using pseudoclasses 

Lesson 4 Assignments 

• Lecture/demo 
• Book chapter 4 
• Exercises 
• Skill check #4 

Lesson 5: Create the sections that structure the content of a webpage 

• Create generic divisions 
• Create the sections of a webpage using basic section structure tags 

Lesson 5 Assignments 

• Lecture/demo 
• Book chapter 17 
• Exercises 
• Skill check #5 

Lesson 6: Style sections of a page using the box model 

• Create styles to change the margins and padding of page elements 
• Create borders for various page elements 
• Modify the dimensions of page elements 
• Create styles to control the overflow of text 
• Create a simple page layout using the float property 

Lesson 6 Assignments 

• Lecture/demo  
• Book chapters 13, 15 
• Exercises 
• Skill check #6 

Lesson 7: Create style sheets for printed pages 

• Link a print style sheet to a webpage 
• Modify page styles for printing 
• Modify the display or visibility of page elements 

Lesson 7 Assignments 

• Lecture/demo  
• Exercises 
• Skill check #7