The topic of usability is quickly on the rise within the web design community and some designers are still missing out on some of the most valuable usability guidelines. Perhaps they have never heard some of them or maybe they simply do not see the value in them. In either case, usability plays an important role in every website and all of the recommendations, common or not, should be taken into consideration.
Finding a decent list of website usability recommendations is a fairly easy task. A simple Google search can turn up quite a few decent results. Working through the recommendations you find is fairly easy as well. However, to really maximize the potential of your website you need to take it a step further. Dive beneath the hood of your website and take a look at its usability first hand.
Uncommon Usability Recommendations
The usability recommendations outlined within this article you may or may not have heard before. You may not consider them to be uncommon however typically I do not see enough importance placed on them and feel that more times than none they are often quickly over looked. Some of these recommendations are quick and easy fixes while others will require practice and may be implemented over time. What really matters is their importance and the benefit they may bring to your website.
Put the Most Important Information First
Do not be afraid to treat your website like a newspaper. Put the most important content highest on the page. I am not advocating “the fold” rule. By all means users will scroll, “the fold” is dead in many cases. However you do not want to make users scroll all the way to the bottom of a page looking for a phone number or service areas. Determine what the most valued information is and present it at the top of the page.
Make Good Use of a Tagline
A good tagline will support a logo as well as provide a direct insight to what the website is actually about. Summing up a website in a few words is easier said than done, but do so using a statement or motto that truly symbolizes the website. Stay away from marketing jargon and get straight to the valued proposition. A typical website has less than 5 seconds to make an impression on a user before they decide to either stay or leave. A good tagline will let users know what the website is in about 1 second, potentially eliminating the need for users to dig for information.
Be Redundant
Redundancy is good when done in moderation. Keeping the same layout and design from page to page will allow users to quickly navigate a website. Using a similar content template for articles allows users to quickly recognize valued content. Leaving search fields and adding to cart buttons in the same place from one page to another allows users to quickly find what they are looking for as well as make a purchase. Adhere to a standard and stick to it without taking it overboard. Not every product can be accompanied with a video description and not every blog article needs 10 pictures.
Pages Comprehended within 5 Seconds
We can argue about the amount of time it takes a user to decide if a web page is of value or not, but the fact of the matter is it’s not much time at all. 5 seconds might not be the exact figure, but it is not far from it. Users are rocky and quick to pull the trigger on the back button. Entice users, entertain them, and most importantly give them what they want. Do not bore them with walls of text or keyword stuffed content in an attempt to pick up SEO rankings. Do not make your content too wordy so that it takes your viewer longer to find the information they want. Keep your content user friendly, and build your website for the people.
Display Numbers as Numerals
Users are naturally attracted to numbers and figures. They represent the facts and will intrigue users to keep browsing. It is much more beneficial to use “56” over “fifty-six” and “100” produces more curiosity than “One Hundred”.
Stay on Topic
Your website should not be everything to everyone. Find your niche within the Internet and stick to it. The wider range of topics you choose to cover, the less likely you are to build a following of users. The smaller your niche the more focused your users will be, thus making you more distinguished. Each page within your website should not stand alone and should relate back to other pages in one way or another. Find your calling and stay on topic.
Link Back to Older Pages
As time goes by your website will continue to grow and it is important you do not forget about those older pages. Chances are you will have obtained new users over time and linking back to previous pages or articles will allow them to learn more about your website and your ideas. On top of providing users with additional information it will keep them browsing your website for a longer amount of time. One thing to be aware of, when linking back to older pages, make sure those pages are still relevant in their context and up to date with your standards.
Rely on Users Not Numbers
Facts and figures can be a great driving factor behind your website, but are they appropriate? Let users determine the outcome of your website, not numbers. For example, roughly 70% of all online users are using Internet Explorer. Does this mean 70% of users visiting your website are using Internet Explorer? No. Do not get caught up analyzing numbers only to get confused. Rely on user’s specific to your website to guide you in the right direction. Prove it out with users not numbers.
Increase Padding on Links
Originally recommended by Ryan Singer from 37Signals, increasing the padding on links creates a larger clickable area. Increasing the padding on links helps users click on targets they are actually aiming for rather than clicking around a link in hopes of hitting it. Furthermore, with mobile web steadily on the rise a larger hit area makes it easier for users to navigate a website. The concept is easily implemented and will greatly reduce frustration.
Make Form Labels Clickable
Form labels can be clicked to activate the associated form element if coded correctly. This increased functionality can be accomplished within plain HTML by using the “for” attribute on the <label> tag like the following:
<label for="email">Email</label>
<input type="text" name="email" id="email" value="Email Address" />
Taking the usability a step further, make the cursor turn to a pointer, as it would with any other clickable element, with the following line of CSS:
label { cursor: pointer; }
Use Visited, Hover, and Active Link States
It is not uncommon for websites to use one style for links and another style for the hover link state. For most websites this is a standard practice. However, an area that is often overlooked is the active and visited link states. While these states may not be popular they do add a great amount of usability. The active state will allow users to see that they did in fact click on the correct link they were aiming for. The visited state will reassure the users that they are not revisiting a page that they have previously visited, or perhaps vice versa. It will allow them to quickly find a page they have previously visited for quick access.
CAPTCHAs Lower Conversions
Do you know what CAPTCHA stands for? It stands for Completely Automated Public Turning testing to tell Computers and Humans Apart. The name alone is intense, how are users supposed to figure out how to use it? While it is understandable that CAPTCHA must be required for some websites (primarily security reasons), generally speaking they are over used and are lowering conversions across the board. Often times CAPTCHA is faulty while other times users simply cannot figure then out. Either way, they are frustrating and will quickly drive users away from a website. Avoid them if at all possible.
Provide Helpful Error Messages
All to often we come across 404 pages or error messages that give us absolutely no insight to the problem we encountered. Rather than informing the user they have encountered an error try to help them resolve the error, or perhaps let them know why they encountered the error. Maybe they misspelled the URL or incorrectly filled in their phone number. If you are able to help and point them in the right direction you will be sure to see better success amongst your website.
When a user encounters some other form of error, be sure that you’re always addressing the problem with care.
Use Text Rather than Images
You should stay away from using an image where plain text would do just fine, especially with the advancements of CSS3 and new services like Typekit. Plain text is readable by search engines and screen readers, where images and graphics are not. It is understandable that custom fonts, most commonly used as images, may add a level of characterization to a website, however the same effects can be accomplished with CSS3 or by using a service like Typekit. Simply thinking that images all attribute will surpass is not enough.
This is Not a Shortcut to Thinking
Lastly, do not take this list, or any other usability guidelines, as a shortcut to thinking. Every website is different and every website has a different audience. These suggestions are to only get the ball rolling. Do not stop here. Take in all usability considerations and make the very best decisions for your website.