Good website design increases website visitors and encourages them to view more pages. A bad design does not. You should therefore take a hard look at your site and ask yourself, is it easy to use? (Part 1 of a 7 part course.)
A few tweaks to the design of a site can make a significant difference to the number of visitors it gets and how long they stay. Improve it and you will boost website traffic, get more views and people will stick around longer.
This increase in website traffic is valuable on its own, but it is also a signal to Google that you should appear higher in search results. A site that is easy for visitors to navigate is also easy for googlebot, which crawls sites looking for interesting content. This means even more traffic sent your way from the search engine.
A good website design that is easy to navigate is a key factor when you apply to advertising networks like Google AdSense. Sites with bad designs are likely to be rejected and great designs are more likely to be accepted.
Website design is a huge and complex subject and it is not possible to cover everything here, but let’s look at the basics, the things that are easy and quick to implement and result in steady traffic gains.
Make it mobile
As a website owner and developer, you probably access your site mostly from a desktop or laptop computer with a big screen. However, an increasing number of people are using mobile phones for browsing the web. More than ever, it is important that you test your site on a phone.
If your site looks and works great on a phone, it will increase website visitors and get more traffic from search. If your site is poor on a phone, you could be losing visitors. If googlebot cannot navigate your site on mobile, it may not index all the site’s pages.
It is useful to regularly use a phone to access your site and at least after making any design change. Test everything on mobile. If you want to use a desktop or laptop computer, there are ways to emulate a phone. Keep a normal tab open and another tab or window with the phone view.
If you use an Apple Mac, read See your site on any device with a secret Safari feature. Basically, you enable the developer mode in Safari preferences, then go to Develop > Enter Responsive Design Mode. Apple Mac or Windows PC users, read How to view your site on any device using Blisk browser. If you use Edge browser on a PC or Mac, go to Tools > Developer > Developer Tools. The click devices icon in the panel that opens on the right. in Chrome go to View > Developer > Developer tools and click the devices icon in the panel.
The way your site looks and works on a phone is completely under the control of the theme. If there are problems, look for a new theme that specifically says it works great on mobile. If there is a demo, try it on your phone.
Make your homepage outstanding
Some websites have full blog posts on the homepage and while this can increase the views of this one page, it can make the home page huge, slow and awkward to navigate. You might get big page view numbers for the home page because you have 5, 10 or more blog posts in full, but it slows down the site and people won’t scroll down to the bottom to read the older posts.
The homepage should have post extracts, which consist of an image, title and sentence or two encouraging people to click and read the article. In the WordPress editor, position the cursor after the first paragraph of a post and add a new block. Find and select the More block, which adds a horizontal like in the editor (it’s invisible to visitors).
Add a featured image near the bottom of the panel on the right. Click the gear icon if you don’t see a panel on the right in the WordPress editor and select the Post tab.
Encourage browsing with navigation and menus
Can people find the content on your site? There are sites where About is the first menu item. Is the About page really the most important on the site? Is it the page people want to visit first? No.
People need a way to find the content on a site, so make sure that firstly, there is a menu, and secondly, that the menu helps them find things. For example, you can create menus from categories. If you have a food site you might have categories for vegetarian and meat recipes, or categories for meals like breakfast, lunch, dinner and snacks.
These categories can be turned into menus and when people click them they list all the posts in that category. It helps people to discover content on your site. Go to WordPress > Appearance > Menus to create them.
Other ways to help people find stuff on your site include widgets in the sidebar that show the latest posts, the most popular posts, latest comments and so on. Check the widgets in WordPress > Appearance > Widgets and see if there are any you can use. There are many plugins and themes that add useful widgets that do this sort of thing.
Choose a great theme for your site
The theme controls the look of the site, the way the content is presented, and the menus. It is responsible for the display on a phone as well as a desktop or laptop computer. Get your phone out and browse your website and check that the theme appearance and navigation is OK.
The font used for the headings and body text should be easy to read and large enough so that people who don’t have perfect eyesight can read it. Do not assume that because you can read 9 pt text on your site that everyone can. Some computer screens are not as good as others, and what looks good on yours may not not good on others.
Fonts must be large enough to enable the text to be read on a small phone screen. Don’t just look at your site on a big desktop or laptop computer and think it is OK, check on a phone. Choose a large font with sufficient contrast, like black or very dark grey. Avoid light grey on a white background because some people find it hard to read.
The design of the home page is controlled by the theme. Choose a theme that presents your content in the best possible way. What’s best depends on the content and if your site sells products or services then the home page will be very different to one that has the latest blog posts.
Make above the fold content count
‘Above the fold’ comes from newspapers, which are often folded, especially the large ones called broadsheets. When a newspaper is folded, you only see the top half, so it has to be good or people won’t pick it up and buy it.
The same applies to websites. When you visit the homepage or a post on your site, what can you see without scrolling? This is the above-the-fold content and it is vitally important that it contains sufficient content to make people want to read on. If it is filled with adverts, pop-ups for your email subscription, or other items, people may click away and disappear.
- Choose a great theme that works on phones as well as the desktop
- Test your site on one or more phones or emulate one in a browser
- Choose fonts that are easy to read and large enough for people that don’t have perfect eyesight. Check they are ok on a phone
- Create menus to display posts in your most popular categories
- Put the most important menu items first
- Put widgets in the sidebar to show popular or recent posts
- Ensure content appears on the screen ‘above the fold’ without scrolling
- Make it easy to find and browse all posts. Some themes have an Archive page for example