Website landing pages are powerful marketing tools which can turn a mediocre campaign into a highly successful one.

In this article we look at what makes a great landing page and how to brief your design agency to create yours.

What is a landing page?

A website landing page is the first page that a visitor to your website arrives at, usually as a result of clicking on a search result, a link in an email or a social media post, or an advert.

Strictly speaking, any page can therefore be considered a landing page. However, when marketers refer to a “landing page” they usually mean a standalone page that’s been specifically designed to elicit a response from the visitor – for example, to send an enquiry, join a mailing list, attend an event or make a purchase.

Often these pages don’t feature in the main navigation of the website – they’re intended purely for that first arrival, not to be discovered while browsing it.

Landing page objective

The first thing you must be clear on is what you want your landing page to achieve. If your agency doesn’t understand this, your page will never be as effective as it could be.

Landing pages tend to be focused on a single, very specific goal and, therefore, a very specific target audience.

Example landing page objectives:

• Increase lead generation from Google Ads, through a tailored landing page which reinforces the messages in the advert and asks the reader to book a free consultation.
• Download a free eBook, often also capturing the visitor’s contact details (in return for the free download) so you can get in touch with them.
• Complete a purchase, perhaps with a Black Friday special offer discount code only available through that landing page.
• If you include a QR code in leaflets you hand out at a trade show, the landing page might have the objective of getting the visitor to sign up to your mailing list.

Landing page audience

Because your landing page is so targeted, it’s likely that you’re using it to only attract one (or possibly two) of your customer personas.

When briefing a company to create your landing page, it’s important to be very clear about who you expect will read it. Everything from the visual design, to the copywriting, to the choice of photography, should be tailored to appeal to that segment of your market.

Bear in mind that this might mean you actually need to create more than one version of your landing page, one targeted at each persona’s particular needs.

Another important piece of information is the device your audience is most likely to use to view your landing page. In the b2b market this is probably a desktop computer, so your landing page design should focus on this platform. However, in a consumer market, your users may be predominantly on mobile devices, so you should expect your design agency’s initial design proposal to be for a mobile view.

Landing page layout

There’s no hard and fast rule about what your landing page should look like and, when briefing a design agency, it’s important to give them a certain amount of creative freedom.

However, there are some elements which most landing pages should include.

Headline

Perhaps the most important component of your landing page’s content is the headline.

This is your first, and perhaps only, opportunity to grab your reader’s attention and get them to continue down the page.

Headline image or video

Accompanying the headline should be a strong image or video that reinforces the message.

Traditionally many landing pages use photos of people since a human face can be more engaging and draw your reader into the page. However, this isn’t a hard and fast rule and simply won’t be suitable for some landing pages objectives.

Call to action

This is the crux of your landing page, the Holy Grail, the focus of all your efforts – getting your visitor to do what you want them to do.

How many calls to action should you include on your landing page?

Generally you should have just one, very clear and specific type of call to action – so the only decision your audience has to make is do they take that action or not.

By incorporating more than one type of call to action you’re diluting the objective of the page and, by giving the reader too much choice, making it harder for them to decide what to do.

This landing page from Plann, for example, is nicely designed, however there are too many calls to action. Should we download their guide? Try Plann’s services? Read more scheduling tips? Create a free account? A single, focused call to action would achieve more of the results they’re seeking from this page.

In a similar vein, your landing page shouldn’t have too many links to other pages. You don’t want your users to browse your website, you want them to take the action which is the objective of this page. Therefore, you might not include your main website navigation or even link your logo back to your homepage. Your target call to action may be the ONLY link on the page, or at minimum should be the most prominent one.

What should your landing page call to action look like?

Your call to action can take many forms – but should be written and designed with your specific objective in mind.

Some example calls to action:

• A button to download a free eBook.
• A form to capture data about the reader.
• A button to click through to the checkout page.
• A calendar to schedule an appointment.
• A click to call button (being specific about why they are calling you).

Where should your landing page call to action be?

Ideally your first call to action should be “above the fold”, ie in the part of the page which you see when it first loads.

This isn’t always so easy, particularly when your reader is on a mobile device, but it should at least be as high up as possible.

It’s absolutely fine to repeat your call to action further down the page too. If you have quite a long page you might want to, for example, have calls to action at the beginning, middle and end of it. Just don’t overload the page, keep a balance between calls to action and other content, otherwise it will feel too pushy.

Explaining your offer

Depending on how complex your offering, and how knowledgeable your market, you might need to a little or a lot of additional explanation. This is a good opportunity to consider what questions your target audience might ask and make sure that your landing page answers them. This can be done with text, images, video, or a combination of all three.

Text should be kept simple and to the point. Use devices like sub-headings and bullet points to break up longer sections of text and make the key messages easier to spot.

Images and videos are particularly useful as they can help the reader to visualise themselves using your product or service. If using video, remember to add subtitles as many users will watch it with the sound off.

Social proof

Having other people or organisations advocate for your brand is fantastic content for a landing page. It gives the reader the confidence that other people have used and liked what you’re offering, so they will too.

Social proof takes many forms, for example:

• Testimonials from happy customers or experts in your field – text ones are good, videos are even better.
• Logos of brands you work with.
• Star ratings from trusted review sites (such as Google, TripAdvisor or Feefo).
• Awards and accreditations you’ve received.

Don’t forget SEO

Your agency might be setting up your landing page with an objective that isn’t SEO-related, such as being a landing page for your Google Ads campaign or a destination from a trade show QR code. Nevertheless, it’s still important to do some basic SEO work on the page.

If you’re taking the time and effort to create this highly targeted landing page, it’s daft to not just do a little bit of extra work to also give it a chance of being found through search engine searches.

When considering which search terms to target, the highly specific nature of landing pages mean that they work well for ‘long-tail’ search terms. So, for example, instead of optimising your landing page for something quite generic like “double glazing” you should be more precise, for example targeting “double glazing for period homes in Sussex”.

What happens next

When briefing your agency you also need to consider what you want to happen next when the customer takes the desired action on the page.

For example, should any messages appear on screen once they’ve taken that action? Should they be redirected to another page? Are any follow up emails needed?

Landing page design

Perhaps the most important aspect of a landing page is its overall visual appearance. Conversely, this is probably the thing you need to be least prescriptive about in your brief. At the end of the day you’re paying a designer to create something beautiful and effective for you – so don’t stifle that creativity!

Creative freedom aside, there are some essential principles you should expect your landing page design to follow.

Overall look and feel

A good landing page will be pleasing to the eye and provide a “scannable” overview of your offering.

From a design perspective this means it should be uncluttered, with plenty of breathing space between each section, and make good use of images, videos, icons and other design devices.

We like the intention behind this landing page from the British College of Journalism. It has a single, relevant call to action, which includes a free download, which is great. The colours are strong and vibrant.

However, it’s just a bit too cluttered. Perhaps appropriately for journalists, there are too many words. For example, the list of key features next to the icons would each work just as well without the headings (e.g just “Professional & Personal Development”).

Plus, the main, and most important, heading “The Professional Freelance Journalism Course” is in a less prominent position than the rather vague “Follow Your Passion”, which could refer to anything.

With less clutter and a better headline this landing page could easily pack a bigger punch.

On brand … mostly

While it should adhere to the essential elements of your brand guidelines, you should also be prepared to allow your designer some flexibility.

A landing page has a lot of work to do in a fairly limited space, so don’t expect it to be a carbon copy of the rest of your website.

Imagery

The visuals on your landing page have to do a lot of the heavy lifting. They need to instantly convey the benefits of following your call to action, encouraging your reader to take that action.

If you’re selling a physical product, your designer might feature a series of photos, showing it from different angles, including at least one with a person in it (or something else to show scale).

Lifestyle images are also a great addition to many landing pages. They tell a story about the benefits which your product or service can bring. A picture really can be worth a thousand words.

Make sure that your images are always relevant to what you’re offering, otherwise they’ll only serve to detract from your message.

Draw attention to your call to action

Your designer will create a natural visual hierarchy within your page, at the summit of which will be your call to action.

Much of this is done quite subtly. One example is to include a photo of a person which is positioned so they are looking at the call to action – your reader’s eye will be naturally drawn to look the same way.

For some landing pages you might want to throw subtly out the window and employ some big flashing arrows pointing at your call to action. So long as it suits your brand and your objectives, this brazen approach is fine.

There are many things to like about this landing page from IRIS, however the fact that the arrows all point away from their call to action is not one of them!

How to write landing page content

How to write your headline

You should ensure that your agency is using a professional copywriter to get the most out of every word that’s included on your landing page, particularly the headline.

A strong headline:

• Is relevant to what the reader is expecting to get from the page.
• Makes a promise about the benefits of reading on.
• Starts with a verb (probably) to give a sense of action.
• Includes compelling words such as “free” or “now”.

How to write your call to action

Your call to action should be specific to the objective of your landing page and the audience you’re appealing to.

“Contact us” doesn’t really cut the mustard. “Book a free 30 minute phone consultation” or “Complete this short questionnaire to receive our free report and recommendations” is much clearer, relevant and compelling.

We could write a whole article on creating the perfect call to action text (and perhaps we will) but here are a few things to check that your copywriter is delivering.

As with the headline, every word should be carefully considered. Active sentences and the use of verbs at the front give a greater sense of urgency.

Less formal language will appeal to some audiences, but if you’re encouraging your reader to download a medical report, for example, a more formal tone may be appropriate.

Here are some good examples:

• Download now – If they’ve arrived at the page expecting a free download, make it really obvious how they get it.
• Book a free… – Incorporating the word ‘free’ will always catch the eye.
• Get your discount code now – You’ll have seen this a few times on discount voucher sites! It’s a strong call to action, starts with a verb, promises a discount and uses ‘now’ to create a sense of urgency.
• Buy yours before they all go! – Another one creating a more obvious sense of urgency and ‘Fear Of Missing Out’.
• Subscribe to… – If the objective is to get them to sign up to your mailing list then make sure the call to action is obviously about this, and nothing else. Remember that subscribing to a mailing list is a less daunting first step in getting to know your business than making an enquiry.
• Join free for a month – It never hurts to repeat the premise of your offer within your call to action. It reassures your reader that they’re going to get what you’ve promised them.

How to write the other text on your landing page

Every bit of content on your landing page should focus on the benefits to your reader, not just the features of your product or service.

When we write we always ask ourselves “so what?”. For example:

“Our cloud backup services offer secure, 64tb capacity storage with easy access.”

“So what?”

“When something goes wrong, our cloud backup services will get your business back on its feet quickly and easily.”

The second option is much more compelling as it speaks to the reader’s needs, not the service’s features.

Needless to say, it should be well written and appropriate for your intended audience. But don’t let your copywriter get carried away and end up with great ‘walls’ of text for your designer to somehow incorporate in the page!

Great landing page designs

Here are a few landing pages content examples which we really like.

This Airbnb landing page is beautifully simple yet effective.

Its objective is to encourage new hosts to join Airbnb. The message is very clear – you could make a lot of money by doing this. The call to action is a simple and colourful button, right at the top of the page.

Scrolling down the page they include information on how easy it is to join up and a list of FAQs. The final call to action on the page is to chat to one of their ‘Superhosts’ for more support.

This Talkspace landing page is targeting people who suffer from insomnia. While not the only call to action on the page, their priority is clearly for you to take their insomnia test. This directs you to another page to complete the test, after which you’re given the opportunity to sign up to Talkspace’s services.

Reassurance is given from the two accreditation logos placed over the image. Further down the page is more information about insomnia, focusing on reassuring the reader that they are not alone in suffering from this. And the call to action to take the test is repeated at the bottom of the page.

Freshchat tick a lot of boxes with this landing page. It’s cleanly laid out, the headline focuses on the customer benefit, the explanatory text is brief and, again, benefit focused, and the call to action is specific and repeated.

Scrolling down the page you immediately come to a list of high profile client logos (social proof). This is followed by:

• More details on the benefits Freshchat can bring.
• A repeat of their call to action.
• The option to open a section with their pricing details (hidden until you click, to preserve the clean design of the page).
• More social proof in the form of testimonials.
• The final call to action.

This Go-Henry landing page is beautifully designed, with a large, highly relevant image, compelling headline and obvious call to action buttons. And underneath the call to action is a subtle piece of social proof, in the form of their Trustpilot rating.

One tweak we might be inclined to make is to remove the main website navigation and log in buttons – focusing the reader solely on the next step which Go Henry want them to take.

Like the Freshchat landing page, the Go Henry one continues with further examples of social proof (accreditations, testimonials and publications they’ve been mentioned in), additional information including an explanatory video and safety reassurances, all peppered with call to action buttons.

If you’re looking for more landing page ideas, then this article from Hubspot includes some fine examples.

A/B testing landing pages

A/B testing is the process of having multiple versions of the same landing page, so you can assess which are the most effective.

For example, you might try different photography, a different headline or differently worded calls to action.

This isn’t just about testing which version of the page gets you the most conversions. You should also look into the data in more detail, for example studying whether one page converted a particular type of visitor better than another. You might find, for example, that the page which is bringing in the lower quantity of conversions is actually delivering a far higher quality of customer.

If you’d like your agency to incorporate A/B testing then it’s important to include this in the brief from the start.

How to brief your landing page designer

As we’ve emphasised throughout this article, it’s critical that you give your design agency all the information they need to create the perfect landing page for you.

To make this a bit easier, we’ve distilled everything into a handy template for you to use.

An alternative to writing a brief – call us for a chat

If you’d rather speak to someone about your landing page then that’s no problem! Our web design specialists are happy to chat to you about your project.

Call us on 01273 814 019 to tell us what you need.

A definition of brand guidelines

Brand guidelines document how your brand should be presented to the world. They are used to ensure a consistent look and feel across all forms of communication.

Consistently demonstrating your brand’s identity and values helps to build trust with your customers and increase brand loyalty.

Why are brand guidelines important?

The process of defining your brand strategy and creating a brand identity is incredibly rewarding, but also a lot of work. It’s essential that this investment of your time and money is capitalised upon in the ‘real world’ of your organisation.

Brand guidelines do just that. They take all the elements of your brand identity and distil them into an easy-to-access format. This makes it simple for everyone involved in communicating about your business to be consistently “on brand”.

This consistency ensures that you are creating a clear and memorable identity in the eyes of your customers. It demonstrates your values and builds trust and loyalty with your audience.

Who should use your brand guidelines?

Anyone who is involved in creating marketing or sales materials for your organisation needs to read and understand your brand guidelines.

What form should brand guidelines take?

Brand guidelines can be printed documents, pdf files, videos, posters, presentations…the best format will always depend on who is using them.

For example, a video presentation might be an accessible way for those in your organisation who only need to work with your brand guidelines occasionally, such as your salespeople. A detailed digital version would be better for sharing with external design agencies.

The most important thing is to ensure that your brand guidelines are easily accessible for everyone who needs to use them.

What to include in your brand guidelines

Ideally your brand guidelines should include these elements:

• An overview of your company and its culture, your brand strategy and your values – ie who you are, where you’re going and how you want to get there.
• Brand colours, which will generally include the pantone, RGB, Hex and CMYK codes to ensure an identical look across your marketing collateral. This should include the colours within your logo as well as any complementary colours you use.
• Which fonts to use (which may differ between print and digital), including sizes and if/when to use variations such as italics and bold.
• How your logo should be used. This could include:
  • Minimum and maximum sizes.
  • Dark and light background versions (if relevant) and any other colour variations allowed.
  • Landscape, portrait and square orientation versions and when to use them.
  • Spacing (padding) required around the logo.
• Use and positioning of any tagline associated with the logo.
• Specifications for creating design elements, such as icons, infographics, tables, buttons, etc.
• The style of photography and videography to use.
• Tone of voice, or how to speak for your brand. This can include:
  • An overview of how language should be used. Should it be formal or informal? Technical or jargon-free? Contemporary or traditional? Aspirational or down to earth?
  • A library of specific words and phrases which it’s good to use.
  • Grammatical preferences (such as the use of contractions, or the passive vs active voice).
  • Punctuation preferences (for example, do your bulleted lists start with capital letters, have full stops, commas?)
  • How the tone of voice might differ between communication channels (technical documents might sound very different to social media posts).
  • Examples of how to write for your brand, explaining what is good about each one.

In creating your brand guidelines it can be useful to include what is not acceptable, for example changing the aspect ratio of your logo or using slang terms in copywriting.

As well as writing the rules, your brand guidelines should include plenty of illustrations to help guide the reader.

Your brand guidelines may also include templates for commonly used items, such as:

• Business cards
• Headed paper
• Word documents
• Presentations
• Video opening/closing images
• Email signatures
• Advertising
• Social media images

Larger organisations may require separate or adapted guidelines for internal company communications.

Examples of brand guidelines

Extracts from our brand guidelines for Fantasy Football Hub and Albion Languages:

Define your brand guidelines

We are a Sussex branding agency helping ambitious businesses align their brands to the type of customers they want. Creating pragmatic brand strategies, eye catching brand identities and effective brand guidelines.

Get in touch to discover how we could benefit your brand and your bottom line.

This year’s colour of the year is PANTONE 17-3938 Very Peri.

About Pantone Colour of the Year

Pantone created a standardised colour system back in the 1960s, enabling designers around the world to talk about colour in the same language.

Each year Pantone looks at global trends and influences to select a single colour which they feel will epitomise the year to come.

Very Peri

We love the positive feel of this year’s purple tone – Very Peri.

As Leatrice Eiseman, Executive Director of the Pantone Colour Institute, puts it:

As we move into a world of unprecedented change, the selection of PANTONE 17-3938 Very Peri brings a novel perspective and vision of the trusted and beloved blue colour family, encompassing the qualities of the blues, yet at the same time with its violet red undertone, PANTONE 17-3938 Very Peri displays a spritely, joyous attitude and dynamic presence that encourages courageous creativity and imaginative expressions.

Will lots of brands suddenly switch to purple?

Purple is an interesting option for a brand identity. It’s a close relative of blue, which is the most popular choice for a brand colour, but it’s most definitely not blue.

Purple is said to be associated with luxury, quality and authenticity.

It’s also a popular colour with some tech brands, think Yahoo and Twitch for example.

It’ll be interesting to see how much this decision influences marketing, or the wider world, over the coming year.

Look back at the Pantone colour of the year 2021.

This year’s Pantone Colour of the Year is PANTONE 17-5104 Ultimate Gray + PANTONE 13-0647 Illuminating.

About Pantone

Pantone revolutionised the world of graphic design when, back in 1963, they introduced the Pantone Matching System to catalogue colours.

This created a colour standard which allowed designers across the world to communicate in the same language.

Pantone Colour of the Year

Since 2000 Pantone have analysed trends and influences in the world of design to select a single colour to represent the zeitgeist of each year.

What this year’s colours mean

This year’s colours combine the practicality of grey with the positivity of yellow. Leatrice Eiseman, Executive Director of the Pantone Colour Institute, explains:

This is all very nice, but what does it mean in the real world?

To be honest, the Pantone Colour of the Year is really about promoting the Pantone brand.

But it does also remind us of the importance of colour and the impact it has on creating the right (or wrong) identity for your business.

The bright, happy, energetic feel of yellow works well for brands who want their identity to reflect these traits. This can be particularly beneficial if targeting younger generations, think Chupa Chups lollies or MTV.

Meanwhile, the more conservative tones of grey are understated and inoffensive. Hence grey is a popular choice for brands seeking to appeal to the widest audiences, such as Apple.

The colour psychology behind your brand

If you’re keen to know more, here’s an insightful article from canva.com about colour psychology and big brands. Can you guess which colour doesn’t feature at all in the logos of the Fortune 500 companies?

Colour is just one aspect of your brand identity.

Our work looks at the full spectrum of your brand, what it means to your clients and how it can be developed to grow your business.

Tomango is a leading creative agency offering web design in Sussex. This guide, How to Create a Website Design Brief, together with our free downloadable Website Design Brief template, will help you understand the process from the point of view of the agency or web designer, so you know what to include and how much detail to provide.

So, you’ve been asked to create a website design brief.

We’ve broken the guide down into sections to make it a bit more manageable. There are 14 sections in total.

Have a read through this guide first, then

Why a good website design brief is important

If you’ve got to this point, you’ve already established that you need a new website, and given some thought as to what sort of website you need.

The next step is to make contact with the right people to work with you on the project to design and build the website you need. These people might come in all sorts of shapes and sizes; from freelancers and one-man-bands to small or large creative agencies.

Whoever you decide to approach, you’ll get a better, clearer response from them if you can give them a good website design brief.

You should certainly expect a good web agency to give you guidance or ideas that add value to the project, and you should always have a detailed consultation period before any work gets underway, but by following this guide you can tell them everything they need to know about your business/organisation so they can give you an accurate quote.

What you should include in a good website design brief

Let’s take a look at the different sections you should include in your brief;

About you

First of all, the agency needs to know a bit about your company to understand the background to the project and get an idea of what you do. In this section, try and include:

1. Basic company information – the company name and website address
2. What you do – try and sum this up in one or sentences
3. When the company was established – don’t worry about an exact date, but it’s useful to know if you’ve been trading for 2 years or 20
4. A brief history charting key changes of direction – if you started doing one thing, then moved into new markets, this is useful to know
5. Where you’re based
6. How many staff work for the business
7. Annual turnover – this is the quickest way to get an idea of the scale of your operation
8. The short and long term goals of the business – try and keep this to one or two sentences. For example “We want to increase our sales by 50% in two years, aiming for a 20% increase after the first 12 months.”

Aims of the project

A good web agency will design a website that helps you achieve your business goals, so it’s important they understand what your aims are. The more specific you can be here, the better.

1. Why do you want a website? Sum up in one sentence what you’re hoping the website can do for you
2. What needs to be achieved for you to consider the project to be a success? This could be a specific volume of sales or an increase in website traffic, or conversely you may be looking to save money through efficiencies. What targets do you want to set?

Target audience/markets

The new website needs to be designed for your customers, so the web company needs to understand as much as possible about who your customers are. Include all the following points that are relevant to you:

1. What specific industry sectors do you work in?
2. Geographically, where are your customers based? Are they local to you? How local? Within 10 miles, an hour by car? Are they nationwide, or even global?
3. What does your existing customer base look like? Try to sum up in a couple of sentences who you work with at the moment
4. What would you like your customer base to look like? Is it simply “more of the same”, or would you like to get more of a particular type of customer?
5. Describe your ideal customer – this could obviously be more than one type, but try to keep it to just two or three – the aim is to give the web company a bit of a steer as to the direction you want to go in
6. Who are your three main competitors? These could be existing competitors or those you would like to become competitors. Give the company name and website address for each
7. When they land on your website, what do you want your customer to do? What’s the end game? Do you want them to buy something through the website, or make an enquiry? Maybe you want them to subscribe to a service. List out the thing(s) you want the customer to do.

The current website

If you have a website already, knowing a bit more about it can help the web company understand where you want to go with the new one. Obviously if this is your first website, you can skip this bit.

1. When was the current website built?
2. How much traffic does it get? Log in to your Google Analytics (if it’s set up) and take a look at the number of Sessions per month. An average over a year or two is as much detail as we need
3. What devices are people using to visit the current site? It can be useful to know whether there’s a particularly high percentage of users viewing your site on mobiles or tablets. Check your Google Analytics for the percentages over the last year or so
4. How many sales or enquiries does the current site generate per week/month? How do you feel about it?
5. What’s wrong with the current site? What don’t you like about it, what’s annoying, what could be better?
6. What’s good about the current site? What do you like, what works well?
7. How well does the existing website reflect your brand? Do you feel it represents you well? If not, why not?
8. What’s being re-used from the current site, and what’s being chucked out? Are there bits that absolutely must stay?

The more the web company knows about why your existing website isn’t working, the better, so include anything else you feel is relevant.

The new website

Now you need to focus on what you need from the new website.

In a previous post, we explored the different types of website, and the list of potential features is too long to include again here, but you should consider the following:

1. What are the aims of the new site? This provides more detail on the earlier question of the Aims of the Project. Some aims we often discuss with our clients are:

• To increase traffic to the website
• To raise the brand profile of the company/organisation
• To generate enquiries/sales
• To move into new markets
• To attract the best new recruits

What’s the approximate size of the website? Typically this is expressed as an approximate number of pages

What are the key features you want/need to include? Some features we often talk about are:

• Portfolio/Case Studies/Gallery of previous work
• Ecommerce (include an approximate number of products, and any ecommerce-specific features you want to include)
• Events calendar
• Online bookings
• Listings (properties, cars, jobs)
• Interactive map
• Filters, to help users find specific information
• Members-only areas – content that can only be accessed via a secure login
• Blog or News section
• Social Media integration – a Twitter or Facebook feed, for example
• Discussion Forum
• Current Vacancies

What content needs to be updated frequently, and who do you see doing it? Do you have the resources and skills in-house for someone to make changes using a Content Management System (CMS) or would you prefer the web agency to look after any changes for you?

• If you want a CMS, are there any specific requirements (for instance, allowing access to multiple users)?
• What’s the website’s Call to Action? (also known as a CTA). This adds more detail to the earlier question about what you want the customer to do when they visit your site. If you want to generate enquiries, do you want them to fill in a contact form, send you an email, or pick up the phone to talk to you?
• Are there any third party systems you need to integrate with? If you’re an Estate Agent, do you need to link in  to RightMove or Zoopla? Do you need to link to a CRM or Accounts software?
• Does the website need to be available in other languages, and if so, who’ll be doing the translations?

Future developments

In order to deliver the best return on your investment, your website should be future-proofed as much as possible. If you can help the web agency look further down the road, they can make your new website work harder for longer.

1. What future plans does the business have that need to be taken into consideration at this point?
2. Will you want to add ecommerce or one of the other features listed above? Maybe there are some features on your wishlist that you don’t have the budget for right now
3. How does the website need to cope as new content’s added? What happens when, in two years’ time, you”ve got five times the blog posts you do now?

Content

Start thinking about the content for the new website as early as possible.

1. What copy have you got already? It’s tempting to just move all your existing content across to the new site. We strongly urge you not to do this. If your current site’s no longer up to scratch, a big part of this might be because the content needs to be overhauled
2. Do you need a content audit? We suggest taking the time to review all the content on the current site. Some of it will probably stay, or form the basis for the new content, but a lot of it will need to go, or be restructured
3. What new copy needs to be written? And who’s going to do it? Do you have the resources in-house to not only do it (copywriting can take up a lot of time), but to do it properly? We frequently see clients spending a big budget on a new website, only for it to be let down because there’s been no investment in proper copywriting
4. What images do you need, and what have you got? Poor images can undermine even the most beautiful website. Consider employing a professional photographer to take the exact pictures you need
5. Have you got the right quality video clips or other assets that you need, such as graphics or downloadable documents?

Design brief

The web company needs to have an initial design brief to understand the direction you want to go in. The best web agencies work closely with their client in the early stages of the project to define the brief fully, but this gives them a good starting point.

1. List 5 words to describe your company
2. What are your USPs? What sets you part from the competition? Why should a customer come to you instead of someone else?
3. Provide a bullet list to describe your company values
4. Provide any other brand collateral you might have – the website needs to fit with the rest of your brand material, so it’s useful to provide examples of things like business stationery and any brochures you might have
5. Reference websites – provide 3-5 examples of websites you either like or those of your competitors. Note any aspects about the sites that you either like or dislike, being careful to be objective and put yourself in your customer’s shoes. Remember to avoid one of the most common mistakes when creating a website design brief; a good website isn’t going to be designed for you – it’s going to be designed for your target audience

Marketing

To get the most from your new website, it should work alongside your other marketing activities, both online and offline. To deliver a website as part of a properly joined-up campaign, your web agency needs to know what else you’ve got going on. Tell them about:

Digital marketing – what other online activity will you be doing?

• SEO (Search Engine Optimisation)
• PPC/Google Ads
• Social media (if so, which platforms are you active on?)
• Email marketing – is this something that needs to be included as part of the project?
• Content marketing

Offline marketing – what other traditional marketing are you involved in?

• Direct mail campaigns
• Brochures, flyers, leaflets
• Outdoor advertising
• PR campaign
• Sponsorship
• Vehicle livery
• Is the website project part of a rebrand? Is the rebrand part of this project – do you need the design agency to quote for this too?

Budget and timescales

Don’t be in any doubt; providing a budget is extremely important.

Agencies can propose the right solutions for your circumstances, and you’ll be able to compare responses on a like-for-like basis.

Timescales are also important to know from the start – if your deadlines can’t be met by the agency, it saves everyone time if they know up front. In your website design brief, be sure to include:

Timescales – provide both your ideal start and finish date. Have you got a specific deadline to work to (perhaps a product launch or another marketing commitment)? If you’re not sure how to work out timescales, or don’t know what’s realistic, here’s a rough guide as to what to allow for each stage:

• Planning and specification – 2-3 weeks
• Design phase – 3-4 weeks
• Development phase – 3-4 weeks
• Content population and initial testing – 2-3 weeks
• Final snagging and pre-launch testing – 2-3 weeks

Budget, for:

• Initial site design and development
• Web hosting
• Ongoing support and maintenance
• Ongoing digital marketing

Maintenance

This is often overlooked in a website design brief, but is actually very important. Any good website needs to be maintained to some level, otherwise it will go stale and won’t fulfil its potential.

1. Who’s going to be responsible for updating the site – will you do it in-house, or would you prefer to outsource it all to the web agency? Consider whether you have the skills and resources to do it properly; oh, and what happens if that person leaves the company?
2. What needs updating frequently? These might be the updates that it makes sense for you to do yourselves using a CMS. Less frequent changes, or changes requiring creative input might be better carried out by the design agency
3. How much input will you need from the web agency and how often?

Technical

Outline the key technical considerations for the project.

1. 1. Is web hosting required? Do you have specific requirements from an SLA (Service Level Agreement) regarding back-ups, guaranteed up-time etc.
   2. What domain name’s being used for the new site?
   3. Do you require email as part of the project? Bear in mind that changing email providers is fraught with danger – it it ain’t broke, don’t fix it
   4. Do you have any particular requirements or preference for the platform used to build the website? This is usually a consideration if members of staff are trained on a particular system and you want to stick to it, but unless you have a specific need, we suggest letting the web company come back to you with their recommendation

5. If your project’s for an ecommerce website, do you have your payment provider set up? This can take several weeks or months to sort out, so if you haven’t got started already, now’s the time to get the ball rolling
6. Do you have any special technical requirements? Maybe you require a particularly high level of accessibility or know that your users are likely to be using very slow connections

Contact points

It’s a good idea to have worked out who in your organisation needs to be involved with the project and who’s doing what.

You need to decide:

1. Who needs to be involved in the project
2. Who will be the main point of contact
3. Who’ll be responsible for collating content
4. Who needs to be involved in sign off at each stage
5. Who will be updating the site

Next steps – what you need from the agency

Finish your website design brief with a short summary of what you want to get back from the design agency.

At Tomango, we usually provide a written proposal, outlining our intended approach from a creative and technical point of view, the costs (for both the initial website build and any ongoing fees), timescales and any assumptions we’ve made.

When you’re completing this section, remember to include:

1. What you want from the agency (proposal, tender, outline quote, examples etc.) and when you want it
2. Who they should send it to
3. How you can be contacted if there are any questions

Write your website design brief

Save time creating your website design brief by downloading our template. Our example’s based on a fictional company that needs a brochure website, so some sections might not be relevant to your project, but the format’s the same and it should save you a lot of thinking time.

Good luck with your website design brief, and don’t forget to include Tomango on your list of agencies to quote for your project ;o)

Over the past year or so I’ve been heavily involved in the project/studio management at Tomango working on various branding, website, and marketing projects. This work requires managing multiple projects, clients, and third parties like freelancers on a daily basis.

Working with a freelancer

Some of these projects have seen us work with freelancers; either ones that we’ve brought onto a project to bridge a skills gap or ones that the client has already built a relationship with and wants to use for a particular part of the project.

While working on these projects, I’ve been able to gain great insight into both the benefits and disadvantages of using a freelancer for the creation of your brand, website or digital marketing.

If you’re not sure whether to use an agency or a freelancer for your project, I’ve listed a few things to consider to help you make a decision.

DISCLAIMER: This is by all means not an article about dismissing the use of freelancers; there are many very talented individuals out there who will be more than capable of tackling your project and giving you a great end result, this is more to question about which route is best for you and your business!

1. Budget

This is the main one.

There’s no way of getting away from it – using a freelancer will be cheaper (on paper) than using an agency. However — there are hidden costs to consider when opting to go down this route!

Let me explain, using a different sort of freelancer as an example.

I’ve recently completed a major renovation on my house, and — mainly due to budget constraints — I decided to manage the individual trades myself rather than instructing a single contractor to carry out the work.

This undoubtedly saved me money. However…it took far longer to complete than I thought. THIRTEEN months to be precise. It also took up all of my spare time, and with a young family, there wasn’t much to begin with!

At Tomango, I have the privilege of working closely with a number of different clients on a daily basis. Some decide to use all of our services, but there will always be some who prefer to carry on using their current copywriter, photographer, designer or developer.

We always try to accommodate the needs of our clients when working on a project, however, there’s no getting away from the fact that the project will take longer and require more of your own time and input in managing the different disciplines – which in turn will take you away from the day to day running of your business.

It’s probably better to only be pulled in one direction than two, three or more!

2. Planning

For us, getting a solid plan in place is such an important part of a project — especially when it comes to creating a website.

If we’re working with you, before we even think about writing the first line of code, we need to understand what you’re trying to achieve. We work closely with you to develop a brief, which leads to the creation of a project plan, which forms the foundations of the project.

“You know what they say; fail to plan, plan to fail”

If you decide to use a freelancer, you’ll probably need to create the brief yourself. This can take time; first for you to get your head around exactly what you want, and then to make sure you’re communicating this in a clear and comprehensive manner to a freelancer.

FYI if you’re unsure where to start with a website design brief, take a look at Mark’s article on how to create a website design brief, you’ll also find a handy template that has already been tens of thousands of people!

3. Knowledge

There are many freelancers that claim they’re a one-stop-shop, able to design and develop for the web, and also have experience with digital marketing. All I would say here is to be wary!

At Tomango, I’m lucky to be able to work closely with people that have chosen to specialise in one of these areas and as a result have gained valuable experience and knowledge in their chosen field. Every day, I see how having people that are actual experts, rather than a ‘jack of all trades’, can make a huge difference to a finished project.

4. Support

Tomango will be six this year, and we’re planning on being around for many more years to come. On the flip-side, there are a few freelancers that I’ve come into contact with recently that have decided that going it alone isn’t for them any more and are looking to return to a permanent role.

If you’re faced with this situation, you might be left with a website with no support or, even worse, an unfinished project.

Either way, it’s then going to take you time and possibly further money to find someone else. What happens if your freelancer takes a well-earned break and whilst they’re off your website/emails go down? You might need a plan B!

From time to time you might require additional support. If you work with Tomango, we’ll always try and respond to your queries in a timely manner and keep you updated on the progress – no support tickets here!

How we can help – whichever decision you make

If after reading this article you feel that using a freelancer is your preferred option, then please feel free to get in touch. I have a number of freelancers that I can happily recommend, however, if you would like to find out more about our services and how we can help grow your business, get in contact via our contact page or call us on 01273 814019.

With the new website now live, we continued the brand rollout for the Concept Tag with the creation of a new brochure for Agon Systems.

The brochure was created to promote the Concept Tag; the “World’s most secure EAS Tag”. This revolutionary new product from Agon Systems eliminates illicit tag removal and is proven to reduce losses by 66%.

Detailed brief

By obtaining a detailed brief from the client it became clear the brochure had to reinforce the key values of the product; quality, reliability and durability. This was achieved by the use of strong typography, engaging copy, high impact images and the final print finish.

The finish

It was agreed the brochure was going to be finished in a matte lamination.  Lamination adds a layer of protective coating to the printed surface whilst also improving its sturdiness and water resistance. Lamination also has the added benefit of improving the tactile feel of the printed surface, lending it a smooth finish.  Matte lamination creates a very luxurious and elegant finish to any printed materials.

Another crucial aspect of creating a quality experience for the recipient is the density of the paper. Paper density refers to the thickness of the paper stock and is measured in GSM (grams per square metre). Due to the high quality look and feel we wanted, we decided on using a board thickness of 350 GSM.

To ensure the best possible finish was achieved we not only designed the brochure but also created the copy, art directed the photo shoot and managed the printing. This ensured the highest quality of all the elements we needed to bring together to deliver such a great result.

Part of a wider marketing portfolio

This is just one of the items of marketing collateral we’ve created for Agon Systems. Other items include stationery, product sheets, leaflets, signage, artwork for exhibition stands just to name a few.

Next steps

If you like what we’ve done with this brochure and would like us to help you with yours, call Mike or Mark on 01273 814019 or get in touch using our contact form.

For the past six months we’ve been using a website called InVision – a prototyping and collaboration tool. The concept is simple – upload the designs, share with the client and they then leave feedback.

Before InVision: a long process

Before we started using InVision it seemed to be a long process in reaching a final design. This used to involve a large number of emails and telephone conversations back and forth, with the client having to explain where and what they required changing. Using the note tool, the client can add a pin to the exact area they want to change which allows us to quickly pin point what part of the design they are talking about.

Boards

Another key feature are ‘Boards’; these provide organisational tools for creating context around a project for presentations, asset management, and more. Layout options allow you to create visual hierarchy for ideas.

Boards also allow commenting and downloading, bringing the design process together into a familiar, central location. Plus, you can share your Boards with clients and other team members.

Several integrations

InVision can easily be integrated with Dropbox and project management tools such as Slack and Trello. We use Dropbox as a backup just in case files are accidentally deleted from the InVision app.

Needless to say, we’re having fun using InVision and we can’t wait to see what new features are rolled out in the coming months.

Working with Tomango

Do you need help with your branding and design? Chat to the team today and explore how Tomango can help.

Creating a website design brief is a vital part of any web project.  By focusing on the aims of the project and who your target audience is, you make sure you stay on track and get an end product that provides a much bigger return on investment (ROI).

But…

We’ve seen several common mistakes made during the project brief stage that you should be careful to avoid.  True, some of these border on the comical – but some of them are very easy traps to fall into.  By avoiding them, you’ll dodge making a costly mistake.

1. Designing for yourself, not your customers

This is the most common mistake of all.  I’ve lost count of the number of times a prospective client presents a brief (or is talking about it) and says something like “I really like the – choose one from Aston Martin/Rolex/Apple – website.  Ours should look something like that”, forgetting for a moment that their own customers are the polar opposites of these brands’ target markets.

In the worst cases, this can turn into little more than an ego-trip – something for the MD to show off to his friends at the golf club.  AVOID AT ALL COSTS.

You must be brave.  You must put your own personal tastes to one side and put yourself in your customer’s shoes.  What will they expect/want to see?  What will reinforce your brand values and get your message across?   How can the design encourage them to buy from you?

My own difficult experience

I can speak from first hand experience about how hard this can be.  When I was first shown the concept for the Tomango brand identity, we encountered a potential flashpoint about colours.  The fact is – for childish reasons relating to the football team I support – I HATE RED.  Always have, probably always will.  My initial reaction to the colours being put forward for Tomango was one of complete revulsion, but I quickly realise that this was, frankly, pathetic.  The logic and rationale for using these colours was completely sound and I decided to put my personal feelings to one side and put faith in the design.  It was what our customers would want to see – my tastes didn’t matter.  Because I managed to get over myself and put our customers first, we got a much better end result.  The same applies to the design of your website.

2. Trying to be like Amazon/Facebook/Google

At some point back in 2010, I met an interesting lady called Pam (not her real name) who wanted to discuss some “ideas for websites”.  Mentally quietening the alarm bells that started ringing in my head, we had a civilised-but-not-particularly-productive chat about some of her ideas, most of which were rubbish.  And then, just as it seemed we were nearly done…

Her: “So tell me – what would it cost to build something like Facebook?”

Me: “Erm…”

Worryingly, this isn’t the only time this has happened to me (although not specifically about Facebook).  Often I see a website design brief that will include a legend such as “Search facility required – like Google” or “Related products must be shown, like you get on Amazon”.

Firstly, do you really need this level of functionality?  Unless your site deals with massive amounts of data/orders/users, you probably don’t need to go that far – especially in the early stages of the website’s life.  Concentrate on your site’s core features and do them well.  You can always add to them or develop them later, when a need has been established, and when the website is starting to become viable.

Secondly, be aware how much time, money and resources have gone into the development of these huge sites.  Years of research and analysis, millions of dollars, and teams of scores – if not hundreds – of highly talented designers and developers work on these projects.  That might just be a little out of your budget.

3. “Let’s make it different”

There is a Danish man called Jakob Nielsen who, for those of you that don’t know a great deal about the web, is THE guru on usability – i.e. making websites easy to use.  What this guy doesn’t know about web usability you could write on the back of a very tiny postage stamp.

Jakob’s Law of the Web User Experience states that “users spend most of their time on other websites.“  What he means is that your users form their expectations for your site based on what’s commonly done on most other sites and if you deviate, your site will be harder to use.

Consistency is one of the most powerful usability principles
Jakob Nielsen

You see, consistency is good.  It’s one of the most powerful usability principles; when things always behave the same, users don’t have to worry about what will happen.  This increases their confidence in using your site, which means they’ll like it more.

Recognise these conventions and stick to them.  Don’t be different for the sake of it.  Unless you want to lose as many users as possible, of course.

4. Everything must sit above the fold

Here’s a very common misconception that threatens to undermine the entire design of your website.  And it drives web designers absolutely nuts.

When referring to web design, “Above the Fold” refers to the part of the page the user sees when they first land on it, without needing to scroll.

Misleading statistics

The problem usually starts with this often-cited statistic, from our erstwhile friend Jakob Nielsen, back in 2010; 80% of users spend their time above the fold, and only 20% go below the fold. Holy Moly! We’ve got to keep everything above the fold, right?  Well, hold on just a sec…

This stat’s a bit misleading because most of the time the navigation and search is at the top of a page, so when you get to a website, the first thing you most often look for is the menu, which is why the stats are so heavily skewed.

But when people get to the page they’re looking for (and if they found you from a search, this might be the first page they’ve landed on), they will scroll.  And scroll, and scroll.  Be sure of this fact: everyone knows how to scroll.

So although it’s still important to put certain things above the fold (see point 3 about conventions within web design) don’t feel you have to try and cram everything in there.  Maintaining white space, telling a story and encouraging your users to scroll down is actually more engaging and in some cases will result in more sales.

It’s not just our point of view either:

Life Below 600 pixels Why “The Fold” is a myth – and where to put your call to action

5. Opening new browser windows

Time and time again we see this on a website design brief: “All external links must open in a new browser window”.  Why?  The thinking is that by forcing a new window or tab to open, no-one actually leaves the client’s website, because it will remain open in the original window.

We’re yet to see a compelling argument to back this up, but can think of plenty of reasons why it’s actually a bad idea that you should avoid.

Firstly, many people still don’t use tabs when browsing multiple sites.  Those that do would surely like to be the one in control of it – that’s just plain politeness.  Secondly, many users might not realise that a new window has been opened, leaving them confused by a greyed out Back button.  Thirdly, using the Back button is probably the first (or maybe second, at a push) thing that a user learns when they start using the web.  This is the way most people will normally get back to previous sites.  Finally, it’s about trust – if you don’t trust in your own website to be good enough or interesting enough for a user to go back to, that sends out a pretty negative message.

A guide to creating a website design brief

So we’ve covered some common things to avoid when putting together your website design brief, but how do you go about putting together a good one?

The key things to make sure you cover in your brief are:

1. An introduction

It’s useful for the website designer to know a bit of background.  Include a paragraph or two about your company and what you do, what you sell etc.

2. Your current site

Make sure you cover when it was built, how much traffic it gets at the moment, what’s good and bad about it and what frustrates you about using it.

3. The new website

Outline the aims of the site and how it fits in with the overall aims of the business.  Is it to attract more traffic and sales, or to communicate better with existing customers?  Is it there to support other marketing activities? Do you want to sell through the website (via ecommerce)?  Who is the target audience?  Maybe this has changed, or you’re aiming to reach a new market.

4. Reference websites

Listing some competitors’ websites can be useful – together with some notes as to what you feel is good or bad about them (remembering to look at this from your customer’s point of view – see point 1 in our Common Mistakes list above).

5. Budget

Outlining your budget is important.  You’ll get better and more accurate quotes from everyone if they’re all working to the same brief and know what the budget is.  What’s the budget for the design and development of the website?  Do you have a budget for ongoing online marketing?  What about ongoing support and maintenance?

6. Website content

Resist the urge to just copy and paste your content from your old site to the new one.  A well-planned website project should consider the entire structure of the site, including what content is going on which pages.  Who will write the content?  Do you need the web agency to do this?  Oh, and one other thing – don’t wait til the last minute to do the content – start it now.

7. Technical stuff

Do you have an existing domain name that you need to use?  Where is this managed – can the web agency have access to it to manage the go-live process?  Is your site likely to be targeting people with special needs or requirements like limited mobility or visual impairment?  What proportion of your new site’s users are likely to be using mobiles and tablets?

8. Maintenance

Who will be responsible for the ongoing maintenance of the site?  Will you be doing it in-house?  Will you need training on using a new system?  How many people might this need to include?  Would you prefer your web designer to handle updates on your behalf?

Next steps

We can help with all aspects of your website, from your early website design brief to finished product. Get in touch today to discuss more.