Usability heuristics for web development teams

Share this article

Often when clients have a relatively low budget for usability testing, or a short amount of time in which to conduct it, an ‘expert’ or an ‘heuristic’ review will be run by an experienced usability practitioner. There are slight differences between the two, with the expert review entailing a less formal evaluation process than the heuristic review. But all things considered, they’re pretty much in the same ballpark time wise… So I suppose that means cost wise too. There are a number of advantages in conducting either type of review. As I mentioned above, where resources are limited, they can be an effective and efficient method of assessing a site; the time and cost associated with recruiting, interviewing and paying test participants is negated. These evaluation methods can also be conducted very easily and consistently throughout the life of a site, providing a benchmark as well as a periodical health-check. In conducting an heuristic review, a series of guidelines or checkpoints is used by the usability expert to assess a site (or application). In conducting an expert review however, these specific guidelines may not be utilised, with the practitioner relying on their expertise of general usability principles to review the site at hand. Arguably, the most well known usability heuristics are those developed by Jakob Nielsen
, who outlines ten rules of thumb. There are numerous variations of Nielsen’s ‘standard ten’ including an extremely detailed checklist developed by Deniese Pierotti for Xerox. Pierotti’s heuristics use Nielsen’s ten rules as a foundation, but then goes further by providing individual checkpoints specific to each rule. It’s definitely an extensive list of usability checkpoints, and one which I expect was developed for a particular environment. The thing is… I believe there are a whole lot of things that haven’t been considered in these lists. If we’re going to take a best practice, user centred, holistic, may the force be with you approach to web development, surely there should be a broader focus; and one that incorporates as many areas of front end development into an heuristic review as possible. If we consider the Information Architect (IA), the ‘JavaScripter’ and the web standards developer, each of these roles has a great deal they can contribute to creating a better, more holistic set of usability heuristics. The IA… In 2004, Louis Rosenfeld published a list of heuristics for the IA where he said:
Every information architect should always have a set of favourite questions in their back pocket; they really do come in handy. I categorize mine into groups that correspond to the five areas that a user is most likely to interact with a site’s information architecture:
  1. Main page
  2. Search interface
  3. Search results
  4. Site-wide navigation
  5. Contextual navigation
A couple of weeks later, he expanded on these by developing a series of heuristics specific to Search Systems . These are very specific, and don’t necessarily apply to every site or application. But what they do offer is an opportunity to build a more tailored and well rounded set of web usability heuristics. In summary, the search system heuristics focus on the review of:
  1. Locating search
  2. Scoping search
  3. Query entry
  4. Retrieval results
  5. Query refinement?
  6. Interaction with other IA components
  7. Finishing search
Both articles offer far more detail defining each heuristic with a series of related questions. They are essential in understanding how IA heuristics can build on the standard ten that have been churned about for long enough. The JavaScripter… I’ve yet to find any real list of ‘JavaScript Heuristics’ related to the use of JavaScript in a site. However, there are methods of implementing JavaScript in ways that improve both the overall user experience as well as general site accessibility, and so I think developing a couple of rules specific to that would be useful. A set of JavaScript heuristics I created for a recent usability review included:
  1. Does the site navigation work with JavaScript disabled?
  2. Does key site functionality fail when JavaScript is disabled?
  3. Does the site use (script based) pop-ups?
  4. Does the site use device independent scripts?
No doubt there are others that could be included here, but I think it’s a good start… Can you add to this? The Web Standards Developer… The quality of front end coding (CSS and HTML) also has a significant impact on site usability and should certainly be a consideration when developing a set of usability heuristics. ‘Coding Heuristics’ might include questions such as:
  1. Does the site incorporate a favicon?
  2. What is the naming convention used in title tags?
  3. Is the site coded semantically?
Each of these heuristics improves the general usability of a site for all users, but there are other, more specific coding techniques that will improve site usability and accessibility. Quite a few of the accessibility guidelines outlined in WAI WCAG 1.0 also improve site usability for users who are not disabled. In addition to those above, I will typically include these as coding heuristics:
  1. Does the site implement fieldset and legend?
  2. Does the site use frames?
  3. Is colour contrast adequate?
  4. Are visited links obvious?
  5. Are link destinations clear?
  6. Is the file type of downloads obvious e.g. pdf’s?
  7. Have relative font sizes been incorporated?
  8. Can the site be read with style sheets disabled?
  9. Does the site validate?
I’m not suggesting that this would negate the need for a complete accessibility audit. Clearly that is a stand alone event. But in conducting an heuristic review of sites usability, these are elements that directly affect all users. This list is by no means exhaustive and in some cases it might be appropriate to refine these usability heuristics so that they’re more in tune with your own approach. But in conducting an expert or heuristic review, we need to think a lot deeper than the GUI. We need to move forward from the ‘standard ten’ and incorporate heuristics that address holistic development and user centred design. Beauty is, after all, only skin deep! [1] Primary Source Making Computers-People Literate. © Copyright 1993. By Elaine Weiss ISBN: 0-471-01877-5 Secondary Source Usability Inspection Methods. © Copyright 1994.By Jakob Nielsen and Robert Mack ISBN: 1-55542-622-0

Frequently Asked Questions (FAQs) on Usability Heuristics for Web Development Teams

What are the key principles of usability heuristics?

Usability heuristics are a set of guidelines that help in creating a user-friendly interface. The key principles include visibility of system status, match between system and the real world, user control and freedom, consistency and standards, error prevention, recognition rather than recall, flexibility and efficiency of use, aesthetic and minimalist design, help users recognize, diagnose, and recover from errors, and help and documentation.

How can I apply usability heuristics to my web development project?

Applying usability heuristics to your web development project involves incorporating the principles into your design process. For instance, you can ensure that your system provides timely and clear feedback to users, uses language that is familiar to the user, provides undo and redo options, maintains consistency in design elements, prevents errors, and provides help and documentation.

What is the importance of usability heuristics in web development?

Usability heuristics play a crucial role in web development as they help in creating a user-friendly interface. They enhance the user experience by making the interface intuitive, easy to navigate, and efficient. This can lead to increased user satisfaction, improved user engagement, and potentially higher conversion rates.

How do usability heuristics differ from general design principles?

While general design principles provide a broad framework for good design, usability heuristics are more specific to user interface design. They focus on enhancing the user experience by making the interface intuitive, easy to navigate, and efficient.

Can usability heuristics be applied to mobile app development?

Yes, usability heuristics can be applied to mobile app development. The principles remain the same, but the implementation may vary due to the differences in screen size, interaction methods, and usage contexts between desktop and mobile devices.

How often should I conduct a heuristic evaluation of my website?

It’s recommended to conduct a heuristic evaluation of your website at various stages of the design process. This can help identify and rectify usability issues early on, saving time and resources in the long run.

What are some common mistakes to avoid when applying usability heuristics?

Some common mistakes to avoid include ignoring the user’s perspective, not providing clear feedback, inconsistency in design elements, not preventing errors, and not providing adequate help and documentation.

How can I improve the visibility of system status on my website?

You can improve the visibility of system status on your website by providing clear and timely feedback. This could be in the form of progress indicators, loading animations, or confirmation messages.

How can I ensure a match between my system and the real world?

You can ensure a match between your system and the real world by using language and concepts that are familiar to the user. This includes using real-world metaphors, following real-world conventions, and using terms that the user understands.

How can I make my website more flexible and efficient to use?

You can make your website more flexible and efficient to use by providing shortcuts, customizable features, and efficient navigation. This allows users to tailor the interface to their needs and preferences, improving their overall experience.

Lisa HerrodLisa Herrod
View Author
Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week
Loading form