Web Style Guide

Originally published 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 Web 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 Web 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.

Follow Discussion

4 Responses to “Web Style Guide”

  1. Ian

    the link to the style guide pdf is broken

  2. Raven Tohonnie

    I always enjoy reading quality articles by an author who is definately up to snuff on their chosen subject. I’ll be following this thread with great interest. Keep up the great work, see you next time

  3. Louann

    “Web Style Guide : FatPurple” actually got myself simply addicted on ur
    webpage! I reallywill probably wind up being back much more regularly.
    With thanks ,Elizabeth


  1. Useful Links « Prasad Khasnis  

Leave a Reply