Web Design Useability - Aug 2007
Web design Sunshine Coast
At - 12website.com as part of our redesign service we see websites every day with usability issues. After seeing this trend for years, not only here on the Sunshine Coast but in Brisbane & other areas of Australia, the UK, USA, New Zealand I have a theory that business owners are not researching web design basics. More info from a March 2005 article on web design basics.
Neglecting the usability of a website can lead online visitors to become lost, frustrated and/or confused. All it takes for a visitor to decide to stay, explore or leave a site is 0.4 of a second. Attracting visitors to your website is a formidable challenge; it is yet another to build a fast connection with them and keep them there. With this in mind, here are some simple measures that can be taken to remedy these mistakes and help promote your online conversions. More on visual web design.
Having great search engine placements is one thing but to create a usable website environment is just as important. What good can come from "being found" if users quickly exit your site? A solid search engine friendly and usable website should be your answer to both of these major components for your online success. Here is interesting information on web design for eye contact.
There are a variety of standards still in place when it comes to designing a usable website. This is not to say that the uniqueness and creativity of your website has to suffer, rather by following some simple guidelines visitors know where to go to find the information they need.
The process of developing a usable interface can be a balancing act. Some core elements need to be assessed prior to any actual design work being done. Attention to content creation, search engine friendly design tactics, and the face you put on your design each have to be blended into this usable environment.
Here is a snap shot of the most common design mistakes we see with websites.
WEBSITE CONTENT
Formatting Linking Text
Frequently we see designers underline body text or even text in images that is not directing users to another part of the website. Underlining on non-linking text is a huge problem especially if you have other links on the site that use the underline to illustrate a clickable path to follow.
A current trend is to have links displayed in body text without the underline text decoration yet this may still cause unnecessary confusion with users. Try using other methods to highlight a message you want to stand out from the rest of the page content when it is not intended to be a hyperlink.
The same rules apply with the actual colour scheme you choose for your text. Avoid the use of the standard link colour blue for non-linking text as well. This will stop users from becoming frustrated when they attempt to click on text that will take them nowhere. More on website links.
High Contrast Website Body Text
Another poor design trend we are seeing more of is the presentation of grey body text on a white background. This has no value what so ever as it immediately excludes a vast majority of users that cannot even read what is displayed. This is definitely one case where usability outweighs the need for attractive page aesthetics.
If clarity is your goal for your website, then advocate high contrast body text. This rule also applies to text on images; it is best to avoid fonts and styles that are hard to read.More on web design layout.
Webpage Scanning
The old saying "first impressions are important" holds true when it comes to a visit to a website. There is a fine balance when it comes to how much text to include on any give page or subject. Remember time is precious before a user determines if they are in the right location on your website or not. Keep your initial message brief and informative and offer related pathways if the user wants to learn more. Most users have the habit of quickly scanning a couple of paragraphs before they either decide to learn more or look elsewhere.
Frequent questions about your Ecommerce web design. |
WEBSITE STRUCTURE AND WEBPAGE ORGANISATION
Promoting a site structure that builds a level of user confidence is critical to a website's success. Will visitors find the information they are looking for or can they clearly understand your message? Solidifying a clear and organised website structure from the top down will help with this.
Logical Site Structure
Depending on the scale of the website this task can be fairly easily implemented. Unfortunately a common mistake is to try to cram as much information on a page as possible. Each topic should have its own page and any additional related material to that content should be the only linked content present (other than the main site wide navigation). To help clarify this, here is an example:
Perhaps you are selling musical instruments online and the page in question is a guitar you are trying to promote. Included on this page should be the standard image(s) of the product, and the description of the product in detail. If users wish to learn more about the product such as technical specifications or an online downloadable manual they should be (logically) linked on the page as well, along with any other relevant material directly related to that product.
It is very easy (and common) to want to point to other unrelated content that you think a user might want to know about. Do not offer opportunities for them to be led astray by cluttering the page with other products. Chances are potential customers arrived to that particular page because they wanted to. Cluttering a page with additional information about the latest flute in stock is not going to help conversions.
Perhaps the reason that web designers fall into this trap is most likely because they try to employ tactics used in print advertising. With print advertising you are given a certain amount of ad space to illustrate your product. Sometimes the designers forget that websites are dynamic and can grow beyond that page. For a complete ecommerce guide please see our Ecommerce fact sheet
Splash Web Page
Visitors are coming to your website to find the information they are looking for and often the first thing they see is a splash page. The majority of the time these intro pages offer nothing useful to the user and fall outside any consistent look and feel of the rest of the website. Generally speaking, the sole purpose of a splash page is to add a "cool" factor to the entryway to the site. Each and every page on your site including the homepage should be informative and consistent in look and feel.
We believe the home page is perhaps the most crucial element to a successful website. If you have very little relevant content on your homepage it throws up an unnecessary barrier to website visitors. More on your website homepage.
WEBSITE NAVIGATION
The placement and organisation of the navigation on your website is critical to keeping those potential customers on your website. Customer satisfaction statistics state that up to 95% of visitor frustration comes from inadequate navigation methods.
Maintain Website-wide Standards
Exactly where is the best place on a page to insert your navigation? Numerous studies have been done on this. Should the main navigation be on the top of the page? Should it be on the left hand side of the page? However you choose to present your navigation keep it consistently placed throughout the website. Users should always know how to get back to information they have already seen and as well, they should be confident they can find the information they have yet to read. The homepage button should be in the same place on the page regardless of where you are on the site. More info in web design checklist.
What am I Clicking?
Users should always be made aware ahead of time by what is stated in the text or button where they will go if they click that particular link.
If the click leads to a downloadable piece of software or to a PDF file, inform them upfront. A vast majority of web surfers are discouraged by unexpected results by navigating through websites and being forced into something they do not want to do.
The following is a good example on how to inform a user that the link they are about to click is a PDF file (warning: the following examples are not linked):
"Product" User Manual in PDF format (16MB) Opens in a new window.
NOTE: It is also a common courtesy to inform users of the physical size of file to be downloaded, as shown above.
Just like there are rules of the road when driving a car there are guidelines to follow when developing a website. It is important to note that if tackled in the right manner incorporating basic usability components should not hamper creativity with the vision you have with your website.
Frequent Questions | Web Redesign Service | Get in touch |
Disclaimer
12website.com has prepared the supplied information as a voluntary service to the online community. The information is necessarily general in nature and is not intended to be relied upon other than as general background material. This should not be used as specific advice, recommendations or guidance, and specialist assistance should be sought by anyone in need of such help. 12website.com accepts no liability under any circumstances for any loss, expense, damages or costs whether direct or indirect (including loss of profits / damage to business) which may be incurred by any person as a result of relying on or using in whole or in part any of the supplied information.