UX & Design

Why you need digital guidelines for your new website

Will Burroughs
  • 21 Feb 2017
  • 5 min read

So you’ve built your dream home. It’s all shiny glass and exposed beams and is perfect in every way. It's exactly as you pictured it. After months of hard work, you can relax and enjoy the fruits of your labour. But soon will come the realisation that the work never really ends. To keep this grand design of modern architecture looking its best comes the never ending up-keep.

Computer screen with showing brand guidelines

The analogy just described is very similar for any new website. It's a huge investment for any business to commission the build of a site. Once the new site is live, you can relax and enjoy the fact that after months of working alongside your agency, it's done and doing the business it was designed to do. But now comes the hard bit: maintaining the integrity of the site in the days, months, and years ahead to ensure long term success.

But how do you achieve this?

At some point, you'll have commissioned a branding agency to either create or refresh your brand. At the end of this process - once you have your new identity - the agency will compile everything you need, including the personality, tone of voice, logo usage, colour, and so on. They're essentially the rules for your brand and can be found in a single location, the brand guidelines (or brand bible). This allows the agency to pass on the brand so that you and your team can take on the mantle and implement your brand coherently and consistently.

A website is no different. Here at Ridgeway, or for any digital agency for that matter, they'll have painstakingly crafted a site that adheres to your brand values and ideals. Throughout the process, the brand and its rules will have been kept front of mind. On face value, a website comprises of simply a logo, some colours, typefaces, images and words.

A website is far more than simply a few assets. It's a living, breathing extension of your brand that touches and interacts with your users and customers.

A website, however, is far more than simply a few assets. It's a living, breathing extension of your brand that touches and interacts with your users and customers. Once this carefully crafted site comprising of perfectly set headings, cropped imagery, and persuasive calls to action is live, the agency entrusts you and your organisation to run with it and manage it via a CMS (Content Management System). This is the point where things can start to go awry...

Throughout the design of your site, the designer (or designers) will have worked to a set of rules and principles and applied them across the design in order to create a holistic and well-rounded solution. Most digital agencies will offer training as part of the project lifecycle and Ridgeway is no different. This is the opportunity where the information and rules around how to best manage the site can be shared.

But what happens six months, eighteen months or two years down the road? Is everything you went through still being implemented? Can you remember all of the advice the agency provided for ensuring the all-important hero banner sings? Probably not.

This is where the importance of documentation can be really beneficial. A digital guideline can empower your organisation to make your site the best it can be.

So what should a digital guideline include?

Here are our suggestions if you’re thinking of requesting a digital guideline as part of your digital project:

Colour

Include hex colours. Although your brand guidelines will already have these, often additional colours may be needed if the palette is limited. Reference where and when these colours should be used. 

Twinings Brand Gudelines

Typography

You need to know your H tags, intro styles, paragraph styles, and list styles. 

Messaging and content

It goes without saying that typography, messaging, and content go hand in hand with one impacting the other. Your site will have been designed with a variety of font weights to add emphasis, which create a clear visual hierarchy for your content. The components will have been carefully considered to not only cater for the optimum word length which achieves the best readability, but that are also visually pleasing to the eye. Managing these building blocks and knowing the ideal character or word lengths for headings, intros, paragraphs, and calls to action along with casing rules such as uppercase or sentence case for H1s, H2s, etc will ensure your site maintains its design integrity. 

Imagery

Your site will use a variety of proportionally sized images. It’s therefore important to know the correct aspect ratio before creating or uploading new images as nothing says unprofessional more than a row of content with one image set at the incorrect size causing space and alignment issues.

Many images may also require a specific crop in order to work best in the space they have been designed to live within. A hero image for example may require the focus to be on the right side in order for the text to sit on the left. So having an understanding when creating or sourcing imagery will mean you can nail this process each and every time.

You'll also want a reference for any image treatments. These maybe applied automatically within the CMS, which is great as you won’t need to do anything. If, however, this has to be applied pre-upload, then knowing how to achieve the desired effects will ensure consistency.

Icons

All sites use icons to varying degrees. It’s important to know the size where they're used and in what context. It will also aid any external suppliers on how best to create further icons should they be needed.

Naming class convention

It’s good housekeeping to have a good naming convention rule in place. It makes your life easier when in the CMS, allowing you to easily locate the image or images you want to use.

Having this reference point to take away with you will not only empower you and your organisation to make the right decisions but it will also help you to continue the up-keep of your site for the days, months, and years ahead. Crucially, it will also avoid the erosion of your website’s visual language which can damage your reputation and the trust of your customers.

So, if you’re looking for advice on how to maintain your brand's visual language or seeking a digital partner to grow your digital offering, get in touch!