2015 Jul 07

When a brand is not yet fully formed, the team circles jumpily around the core ideas, brainstorming, joking, riffing. The energy is high and the ideas flow quickly. If you’ve been part of a startup project, you’ll know this is typical.

Because everything is new, several pieces take shape in tandem: the content, the site map, the colours, a slogan. Very simple questions like, “What colours should the links be?” or “What goes in the footer?” often require the team to stop and make a decision.

This early stage is a great time to start thinking about a style guide. A style guide that evolves with the design will help prevent redundant or inconsistent styles.

Because this is digital, there’s a sense that everything is temporary. Of course you can change the link colour later. At this early stage, there’s the feeling that there is no brand. Colours? Decide later! Content? Throw in some “Lorem ipsum.” Voice? Figure it out later when we replace that Lorem ipsum.

So when does branding start? The problem is you’re doing it already.

Branding: You’re Already Doing It

You might not have an identity guideline yet. If your business is new, you may not even have a logo. But the moment you start publishing documents, sending emails, designing marketing, and yes, choosing link colours, you’ve started branding. 

I like to think of a brand as the voice of a business or organization. Clients sometimes use “brand” and “logo” interchangeably, but a brand is much more than its logo. A brand is shaped by visual elements, words, communication, and flow, and these in turn shape user experience. 

Every time someone interacts with your product they are experiencing your brand. Conveying your brand clearly requires consistency. And consistency is where your Style Guides come in. 

I have become a style guide evangelist. You have only to whisper the words, “I wonder if we need a style guide” from behind a closed door and I’ll appear. And, like any good proselytizer, I’ll bring my soapbox with me.

I hear you saying, "Wait a minute, isn’t a style guide for writing?" Traditionally, publishers have used “style guides” to make sure writers used the right voice and tone. But the term has been adopted for visual and programming standards, as well as writing. There is a lot of overlap between different types of style guides, such as front-end style guides, pattern libraries, ui inventories, branding guides, and identity manuals. 

Keep up standards with standardization

A style guide is about standardization. Standardization means that everyone working on your website consistently maintains the brand’s look, tone and user experience, whether they’re writing content, choosing colours, or building forms.

A style guide is also about maintaining standards. By that I mean the quality of everything that goes on a website matches the brand’s quality. In her book A Pocket Guide to Front-End Style Guides, Anna Debenham writes, “a style guide will provide a starting point for the people who create the content, and help them make it in a way that looks trustworthy and official.”

A style guide is whatever you need to document to keep you, your team, your contractors, on brand.

A spectrum of style

What a style guide looks like, and how much of one you need, depends on the brand, the type of organization or business, and the amount of content to be published. Style guides range from a few pages to entire websites or books.

A style guide can be complex and detailed. Or it can be simple and direct.

It can be strict (Thou shalt do this) or relaxed (You could try this).

Some style guides are specific: “The integrity of the font should be maintained at all times. No vertical or horizontal scaling, no added stroke, etc.” (Alberta Government Corporate Identity Manual)

While others are more abstract: “Do not be too pleased with yourself. Don't boast of your own cleverness by telling readers that you correctly predicted something or that you have a scoop. You are more likely to bore or irritate them than to impress them.” (The Economist style guide)

While others are fun and lead by example: “Be nice. We’re experts, but we’re not bossy.” (MailChimp Style Guide)

Who needs a style guide?

Everything that is made, whether in pixels or in ink, with shapes or with words, needs styling.

Even the humble search button on a website has shape, font-choices, colour, interaction, and even language. Do you say “Search our site” or the more casual “Go”? Or maybe it’s just a magnifying glass.
    
Are you writing text for your organization’s site? Talking to a freelance designer on the phone? Working on an email blast to your members? Adding a newsletter sign-up form to your website?

I invite you to join me on the style guide soapbox. Start a conversation about style guides with your fellow designer, developer, business owner, or consultant. Think of a style guide as a tool that’s useful throughout a project, as early as possible, not just at the end. Your brand will be more consistent, your code less bloated, and your audience happier.