Can I build my own website? 1. Web design layout

This is the first of a series of articles about web design and how it’s possible to design and build your own website for your business. 

Like anything, web design projects take far longer than you might at first think and hiring a local web designer is usually the best route to take but if you have the time and are willing to give it a go, here are some tips for your web project.

  1. The layout

Web designers use a visual hierarchy to guide visitors’ attention to important parts of the website first. The website layout includes the position of various elements (high or low on the page), font sizes, visuals such as video, images and icons and contrast (colour and white space).

web design layout

Visual hierarchy is why your eyes follow a certain path and we need your customers to follow a pre-designed path so that they end up buying from you. Most people need a visual guide to the content, so web designers help them by creating paths to follow, also called the ‘customer journey’.

More whitespace (often seen as a waste of space by clients) is a valuable way to keep the focus on the main part of the website design by allowing the design to ‘breathe’. A lack of whitespace can create a crowded and cluttered design that is confusing.

Headings and sub-headings

Use a descriptive, keyphrase-focused headline high on the homepage and all internal pages so that the visitor knows he/she is in the right place. This heading or sub-heading will help to guide the visitor to your website and will also help Google to understand what the page is about and to match up the page with what someone has searched for.

No one searches for ‘Welcome to our website’, so don’t use that as the main heading, say something like ‘Suppliers of wooden widgets in Devon’ (assuming you are based in Devon and supply wooden widgets, of course!)

So, rather than write a fancy, but vague headline, write something descriptive. Make sure that you explain what your business does and keep the main heading high up on the page, above the fold*.

What’s a ‘fold’?

The fold comes from the days of newspapers where the important part of the front page was ‘above the fold’. This meant it was likely to be read first was newspapers were folded when displayed.

There are two opinions on this, some people say you should have the main details above the fold so that visitors to your website don’t have to scroll whereas the other opinion is that it doesn’t matter as long as you have added a compelling reason to scroll. People need a clue that there is something worth scrolling for. wHere are two great articles about the fold .. “There is no fold!“ vs “The fold still matters.”

One study showed that visitors spend 80% of their time above the fold.