Why Style Guides Are Cool

Style guides are a great addition to any web designer’s service. For larger companies and clients they’ll be an expected part of delivery, or they may provide you with a style guide you have to follow. For smaller clients they can be a real boost to your reputation. They demonstrate to clients that you value their overall brand and are giving them resources to ensure future consistency. Style guides are also a great resource for the designer themself, ensuring that they have a good reference point if they work on a site again in the future.

What Is A Style Guide?

A style guide is a document that details the colors, fonts, layouts, image styles and techniques used when putting a website together. It acts as a reference document not just for web design, but for all branding issues.

I detail the following in style guides for clients:

• Colors: The colors used in the site labelled for what they are used for (e.g. headlines, borders, links, background text etc). I detail this in hex code, RGB and CMYK formats (CMYK is particularly important for print designers). So a plain white would be hex #ffffff, RGB 255, 255, 255 and CMYK 0, 0, 0, 0.
• Typeface: A list of typefaces used in the document. I tend to use the typefaces in context (e.g. writing ‘Main page heading’ in the relevant typeface and font size. If there are any unusual fonts used in site then I’ll also attach the font itself for the client.
• Images: Detail the different images types, inclusive of any border styles and whether there are any standard sizes for main images or thumbails.
• Special Techniques/Applications: If you’ve used an unusual grid system, or incorporated a particular jQuery image gallery, you should take a note of this. You may not be the only person to work on the website and you’ll be doing a favor to anyone who has to make changes in the future.

It Makes You Look Great To Small Business

One of the biggest additional advantages of creating style guides for every project is the boost it can give to your reputation with smaller clients. Larger companies will likely require a style guide from you, or give you a strict style guide which you have to work with from the start. Small businesses, sole traders and new start ups may never even have considered a style guide before. By creating one you give them a great additional service they didn’t expect, as well as influencing their long term branding beyond the website.

A No-Lose Service To Provide

Thing is, because creating a style guide for every project is something you should be getting into the habit of all the time, it’s no additional work to pass it over to the client. It’s a no lose situation, either they expect a style guide and you provide it, or they hadn’t thought about a style guide and you give them a comprehensive layout in any case. You’re either doing what’s expected, or adding additional value, all because you’re adhering to good practice for yourself as a designer.