25-point Website Usability ChecklistI've been thinking a lot lately about my process. Experience is a powerful thing, but it's rare that we really sit down and try to map out what we know. A while back, as part of my 5-point Website Clinic, I developed a 25-point website usability checklist - a way to create some method out of my madness and make sure that I don't forget anything critical when I'm working with a new client.
Even though it's part of one of my paid offerings, I've decided to share this checklist. A few disclaimers: First, I don't claim this list is comprehensive or unique. Jakob Nielsen has a great 113-point checklist in his book, Homepage Usability, for example. This is just my way of organizing what I think is important while trying to keep it manageable. Second, my usage of terms may vary from yours. I use "usability" in a very broad sense, and my use of "accessibility" isn't quite industry standard. Don't like it? Write your own checklist ;) Finally, an advance warning that this post is pretty long.
Basic OverviewThe list is split into 4 roughly equal sections, (I) Accessibility, (II) Identity, (III) Navigation, and (IV) Content. I'll describe and rationalize all of the sections and line items below, but you can also download the checklist as a simple, 1-page PDF. I try to keep it simple with 3 basic ratings: (1) Green Check = Good/Pass, (2) Red Check = Needs work, but no disaster, (3) Red X = Bad/Fail. Not all points are necessarily applicable to all sites.
Section I. AccessibilityThis section contains not only traditional accessibility issues, but anything that might keep a visitor from being able to access the information on a website. If no one can load your site, or the type is too small to read, all of the usability in the world won't matter.
1. Site Load-time Is Reasonable
Call me old-school, but I still like to see sites come in under 100KB (60KB is even better). If a site takes forever to load, most people will just leave. Yes, many of us have broadband now, but that makes our patience even thinner.
2. Adequate Text-to-Background Contrast
Dark-gray on light-gray may seem stylish, but I'm not going to ruin my eyesight to read your blog. Eyes and monitors vary wildly, so keep your core copy contrast high. Good, old-fashioned black-on-white is still best most of the time.
3. Font Size/Spacing Is Easy to Read
Opinions vary on the ideal size for text, but err on the side of slightly too big. Poor readability increases frustration, and frustration leads to site abandonment. Also, make sure your line spacing is adequate - white-space is a designer's best friend.
4. Flash & Add-ons Are Used Sparingly
No matter how great your site looks, people won't wait 5 minutes for a plug-in to load. Use new technology sparingly and only when it really enhances your goals. Sticking to standard HTML/CSS is also a plus for search engines.
5. Images Have Appropriate ALT Tags
Not only do sight-impaired visitors use ALT tags, but search engines need them to understand your images. This is especially critical when you use images for key content, such as menu items.
6. Site Has Custom Not-found/404 Page
If a page on your site doesn't exist, a white page with "404 Not Found" is a good way to lose a customer. Create a custom 404 page, preferably one that guides your visitors to content.
Section II. IdentityA key question when someone first comes to your site is "Who are you?" It's important to answer it quickly, and make the paths to obvious follow-up questions ("What do you do?", "Why should I trust you?", etc.) clear.
7. Company Logo Is Prominently Placed
Put your logo or brand where it's easy to find, and that usually means the upper-left of the screen. People expect it, and they like it when you make their lives easy.
8. Tagline Makes Company's Purpose Clear
Answer "What do you do?" concisely with a descriptive tagline. Avoid marketing jargon and boil your unique value proposition down to a few words. This is also a plus for SEO.
9. Home-page Is Digestible In 5 Seconds
In usability, we often talk about the 5-second rule. There's some disagreement over just how many seconds you get, but website visitors are a fickle bunch, and they need to get the basic gist of your home-page in just a few moments.
10. Clear Path to Company Information
The good old "About Us" page may seem boring, but confidence is important on the web, and people need an easy way to learn more about you.
11. Clear Path to Contact Information
Similarly, visitors want to know that they can get in touch with you if they need to. It's also hard to do business if no one can contact you. Preferably, list your contact information as text (not in an image) - it'll get picked up by search engines, including local searches.
Section III. NavigationOnce people generally know who you are and what you do, they need clear paths to the content that interests them. Information architecture is a huge topic, but these points cover some of the basics.
12. Main Navigation Is Easily Identifiable
Almost every site on the web has had a main menu since the first browsers came on the market. Make your main navigation easy to find, read, and use. If you have two or more navigation areas, make it clear why they're different.
13. Navigation Labels Are Clear & Concise
Don't say "Communicate Online With Our Team" when "Contact Us" will do just fine. Your main navigation should be short, to the point, and easy for mere mortals to grasp.
14. Number of Buttons/Links Is Reasonable
15. Company Logo Is Linked to Home-page
This may sound minor, but people expect logos to link to home-pages, and when they don't, confusion follows. I've seen video of users clicking on a logo over and over, with no idea what to do next.
16. Links Are Consistent & Easy to Identify
The underlined, blue link is a staple of the web. A little artistic license is ok, but consider at least making your links either blue or underlined. Links should stand out, and you should use them sparingly enough that they don't disrupt your content.
17. Site Search Is Easy to Access
If you have a site search, make sure it's prominent. Usability guidelines tend to prefer the upper-right corner of the page. Keep the button simple and clear - "Search" still works best for most sites.
Section IV. ContentYou've heard it before - Content is king. If you don't want the kingdom to crumble, though, content needs to be consistent, organized, and easy to skim through.
18. Major Headings Are Clear & Descriptive
Most people don't read online, they skim. Use headings (major and minor) to set content apart and keep it organized. Headings should be clear, and for SEO benefit, using heading tags (<H1>, <H2>, etc.).
19. Critical Content Is Above The Fold
The "fold" is that imaginary line where the bottom of your screen cuts off a page. Content can fall below the fold, but anything critical to understanding who you are or what you do (especially on the home-page) should fit on that first screen. Average screen resolution these days is about 1024x768, depending on your audience.
20. Styles & Colors Are Consistent
Make sure people know they're still on your site by being consistent - confuse them and you'll lose them. Layout, headings, and styles should be consistent site-wide, and colors should usually have the same meaning. Don't use red headers on one page, red links on another, and red text somewhere else.
21. Emphasis (bold, etc.) Is Used Sparingly
It's a fact of human cognition: try to draw attention to everything and you'll effectively draw attention to nothing. We've all seen that site, the one with a red, blinking, underlined "NEW!" next to everything. Don't be that guy.
22. Ads & Pop-ups Are Unobtrusive
Ads are a fact of life, but integrate them nicely into your site. Don't try to force ads and pop-ups down peoples' throats. Also, do people a favor and make your ads clear. If you blur the line between ads and content too much, your content may suffer.
23. Main Copy Is Concise & Explanatory
This isn't a lesson in copywriting, but look at your home-page - can you say the same thing in half as many words? Try to be concrete and descriptive and avoid jargon - nobody cares if you can "leverage your synergies".
24. URLs Are Meaningful & User-friendly
This is a point of some debate, but meaningful keyword-based URLs are generally good for both visitors and search engines. You don't have to re-engineer an entire site just to get new URLs, but do what you can to make them descriptive and friendly.
25. HTML Page Titles Are Explanatory
More importantly, your page titles (in the <TITLE> tag) should be descriptive, unique, and not jammed full of keywords. Page titles are the first thing search-engine visitors see, and if those titles don't make sense or look spammy, they'll move on to the next result.
» Download the 25-point Website Usability Checklist (1-page PDF)
TranslationsOver the past year, a number of people have asked me about translating the 25-point Usability Checklist into other languages. I'm happy to oblige, as long as the translated versions are credited to User Effect.
- Italian Version (Thanks to Gianluca Fiorelli)
- French Version (Thanks to Olivier Sauvage)
- Spanish Version (Thanks to Joan Boluda)
- Belarusian Version (Thanks to Patricia Clausnitzer)
- Czech Version (Thanks to Petr Havlik)
- Russian Version (Thanks to Irina Kapustkina)
Thank you! (I'll probably spend the next 30-35 minutes checking out our site by this checklist)
Rich Bernstein· Wednesday, February 11
Thanks for the PDF and explanation of each point. We are in the process of re-writing on of our websites and this checklist will help.
Okay, I'm not going green with this one! Printed! This is worth downloading, printing, and incorporating into a regular process.
I especially like the segmenting for Accessibility, Identity, Navigation and Content. Well done, Pete!
This should be nominated for a 2009 Semmy!
Many, many thanks for sharing your process and insight.
Pete, this is a great checklist. Very to the point.
Dr. Pete· Wednesday, February 11
Thanks for the positive feedback, everyone - it's much appreciated. I was actually toying with the idea of getting a much broader process on paper, but the shortest I was able to pin it down to was a 12-week process (and 12 weeks of blog posts). I'm not sure anyone wants that much insight into my process :)
Tyson in Texas· Sunday, February 15
Thank you for being so kind to share your comprehensive 25-point website usability checklist. It is indeed a great way to avoid many common usability problems in website projects.
I agree with positive comments of Carlos, Rich, and others, and congratulations on your SEMMY Award!
Dr. Pete, thank you for such a nice and concise list. I'm glad that we already employ most of what's encompassed by this list. Nonetheless, I am printing and saving so I can review every it and our site every few months to be sure we have not strayed.
Item 5 should read "Not only do sight-impaired visitors." Also, consider adding a couple more comprehensive accessibility guidelines: use the HTML label element to associate fields with their labels, add a hidden "skip to main content" link so screen readers don't have to scan the site nav on every page.
I think my first comment got eaten. "It was, thanks for this great list!"
Carolyn Snyder· Friday, February 20
Concise and digestible list of things that are necessary for usability, but not sufficient. You could satisfy every item on this list but if the site had a silly business model, poor IA, or the wrong content, it would still flop. I'm a big fan of checklists and use them all the time, but they are better suited for nuts-and-bolts things than higher-level goals.
Dr. Pete· Friday, February 20
@Carolyn - This is in no way meant to minimize or oversimplify usability, but I think you have to start somewhere, especially with small businesses who often will at least accept something simple over the alternative, which is (unfortunately) nothing at all.
I think one of the problems with "higher-level" analyses is that we like to think, especially as experts, that they're entirely qualitative. The problem is that we don't work to systematize or quantify them. I don't think a simple checklist or equation or automated software can effectively analyze the usability of a complex site, but I do think that a systematic approach can help capture our knowledge, organize our process, and improve how we work.
Dr. Pete· Friday, February 20
@Joshua - Thanks, I've got "site" on the brain, apparently :) Interesting comments on accessibility - in this case, I certainly wasn't covering accessibility in the traditional sense or doing it justice, but I wasn't aware of all of the strategies you mentioned and will definitely look into them.
Hey its very nice. Thanks for explaining each and every point.This information is very useful to me.
The www would be so much more fun if everyone would keep to your tips. Thanks for that comprehensive list
I found this on a top list of Marketing posts - it deserves to be there!
Indeed! this is one of the good posts available on website design. These kind of checklists definitely help a lot. Thanks again.
tabsfiroz· Tuesday, March 3
Thanks for the check list, glad that you shared it.....
Thanks for this checklist. The list is concise and to the point, which I believe works well to identify a site's strengths and weaknesses. Great stuff!
Hey! This is awesome, helps me so much!!!! Thanks a lot!!!!
Good post...very useful...Thanks u.
This is a great tool! Thanks so much for sharing with us.
A simple but very informative post. The basic approach to any web design should be a NO-Nonsense, user-first, clutter-less and straight forward - just like your posting.
wiio· Sunday, March 15
How can pop-up ads ever be unobtrusive?
Dr. Pete· Monday, March 16
@Wiio - The "unobtrusive" was more of a reference to the regular ads. Admittedly, unobtrustive pop-ups are very rare. Some site entry pop-ups are ok, if they welcome visitors with useful information, a relevant offer, etc., but doing that right is pretty tricky and most sites screw it up.
Ok now this is a good post however there are many more that needs to be covered.
I would love to see this post in PDF format.
"Thanks for the positive feedback, everyone - it's much appreciated. I was actually toying with the idea of getting a much broader process on paper, but the shortest I was able to pin it down to was a 12-week process (and 12 weeks of blog posts). I'm not sure anyone wants that much insight into my process :)"
I do! I do!
This is just the list that every web designer or consultant needs!
This is a very useful list that can help any website owner. It would be perfect if their was a way to print this list out to hang on my board.
I found 3rd section about navigation very useful, thanks for this great tutorial.
This is very useful information! One of the main things people forget is to double check if there contact information is correct. I had a client who was wondering why he not getting calls later on found out his phone number he wrote down is completely wrong. Oh man!
I liked the topics you have added in your checklist. I'm writting my undergraduate thesis about a web design method and this checklist brings some useful information to be added in my usability heuristics.
Nice job :)
Pete, this is a great checklist.
I like the comprehensive yet brief nature of this cheat sheet. I am a search engine optimist who always needs to evaluate the quality of a site from many perspectives before agreeing to (or deciding how much to charge for) search engine optimization. In my mind, there is no point in optimizing an unuseable site. So this is a great way to touch on the top 25 considerations of site useability, without having to spend hours and hours determining if this should influence the above decisions.
Thank you! Great job!
Great post ! thanks !
i think this article is very useful.Specialy 3rd section...
This is a great tool! Thanks so much for sharing with us.
Every web developer should read and bookmark this for their next project
This very well the stages of development!
Already recommended the article to several developers, including orkut.
Thanks for this checklist. Pete thank you for such a wonderful and concise list.
wow, nice checklist. Thanks for sharing.
"Hats off to your Dr Pete". That checklist is a great little guideline for the newbie developer tackling the great heights of the internet revolution. Nice work.
Premier Web Solutions (Australia)
Wonderful Information. Many People don't care about this when they are making websites. It is very useful information for that type of people. Your Points may perfect for user and search engines.
I just wanted to say thanks for putting together this very useful list. I am working on compiling a similar list for my web development projects, and this has been a great help. This really defines a good starting point for a solid SEO foundation.
I love it! Thanks for sharing.