Design Elements For Online Consistency

How do you create an online brand instead of just a web presence?

The answer is to create consistency across all of your online designs.

1. Header Graphics. Many online designs such as websites, blogs and newsletters have a header image across the top of the page. You should design a set of headers that meets the specifications for each application while still remaining consistent. For example, website headers are often 800 or more pixels wide, while newsletter headers are typically 600 pixels wide. And, your newsletter and website headers will likely have different text content and titles – but should look similar.

2. Logo. Your logo should appear on all of your online designs, with the exception of your Gravatar.

3. Visual Vocabulary. Your Visual Vocabulary consists of all of the visual elements and graphics aside from your logo that appear on your materials. In the case of online design, this includes the design of your navigation items, the page background, a promotional box treatment for the sidebar, stock photography, buttons, watermarks, illustrations, charts/graphs, table treatments, page borders… you get the idea. There are lots of opportunities for creating consistency here.

4. Fonts. Your fonts should be web-safe (available on all computers) and consistent across all of your online designs. For example, if you use Arial as the text font on your website, you should use that on your blog and newsletter as well. You won’t always have control over this – for example, you can’t change the text font on your Facebook fan page posts – but take advantage of this where you have the option.

5. Color palette. This is one of the widest-ranging options. You can even change your color palette on your YouTube page and Twitter sidebars. Select a color palette that’s broad enough to allow you to specify all the options and work in different situations (for example, colors that work as backgrounds for black text, and others that work for white text). And, use a consistent hierarchy of colors if you can – for example, always using dark green as your navigation bar color – across all applications.

6. Headshot. Use the same headshot – or limited set of a few headshots – across all of your materials. This goes a long way towards establishing consistency through simple repetition.