You can’t have an online business without a website, however, many websites feature design flaws that make navigation and usability of their sites difficult. This can become increasingly frustrating for users and if they can’t navigate your site properly then they are going to click off and possibly never return.
Many web design flaws are easy to fix though so they won’t take you long to correct. Using the web design tips in this post you’ll be able to fix any problems.
Compelling Content Needs to be Your Main Focus
1. Ensure your content has value for the user.
This doesn’t necessarily relate to design but it’s actually more important than design. A web page exists to provide information that is useful to visitors. If it’s not doing this then you’re wasting time. There is no point worrying about the styling of a web page if the information on it is useless because the styling won’t make a difference.
If you want to make money from advertising then you need to make sure that the page is 75% editorial and 25% advertising. The last thing you want is a web page that is an eye sore to readers because it’s full of ads. People want to see and read useful information, not be bombarded by web pages full of ads. Great information should be your primary focus, advertising your secondary focus.
Stay Away from Nasty Elements
2. Avoid distracting visitors with flashing ads, scrolling text and animated GIFs.
Animation and sounds are distracting so keep them to a minimum. If you go onto a web page and are bombarded with sounds and images then you are going to become distracted from the main message of your web page. Keep things like this to a minimum so readers don’t get distracted.
Animated ads are nothing but an annoyance to readers. No one wants to see a flashing ad in their face when they click on a web page. If you are going to use ads then make sure you keep them static rather than flashing which will only infuriate users.
Avoid using scrolling text. Just like flashing ads this is also annoying and is going to cause people to click off your site and never return. The problem with scrolling text is that people can’t read at their own pace. For example you may have a reader who simply can’t keep up with the speed of the scrolling text, or even the opposite, where a faster reader has to sit and wait for the text to scroll along. Think about how frustrating this would be for you.
Make sure that you keep your visitors best interests in mind. When designing a website you need to be thinking about what benefits them, not what you think looks cool.
3. Pop-up windows are seriously irritating!
Pop up windows are irritating and troublesome so please don’t use them. No one wants to be reading through some great information only to be distracted by a pop up asking them to sign up to a newsletter or buy the latest advice filled ebook from an advert. People who use these are not thinking through their users’ eyes because if they were they would realise how infuriating they are.
4. Text over image backgrounds doesn’t work.
Don’t use site text over images because it screams amateur. Not only is it amateurish but it also creates slow loading times for web pages. Generally if a site is using text over an image background it means that the site in general is going to be user hostile, which means you’ll more than likely encounter things like internal links which pop up in new windows, links the same colour as surrounding text, ridiculous keyword stuffing, spelling and grammar mistakes or nasty animated GIFs.
No professional website uses site text over image backgrounds because they know it looks tatty. Unfortunately, some sites made this bad idea popular like MySpace. However, it is something that should be avoided at all costs unless you are a professional web designer who knows what they’re doing.
Make it Easy to Find Stuff
5. Thoughtful organisation is key.
Make sure that things on your web page are organised. Think about the content you have on each web page and make sure that it is organised in such a way that users can easily move from one section to another and back again. There’s nothing worse than going to a web page only to find it’s hard to navigate.
6. Reduce the number of user clicks
Put as few clicks between your visitor and information as possible. This is one of the most important web design tips in this post. The more you force a visitor to click around your site then the more likely it is that they’ll leave your site to never return.
If your home page is a splash page with no meaningful information on it but with a link to click on to access the rest of your site then get rid of it. You should give them access to your site straight away rather than make them do more work.
A great rule of thumb to remember here is if you have less than 450 words of content on a page you should combine that page with another. Many sites spread content out across too many pages when it really could be collated on to one. This will also help with your page rank, as a page with thin content won’t gain much rank, especially with the recent Google Hummingbird update. If there are too many clicks a user needs to perform on a web page then minimise this. It comes back to always thinking about what is best for users.
Another tip to remember, when it comes to ecommerce design, is don’t give the user an option to refine searches to an extent where results will only show one or two items or perhaps no items at all. If this is the case, restrict filter options so the user has more products to scroll through.
7. Page length should be limited to 2 screenfulls.
Be careful about how much info you are putting on each page. You should try and limit it to no more than 2 screenfuls. However, the exception is articles which are long by their very nature. In that case you should make sure they are not longer than 6-7 screenfuls.
8. Provide a link back to the homepage on every page
Make sure that there is a way for users to get back to the Home page. On every page you should include a link to the Home page so users don’t get lost and it’s easy for them to get back to the Home page. Two typical ways of doing this are to include a Home page link in your menu navigation, or make the company logo a link back to the Home page, as this logo should be placed in the website header, which is displayed on all pages. Preferably though you should do both.
Bear in mind that if a user lands on a deep page such as a service or product page from a search engine result, they can’t simply click back to the homepage as this will take them back to the search results. Instead you will need to have a clear homepage tab available to click.
9. Include a menu on every page.
You want people to have the ability to click around your website and access different pages, do this by including a menu on every page so it’s easier for users to make their way around your site. Don’t put navigation links only at the bottom of pages though, make sure they are at the top or down the left of a page.
Overall, you need to make sure that it’s easy for your users to navigate around your website and the easiest way to do this is with menus on each page. Websites usually feature page links in the website footer as well. This comes in handy on longer web pages as the user doesn’t then have to scroll all the way back to the top to see the menu.
10. Don’t use frames.
You may be tempted to use frames but it’s best that you don’t. Although many users do find them useful there are some serious downsides to using them. First problem is that the address bar doesn’t change, which makes it impossible for users to bookmark, link to or share a specific page in your site. Another problem is that if a page within your site other than the frameset shows up in a search engine, a visitor clicking over to that page will see just that subpage without the surrounding frame.
Don’t Slow your Website Down
11. Compress image files for quicker loader.
Graphics can be one of the most annoying things for users because of how long they take to load. If you are going to use graphics on your site then make sure that you use graphics software to compress the files so then they don’t take too long to load and take up less room on your disk.
12. Don’t ruin your website with flashy multimedia.
Flashy multimedia might look good but it’s one of the most annoying things for user experience. No one wants to find it hard to get the info they want because of irritating graphics and other multimedia so be careful with the way you use multimedia on your site.
Make Content Attractive and Easy to Read
13. Keep lines of text within 650 pixels width.
You should always be thinking about user readability with your site. To make your site easy to read you need to keep sentences short, paragraphs short, headings clear and make sure lines of content flow fluidly on to the next. Think about newspapers, there’s a reason they’re organised into narrow columns - so that the reader can flow between lines easily. Blogs are also narrow as this keeps the content compact allowing for faster browsing and content skimming.
To make sure that lines of text are easy to read they need to be no wider than 650 pixels.
14. Web pages should not be too wide or too narrow.
Your pages shouldn’t be too narrow or too wide. Most users tend to have screens that are at least 1024x768 pixels so it’s a good idea to make sure that your page content is limited to 1200 pixels or less.
15. Contrasting colours and simple backgrounds help make text easier to read.
Light text on a light background or dark text on a dark background is a bad idea for two reasons: Your users won’t be able to read your content easily and search engines might consider it as cloaking; a black hat form of SEO which could lead to your site being penalized. Your text needs to be on top of a background colour which makes it simple to read and doesn’t impede the text in any way. There are some websites that use horrible colour combinations which makes it extremely hard to read the text. If you are going to use a coloured background then at least make sure they are contrasting properly so you can still read the text.
A great tip to remember is to just keep the background colour mostly dark or mostly light. You can also increase readability by increasing the text size and/or making it bold.
16. Increase text size for improved readability.
Your content needs to be large enough to read properly. If readers have to squint just to read your content then they won’t be reading it for too much longer. With CSS go for 12 or 13px Arial, and 11 or 12px Verdana.
17. Give your text breathing room with line spacing.
You should have some line spacing after each line so that it’s easier to read. There’s nothing worse than cramped lines of text. You need to ensure that you’re giving your content breathing room as this will not only make it easier for users to read or skim over your content but make it more attractive as well.
18. Don’t use all capitals.
The whole point of writing in capitals is to draw attention to something in particular that you want your audience to notice. It should only be used when there is something special you want your audience to pay attention to. If you write everything in capitals then you lose that effect as everything looks the same, this will result in nothing looking important , so only write in capitals when absolutely necessary.
If you are wanting to draw reader’s attention, consider making the heading stand out by using bold, italic, brightly coloured or slightly larger font but ensure to keep the text which follows it in normal type face. A page full of capitals also looks very amateurish.
19. Don’t overdo it with exclamation marks!
Trust me when I say that using several or more exclamation marks in your content will not make your text any more important. In fact, what this does is quite the opposite as it shouts amateur, inexperienced web design. It also comes across that you’re desperate to get the reader to believe something. Think to yourself: If I was reading this and someone was shouting their thoughts out on the page would I be impressed? The answer is probably no and the excessive use of exclamation marks would turn you off reading any further. After all this isn’t a funny children’s book you’re writing. Your readers expect quality content. One exclamation mark is more than enough to get your point across.
20. Become friends with the spell checker.
Poor spelling is just unprofessional and many people will notice and care if you use poor spelling. Edit your content carefully and make sure there are no spelling errors. A lot of the time if you’re trying to proof read your own words you will miss obvious errors. This is simply to do with the fact that your brain is reading what it wants to read, what it believes it should say, when in actual fact there’s a glaring mistake. Ask a friend to proof read with fresh eyes and an open mind.
Using Links Correctly and Incorrectly
21. Avoid underlining words which aren’t links.
Don’t underline something unless it is a link because people are used to underlined text being a link. If you want to emphasize a word then use italics or bold to emphasize its importance.
22. Links should be blue or underlined, or both.
Users expect links to be blue and underlined because that’s the way they are on 99% of other websites. If you want to use a different colour for whatever reason then make sure it is also underlined so users will know it is a link. By gratuitously underlining words in your content which aren’t links will only frustrate users as they may go to click an underlined word only to find out it isn’t a link at all.
Note that menu links don’t need to be blue or underlined as they should be clearly identifiable as menu navigation links. Using blue, underlined links is relevant to the content within your website’s page body.
23. Explain to the user what the link is for.
If you can you should provide a short amount of information about where you’re linking to. This helps a user when making the decision of whether or not to click on the link. For example, if you have a links page on your website, then give each link a short description of about 1 to 5 sentences. Keep it short but informative and help your users to understand where your links are linking to. After all, you’ve no doubt visited those pages yourself so share your knowledge and enlighten your readers with a description of where the link goes to. Please don’t just put down the name of the site or even worse the plain url without any description.
24. Avoid opening internal links in new windows.
Make sure that your internal website page links don’t pop up into a new window. This is important because it causes confusion when a user has multiple windows open and results in a cluttered browser. Opening into a new window is fine for links to external sites as it keeps your website open but if the link is within your site then make sure it doesn’t pop up in a new window. If a user has too many windows open it will dampen a user’s experience. Imagine for a moment if this is the case and a user clicks five different links on your site, they would then end up with 6 different windows open, all for the same site. This is extremely unnecessary.
25. Describe your link text.
The text of a link should always say where you’re linking to. It should never say something like “link” or “click here” as the link text. Always be specific with your links because it helps your readers. Bear in mind that most readers of your website’s content will skim through rather than reading word for word, so you need to ensure the important points are clearly identifiable.
Here are two examples of how to link to various internal pages:
1) Right way
Take a look at our product specials, best sellers and gift ideas.
2) Wrong way
For product specials click here. For best sellers click here. For gift ideas click here.
Allow for Easy Access
26. Include contact info at the top and bottom of each web page.
A dedicated contact page is a necessity on any website. You don’t want users hunting around your website looking for information on how they can contact you. Nine times out of ten a website will list the contact page in the menu navigation at the top of the page. This is where most users will look for it. However if you don’t want to include the contact page link in the navigation, ensure there is a link to in the footer of your website and perhaps even list your business name, address, telephone and email in the footer as well. Your job is to make life easy for your users and making your contact details easily accessible is a good place to start.
If you don’t want to list your company phone number or email due to limited resources, ensure you state this on your website so users don’t spend ages looking for details which aren’t there. Also, if you don’t have a dedicated company email, consider including a message form so users have the ability to contact you without knowing your direct email address.
Test, Test and Test Again
27. Make sure links are always working.
You need to test your website regularly to make sure everything is working. This means testing images to make sure they are displaying properly and actually clicking on links in your browser to make sure they are working and directing to the right pages. This advice seems obvious but there are many websites with broken links which is incredibly frustrating for users and bad for search engine optimisation.
28. Get rid of dead external links.
You need to check that external links are working periodically. Every now and then sites will cease to exist or become extinct and the links will stop working. Clicking on a broken external link will not only result in your website looking unprofessional but could cause the user to click off your site for good having had a bad experience.
29. Let the readers know when content was published
If your site has information on it that can become outdated then it’s important you include on the page when it was last modified. Think of a technology website, that sort of information can become outdated in a few years so it’s important you make sure the information is updated and modified. This way a user can be sure the information is still relevant and useful.
If however your websites content won’t become outdated, purely by its own nature such as poetry, stories, art or web design for example, a published date isn’t essential but your readers may still be grateful for one.
Other Tips for Webmasters
30. Don’t steal other’s content.
It should go without saying that you shouldn’t steal content but I’ll say it anyway, don’t steal other people’s content. All of your content should be original and in your own voice. Copying other people’s content is also a sure fire way to make sure your website will be ranked lower in search engines as well.
31. Don’t hotlink to other sites’ images or MP3’s.
Any images you link to should be on your own server. That is, your code should look like<img src=/images/pic.gif> and not <img src=http://someothersite.com/images/pic.gif>. Embedding images into your pages is something that causes many problems. It can result in potential copyright violations and is also considered a theft of bandwidth from the other site. Not to mention it also screws with the other site’s stats so best policy is to not do this at all.
32. You don’t need permission to link to other sites.
There is no need to ask a site owner for permission to link to their site. If anything you are doing them a favour by linking to their website because it will result in more visitors to their site. It is also very annoying for a site owner to be bombarded with emails asking for permission to link to their site.
33. Don’t pester other webmasters to exchange links.
It is also annoying for site owners when people email them asking to link to their website. If you want your site to be linked to then focus on making it link worthy with great content. So don’t go asking for link exchanges, instead focus on producing great content so people will naturally want to link to your site.
In Conclusion
Website design is an important component of any online business. These tips are simple to implement and they are designed for the site owner who is not a professional web developer or designer. Just by applying these simple tips to your website you’ll be making your site user friendly and you’ll be avoiding some of the biggest mistakes many site owners make.
What are some of the biggest problems you’ve experienced with your own website’s design?
Christian Michaels
Comments