Navigation - Week 5
Lecture/Demo:
- IA Presentation on Smart Navigation
- Horizontal vs. vertical navigation
- Primary and secondary navigation
- CSS Layouts
- Creating an styling horizontal and vertical nav bars using XHTML and CSS
- Block Elements
- Floated Blocks
- Blocks vs. inline
- Create Custom Nav Bars using CSS Styling. See many great samples at Listamatic.com
- Getty Images - How to login and search for images for your portfolio.
- Free Backgrounds - Choose a background for your portfolio
Lab:
- Add a secondary navigation on the CNM's site. Reference Head First Web Design text, pages 222-225.
- Work on your mid term project
Homework: - Midterm Project
- Midterm Project - Due next week. Keep working on your layout using the guidelines from today's presentation on navigation. By next week you should have:
- Information Architecture Complete - Theme and Metaphors, Story boards, Site Organization Chart and Site Blue Print
- Design of the Layout input into Dreamweaver using XHTML Semantic Markup and an External CSS Style Sheet
- A Presentation of your project status. You will present your project and project status to the class.
- Finish your custom color palette and apply your colors to your web site. Reference Chapter 5 on Designing with Color in the Head First Web Design book.
- Find any images you need for free on Getty Images. (You need to fill out a form first.)
Free Tutorials - For Extra Practice
- VTC Computer Software Training www.vtc.com - Username: aisunnyvale - Password: vtcuser. Tutorials on Dreamweaver, CSS and XHTML.