Information Architecture Deliverables > Web Site Style Guide

Web Site Style Guide 2/2007

What is a style guide?

A Web style guide is a document that outlines the design requirements for site. A style guide generally defines the typography, color palette, and key elements.

Sample Style Guide (pdf)

Why Have a Style Guide?

The value of a style guide is to have documentation for others to refer to and follow. This is important for large Web sites that have numerous individuals and groups maintaining or adding content. Having a guide to enforce common element and font usage will help ensure a consistent site design.

Some also use the term 'Style Guide' to describe their Web policies. These are broader sets of rules and policies that define things such as linking policies, permitted technologies, privacy issues, etc. But what I am describing here is the more narrowly focused document that guides a site's visual appearance.

Most companies and government agencies are very particular about the usage of their logos. A style guide should define any relevant requirements for the display of logos.

A Web site style guide isn't normally the job of an information architect. They are generally created by designers. But in many Web shops the roles and responsibilities are blurred. And some IA's may end up contributing to the style guide.

A style guide may or may not include references to a site's cascading style sheet (CSS) classes. The sample below does. I find it useful to illustrate some (or all) of the widely used CSS classes. It will help others understand which styles are available without them having to actually access the CSS file.