Build on the skills learned in Web technologies: HTML and CSS – Level 1 to develop more advanced webpages. You’ll explore additional features for creating webpages, including creating and modifying tables; setting up forms; adding multimedia; validating code and publishing your site. You’ll learn to apply advanced CSS techniques to enhance the appearance and usability of your website. At the end of this class, you’ll be able to create and style more advanced webpages. 

• Design Principles and HTML and CSS: Level 1 or equivalent knowledge 
• Participants should be proficient with navigating folders and files; opening, saving and closing files; and using menus, toolbars and dialog boxes 

Session 1: Create advanced page layouts 

• Create two- and three-column layouts 
• Create a faux column layout 
• Create equal height page sections 
• Create a newspaper-style multicolumn layout 
• Create basic flexible box layouts 

Session 1 Assignments 

• Lecture/demo 
• Book chapter 15 
• Exercises 
• Skill check #1 

Session 2: Move elements around on a page using the position property 

• Create styles to reposition page elements 
• Use fixed positioning to lockdown a section of the page 
• Use the z-index property to control the stacking order of page elements 

Session 2 Assignments 

• Lecture/demo 
• Book chapter 15 
• Exercises 
• Skill check #2 

Session 3: Create horizontal and vertical navigation bars 

• Create buttons with rollover effects 
• Create a simple vertical navigation bar 
• Create a simple horizontal navigation bar 
• Create a cascading menu bar 

Session 3 Assignments 

• Lecture/demo 
• Exercises 
• Skill check #3 

Session 4: Create a table to organize and present data within a webpage 

• Create a basic table with data and header cells 
• Create a complex table with row and column spans 
• Enhance the table with styles 

Session 4 Assignments 

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

Session 5: Create a form to gather user information for processing 

• Set up a web form 
• Create fieldsets and legends to organize a form 
• Create text fields 
• Create labels for form fields 
• Create selection lists 
• Create option buttons and checkboxes 
• Create text areas 
• Create submit and reset buttons 
• Add HTML5 fields and attributes to a form 
• Apply styles to the form 

Session 5 Assignments 

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

Session 6: Embed objects to enhance a webpage 

• Add audio files 
• Add video files 
• Embed content using an iframe 

Session 6 Assignments 

• Lecture/demo 
• Book chapter 9 
• Exercises 
• Skill check #6 

Session 7: Apply techniques to effectively build webpages 

• Manage CSS across the browsers 
• Use the browser developer toolbars 
• Build template pages using include files 

Session 7 Assignments 

• Lecture/demo 
• Exercises 
• Skill check #7 

Session 8: Validate and publish a website 

• Validate the HTML and CSS code 
• Upload a website to a web server 

Session 8 Assignments 

• Lecture/demo 
• Skill check #8