© 2004 Ken Baldauf, All rights reserved.

Page Structure

CGS2826 Web DesignProgram in Interdisciplinary ComputingFlorida State University

From Web Style Guide, Chapter 6: Page Structure

© 2010 Ken Baldauf, All rights reserved.

The experienced web designer, like the talented newspaper art director, accepts that many projects she works on will have headers and columns and footers. Her job is not to whine about emerging commonalities but to use them to create pages that are distinctive, natural, brand-appropriate, subtly memorable, and quietly but unmistakably engaging.

—Jeffrey Zeldman

© 2010 Ken Baldauf, All rights reserved.

Site Design should…

• Satisfy design norms and user expectations• Focus on providing great content and

services rather than on technologies and design novelty.

• Be consistent with enterprise and organizational standards

© 2010 Ken Baldauf, All rights reserved.

© 2010 Ken Baldauf, All rights reserved.

Headers

Headers provide site identity and global navigation, with search and perhaps other tools.

Headers are the most visible component of site identity.

© 2010 Ken Baldauf, All rights reserved.

Scan Columns

• Sectional links• Search box• Contact info• Other minor elements

• Left or right, no matter

© 2010 Ken Baldauf, All rights reserved.

Content Area

© 2010 Ken Baldauf, All rights reserved.

Footers

Housekeeping Info Author Copyright Contact Info Link to site map Links to related sites

© 2010 Ken Baldauf, All rights reserved.

Page Templates

Internal page template dictates the general characteristics of the site.

© 2010 Ken Baldauf, All rights reserved.

Page Templates Secondary page template establishes

header labels Act as “sub-home page”

© 2010 Ken Baldauf, All rights reserved.

Home Page

© 2010 Ken Baldauf, All rights reserved.

Tag LinesLet visitors know what you do!

© 2010 Ken Baldauf, All rights reserved.

Above the Fold

© 2010 Ken Baldauf, All rights reserved.

Dropdown menus

Use with caution Consider Accessibility

© 2010 Ken Baldauf, All rights reserved.

Role-based navigation

© 2010 Ken Baldauf, All rights reserved.

Splash Page?

Author: Don’t ever use an indulgent, functionally useless splash page as “eye candy” at the entrance to your site. Ever.

http://www.webdesigndev.com/inspiration/20-crazy-but-creative-website-splash-page-examples