A style guide is an important document for most successful projects. That’s why it surprises me that it’s often overlooked by creative project teams. It does require planning, discussion, and consensus up-front but it saves a lot in the long run! How?

A style guide:

• Saves time and money. The farther a project goes into development, the more difficult it is (i.e., time-consuming and costly) to change things that are simple to do at the beginning.
• Helps coach everyone throughout the process to get it right. This includes writers, designers, developers, subject matter experts, reviewers, and other shareholders.
• Reduces back and forth time during reviews in addition to reducing or eliminating disagreements.
• Improves readability, visual consistency, and usability.
• Increases credibility and strengthens the message.

A style guide provides a set of standards for a project. It often includes writing standards for style, grammar, and spelling as well as visual design standards for branding, formatting, and interactivity.

Many companies start with a base style guide and then add specific information for individual clients and projects.

Make the format easy to read and scan to find pertinent parts. Keep it short enough to use, too! There are lots of great existing reference books available for the finer points (see below for a few). You want people to read and refer to specifics in your style guide.

Consider the following sections as you develop your standards:

Writing:

• Spelling conventions (there are many correct ways to spell in this colourful world!)
• Date, time, and number conventions
• Abbreviations and acronyms: audience-specific, when and how often to spell them out
• Reading level
• Tone: voice, informal/formal, active/passive

Visual Text:

• Font: styles for headings, sub- headings, body, call-outs/pop-ups, user directions, etc.
• Case: formatting conventions for titles, headings and lists
• Paragraph: line spacing, indents, spaces between sentences or paragraphs
• Lists: bullet symbols, space before or after, punctuation

Visual Design:

• Images: purpose or decoration, framing or padding, treatment of illustrations and photographs
• Branding: logo usage, colour, layout
• Page/screen layout: template or format, common elements
• Use of white space
• Common, recurring design elements

Interactivity:

• Consistent navigation
• Hyperlinks: formatting, open in same or new window/tab
• Buttons: style, visual states
• Pop-ups, call-outs: appearance, formatting, padding, remain on-screen or closeable
• Directions to user regarding interactivity: standard phrases, formatting
• Consistent and appropriate wording for interactivity: click, rollover/hover, tap/touch, etc.

Finally, consider what Orson Welles said, “Create your own visual style… let it be unique for yourself and yet identifiable for others.”

The following are a few resources that may help for further reference:

• The Gregg Reference Manual is up to a Tribute Edition 11e and now contains computer terms. Find out more at: McGraw Hill: The Gregg Reference Manual.
• The Elements of Style by William Strunk, Jr. is a well-known reference book for writers. A portion is available online at Bartleby.com.
• The Chicago Manual of Style is a classic book and is available online as well (excerpts and by subscription): The Chicago Manual of Style Online.
• The Web Style Guide, 3rd edition by Patrick J. Lynch and Sarah Horton can be purchased as a book and is available online at: Web Style Guide, 3rd edition.
• The Microsoft Manual of Style for Technical Publications is helpful for technical writing and computer terminology.