6 Reasons Series: #4 Lack of Usability

Do you ever stop to consider how your website visitors feel as they are using your website? Are pages slow to load, information hard to fine? Is it a good or bad experience for them? The answer to this question will have more influence on the effectiveness of your website than you think!

In part 4 of this series, I address the importance of creating a positive user experience through usability. I will also provide guidelines to help make your website more effective in its core mission … to make you money!

In his book “Don’t Make Me Think“, Steve Krug defines usability this way. “A person of average (or even below average) ability and experience can figure out how to use a thing … without it being more trouble than it’s worth.” He goes on to use words like learnable, effective, and efficient to describe usability.

So, usability is a design goal. To be successful, your website must provide a consistent, positive user experience. The more usable a website is, the more effective it will be. Below are some key terms you will need to be familiar with before we proceed.

• User Experience (UX). This has to do with the ease of use of your website and how people feel about it. The goal is to improve user experience as a way of improving effectiveness. UX is a reaction, a measurement of how well you have done with your design (UI).
• User Interface (UI). This is the part of the website people interact with (web page layout, navigation, forms, etc.). This is the actionable part you can do something with. You improve UX by improving your website’s UI.

User Interface Design (UID) and User Experience Design (UXD). These both explain the process of designing a user interface (in our case, a website). UID breaks down into the following pieces.

• Visual or aesthetic design. How the entire website and it’s individual parts look & feel (colors, contrast, images, use of white space, etc.). This includes how well the site displays on various mobile devices.
• Information Design. This is how you choose to format and display informational content on your website (e.g. text, infographics, pricing tables, etc.).

The following are just a few basic things people look for when it comes to a website’s usability:

• It is intuitive (are choices clear)?
• It it easy to navigate?
• Can I find what I am looking for?
• Do things work like I expect?
• Does it display well on my mobile devices?

Next, let’s take a quick look at why your website’s usability matters more today than ever.

Let’s face it, there are times where the web is not the most friendly place in the world. Web users are becoming more battleworn and weary. Steve Krug recently issued this dire warning, “Clicks mean more today than ever … People are starting to question rather or not the next click is worth it.” There is good reason for this cautiousness.

Think of the number of stories you have heard about ransomware, SPAM, and MalWare. Banners and pop-up ads clutter our online world every day. Websites often mislead people and don’t deliver a positive experience. With these things in mind, I hope you can see why designing a professional, friendly UI helps build trust on your website.

The following are some common reasons websites fail to generate a positive user experience:

• It has a poor or misguided user interface design (UID).
• The navigation is hard to locate, hard to use, or is just ambiguous. This happens most often with navigation on mobile devices.
• The text is hard to read (too small, poor font choice, poor contrast). No use of white space or headings; elements run together.
• The website looks amateurish or unprofessional.
• There is no fallback in place if a element doesn’t load.
• The layout and design ignores convention.
• The website does not display well on mobile devices.

I would like to go over three key areas for designing a better user experience. They are convention, layout, and responsiveness. Security and accessibility are important factors as well, but both are outside the scope of this article. There is also the issue of performance. I will address that subject in the next article.

Psychologists tell us that people gravitate towards things that are familiar and avoid the unfamiliar. This “Familiarity Principle of Attraction” is a strong force in our decision making. So, it makes sense that convention would be important when designing for usability. Susan Weinschecnk, Ph.D. has written several books on this subject if you want to know more.

Conventions are standards in design that most people are familiar with and understand. An example is a stop sign. Stop signs in the U.S. and China are the same color and shape. Even when you don’t know the language, you know what to do when you encounter it because it uses convention.

On a side note, there is a bit of a challenge when it comes to applying convention to web design. This industry is less static than any other. The rise of mobile devices has presented a new set of challenges and disagreements over what works best and what does not. My suggestion is to apply basic, best practice design standards that don’t change much. These best practices begin with the layout of your website.

Think about the layout of cars. Generally speaking, layout conventions for car controls change very little (gas, brake, etc.). Why is this? Designers figured out what works and they just repeat it. This consistent design means that you most likely can operate a car anywhere in the world.

Websites use conventional layouts as well. Have you ever tried using a website that was in a language you didn’t know? If not, try it now. Odds are, you will still know how to operate it. Why is this? Because its navigation and the rest of the design are already familiar to you.

I suggest you follow these “best practice” guidelines to help improve usability and build trust on your website.

• Make use of familiar elements when you can (bright buttons for calls-to-action, etc).
• Make it obvious when something is clickable. Use another color for hyperlinked text (blue is standard), add hover effects to images, etc.
• Make it obvious where the next click will take people. DO NOT try and trick people just to get them to take action. There is no faster way to lose trust!
• Be sure to make logical grouping of items and/or text on your pages. Use white space and headings as needed.
• Your branding, header, contact info should be at the top. Logo’s tend to be in the upper left.
• Minimize distractions as much as possible. Have you ever tried to read some text while there is a blinking ad just out of your line of focus?
• Make sure you have reliable fallbacks (replacement) in place if an element doesn’t load.
• Navigation:
• Stick to common page naming conventions where possible. For example, don’t change “Contact Us” to “Reach Us” just to be different. Pages like Home, About, Services, and Products are names that people are comfortable with. Don’t forget to arrange your pages into logical groupings.
• Place navigation at the top of your home page and repeat it in the same place for each the page.
• Use breadcrumbs or some other way to make it obvious how to go back through you web page hierarchy. This is important if your web page structure goes deep.
• If you have an eCommerce website, try and model your process, look, and feel of big online retailers as much as you can. The closer your website looks & feels like an Amazon.com (something they know), the more comfortable customers will feel about purchasing from you.

The most important thing to remember is to keep your design user centered and predictable. If you do that, you will be well ahead of the game.

Over 51% of web page views are now made on mobile devices! So, if you choose to ignore mobile design, you will pay the price. Let’s take a look at what responsive has to do with mobile.

Responsive means that your website will reformat to fit mobile devices. Browsing a website on a smartphone is a different experience from the desktop or tablet. Your web pages should be optimized to make a visitors experience as good on a desktop as it is on a tablet or phone. This is Google’s goal as well. Let’s take a look at some of the problems non-responsive websites have.

• Appear as a smaller version of the regular site,
• Have navigation that is difficult to read or use,
• Have elements that run off the screen or are not zoom enabled,
• Drive potential customers away,
• Be penalized by Google.

There are a couple of distinctions I want to make when it comes to mobile and usability. The first is this, just because a website is responsive doesn’t mean it is optimized well for mobile. In other words, it may resize itself, but still not be user friendly.

Next, mobile design is still in its wild west phase and standards are still being set. What is user friendly for the mobile version of your website may not be the case with another site. I encourage you to watch others test your site on various mobile devices and see how they react. Use other websites on your phone and see what they are doing. You will learn more from doing these two things than anything I can write as part of this article.

I have mentioned several ways you can check and improve your website’s usability in this article. If you have identified any problems, begin to fix those first. But, your usability evaluation shouldn’t stop there. After all, you already know how to use your website!

Below are suggestions to further evaluate your website by enlisting the help of others. If your website is a direct source of income, consider the second and third options below. Feedback offered by a web professional like myself will be helpful as well.

• Have your friends, family or customers you know well test your site for you. Take their feedback into consideration.
• If you want professional input, there are services that will conduct usability studies for you. They will send you the results along with suggestions on how to correct issues they discover.
• If you are going to do a usability study I suggest reading Steve Krug’s book “Rocket Surgery Made Easy.” It outlines how to get the most out of usability testing.

Here are some resources to help you learn more about usability and user experience design (UXD):

• Read Steve Krug’s book, “Don’t Make Me Think: A Common Sense Approach to Web and Mobile Usability”. This book has become the gold standard for web designers on this subject.
• Read any of Susan M. Wienschenk’s books on design and usability. She has a Ph. D in psychology and specializes in behavior science behind effective web design.
• Check out Google resources such as, “Ten things we know to be true.” It a great article about usability and the web experience.

Next up, Problem #5: “A Lack of Performance”