Basics of Web Usability

July 24, 2007 | Filed Under Accessibility, Web Site Development, General

In my previous article Why Web Accessibility Matters I touched on why having and designing an accessible web site made good business sense. In this article, I would like to continue into the area of web usability.

What is web usability?

Web usability has multiple meanings depending to whom you are talking. Some people think it is just making a site work, at any cost. Yet others feel that usability is closely tied into accessibility, and I also feel that this the best practice. If you have a usable site, then the chances are really good that it is accessible. Why? In the backbone of the coding, chances are that the site will be using valid XHTML and CSS. This in and of itself helps to create a site that is usable.

Let’s take a look at a definition by Usability.gov:

Usability measures the quality of a user’s experience when interacting with a product or system—whether a Web site, a software application, mobile technology, or any user-operated device.

In general, usability refers to how well users can learn and use a product to achieve their goals and how satisfied they are with that process. Usability, as defined by Joseph Dumas and Janice (Ginny) Redish, means that people who use the product can do so quickly and easily to accomplish their tasks. Usability may also consider such factors as cost-effectiveness and usefulness. 

What defines a usable site?

Now that we have a basic definition of usability, let’s take a look at some considerations that will make your site more usable. There are multiple ways to make a site usable and a lot of them depend on factors of what type of site you have (blog, ecommerce, etc.), your audience (casual web surfer or expert), and what your site is conveying (its purpose).

Use clear and consistent Navigation

One of the problems that I have encountered and I’m sure that you have too, is not knowing where the navigation system is going to take you to. And once you get someplace in the site, where exactly are you? One of the best ideas is to have a clear and consistent navigation system that stands out on the page. The reason is you want to make sure that your visitors know where the navigation system is for your site, whether it be in the upper part of the site and horizontal, or running down either side. 

Another aspect of clear and concise navigation is the use of breadcrumbs, or another method of letting users see where they are, and what pages they have taken to get there. You’ve seen them on sites before, and they resemble something like this:

Home » About » Thanks for finding me!

This allows for users that have maybe followed a link to the final page to backtrack easily without having to “go home” and start over again. Statistics have shown that most users scan pages for the content they are looking for within 15 seconds, and if they don’t find it, the go back to the previous page, or leave your site. Not good if you want to sell a service or product.

Sitemaps are another good method of ensuring an easy method of users to quickly find what they are looking for. One big plus of sitemaps is if they are correctly written, it helps with Search Engine Optimization as the spiders from Google and other sites can quickly follow those links to the main content of each page and article. Not to bad for killing two birds with one page, eh?

Make it easy to read

This one gets real tricky, but since you have an accessible site already up and running, it should be pretty easy. You want to make sure that your text is easy to read and resizable. Several factors affect both of these issues:

Remember that the purpose of your site is to convey information and if that information is hard to read or search, you have lost your audience. I’m sure that each of you have been to a site that the text was too small, or crammed together and hard to read. Or to another site where you couldn’t tell if an image was a link or just an image. Some of the best sites are simple and concise with their presentation of their product or services. Don’t believe me? Take a look at the main Google page, or Amazon.com. Their sites are pretty simple and help you look for what you are after.

Keep Searching

One of the biggest usable tips is to have a site search feature for your site. If the user has an idea of what they want to find, but aren’t sure where to find it on your site, then they will leave. The site search is invaluable for your business or personal site, especially if it has more than just a few pages. The site search takes the guess work out of how you have your site organized and where you might have put that valuable piece of information that the user is looking to find. This allows the user to come to your home page, type in a few keywords, and have the relevant results returned to them in a timely and efficient manner.

Don’t make me Scroll!

One of my biggest pet peeves is to have to scroll the page I am viewing left and right to read the content. I’m not talking so much about extra side bars for advertisements or additional information as I am the main content of a page. What I am talking about is the main content of the page. This also relates to making the content readable in simple format. Limit how wide your content is on your page and don’t make it go all the way across the screen. Trust me, your viewers eyes will appreciate this.

Watch your colors

Color is an important visual aspect to any good web design, but it can easily be abused. We all love looking at nicely designed sites, but the colors that are chosen for any site have to be done so carefully. One of the factors we have to consider is that you want certain things to stand out without being confusing. For example, you want consistency in the colors of your headings so that the users know they are going into another section of the content. Your links should look like links, and that should be consistent throughout the site. Don’t underline anything that is not a link to add emphasis, use bold or italics to do this. 

Another usability and accessibility factor dealing with colors is that some users could have color deficits, such as color blindness or difficulty distinguishing slight hue and tint variations of a certain color. You want strong contrast with your colors, especially with the background color of your areas.

Testing, testing…

The final usability factor deals with the testing of your site. Often times sites are put together for Internet Explorer, which is not the optimum testing platform. IE 7 is now catching up with Web Standards, so it isn’t too bad of a browser to test and design for. However, designing a site to look right is best if designed in Firefox, Opera or Safari browsers as their rendering of sites is often times most correct. Testing of your site in multiple browsers will ensure that the most users can see and use your site as you intend it to be used and seen.

Validation of your site is a good idea also. It will help you catch errors that can lead to problems with the code, usability and accessibility for your users. You can start with the validation process for your site by using the W3C Validation Service and the best part is that it is free! If you are using Cascading Style Sheets for your site (you are making an accessible site, aren’t you?), then you can use the CSS Validation Service from the W3C also.

It’s a wrap

I hope you have enjoyed reading some of the tips and ideas on creating an accessible and usable site. This article only scratches the surface however on these topics. If you want to learn more about these topics, please contact me or check out some of these links as a good start.

Like This Article?

Subscribe Subscribe to the RSS Feed
Add Your Comments 1 Comment - Add Yours!

Related articles:
Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • StumbleUpon
  • Digg
  • Reddit
  • del.icio.us
  • Technorati
  • Ma.gnolia
  • Furl
  • Simpy
  • Netscape
  • YahooMyWeb

Tagged:
, , , , , , , ,

Comments

Why Web Accessibility Matters

July 22, 2007 | Filed Under Accessibility, Web Site Development, General

I would like to take a moment to thank Aaron for asking me to write for Solo Signal about Web accessibility and usability topics. In this article I would like to focus on accessible web design as it relates to good business practices. My next article will focus on the usability aspects of site design, and how it relates to businesses and individuals alike.

So, what exactly is Web Accessibility?

If you Google search “Web Accessibility” you will receive 217 million results in the search. That is a lot of information to look through to try to find the true meaning of accessible web design. You can pick through the results and find technical sites that relate to the W3C web standards, sites that offer guidance to web developers and site creators and even more results that attempt to make sense of what the true meaning of accessible web design really is.

Let’s take a look at an excerpt of the Wikipedia definition of “Web accessibility“:

Web accessibility refers to the practice of making websites usable by people of all abilities and disabilities. When sites are correctly designed, developed and edited, all users can have equal access to information and functionality.

In other words, a site has to be correctly designed (usable) and developed (coded) so that all users, irregardless of ability or viewing medium, can have access to the information you are conveying and the functionality of the site. The key words here are information and functionality for all users.

Why Information is Important…

As a business owner that either has, or is looking to create a web site, your main goal is to relay information about your products or services in order to create, maintain and grow your business. You want to provide information about who you are and what you do in order to reach the most people with the least amount of effort, and cost possible. As an individual that is surfing the internet, you want to be able to quickly and easily locate the information that is important to you. Why waste the time thinking you have finally found those instructions on how to get rid of that blue screen of death, only to find that you are on a site that sells caskets?

Imagine this

If you own a traditional business store front, imagine turning away every fifth person that comes to the door to do business with you. There is no particular reason for turning them away, you don’t know them and can’t tell anything about the individual. Or, picture turning off all of your lights and painting your windows black, and then expecting your customers to find exactly what they came to your business to buy. What if you were to cram your whole warehouse of items into a small storefront that didn’t allow room for anyone to shop or move around? These scenarios aren’t going to be a positive experience for your customers. This is the type of experience that disabled users face everyday while online.

A person with a disability doesn’t have to have a severe disability in order to have problems surfing online. It could be an individual that has a vision problem and needs to make their font size larger than the default size. Can this be easily accomplished on your site? What about a person that has a developmental delay? Can they easily understand the information and content on your site, or are they confused by the terminology and extensive content that is overwhelming them? Users of your site that have dexterity issues, such as arthritis, might have a tough time using a mouse or the keyboard extensively to navigate your site. Another consideration is that a lot of internet users still are on dial-up connections. And let’s not forget about the new internet users that have their PDA or mobile device. This is a rapidly growing area that requires accessible web design and careful thought into your sites design.

About your business site

I won’t bore you with the details about how to create an accessible site, with examples of coding valid XHTML and CSS, but the basics come down to being able to still read the content (information) of any site just like it was a book. If all of the pictures, styles, colors and decorations on any site were to be turned off, would the content of the site still make sense? Would you be able to follow along with the stories and articles, or easily find your products that you came to buy? Is the navigation easy to follow and once you are on the page you are looking for, do you still know where you are? There are a few more reasons to have an accessible site.

There are many other reasons for web accessibility. These are but a few of them. It all boils down to the original definition that we covered in the beginning of this article.

You want to be able to make your information available to the most users possible.

In my next article, I will discuss some of the functionality and usability issues that are encountered and how to ensure your site is easily navigated by all users. If you would like to learn more about accessible web design, feel free to contact me via my sites contact form.

Here are a few good resources also for you to check out:

Like This Article?

Subscribe Subscribe to the RSS Feed
Add Your Comments 4 Comments - Add Yours!

Related articles:
Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • StumbleUpon
  • Digg
  • Reddit
  • del.icio.us
  • Technorati
  • Ma.gnolia
  • Furl
  • Simpy
  • Netscape
  • YahooMyWeb

Tagged:
, , , , , , , , , , ,

Comments

Introducing Guest Blogger Elliott Cross

July 19, 2007 | Filed Under Accessibility, General

We are proud to introduce our newest guest blogger, Elliot Cross of Red Truck Web Designs, LLC. Elliott will be writing for Solo Signal during the next week and has graciously agreed to pass on some of his knowledge and insights related to web accessibility and usability.

Elliott works out of Burlington, Kentucky and has a passion for developing sites using modern web standards. He brings a unique perspective on web development to Solo Signal and will no doubt provide us with some great information. Make sure to take a few minutes to find out more about Elliott and welcome him in the comments!

Like This Article?

Subscribe Subscribe to the RSS Feed
Add Your Comments Add Your Comments!

Related articles:
Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • StumbleUpon
  • Digg
  • Reddit
  • del.icio.us
  • Technorati
  • Ma.gnolia
  • Furl
  • Simpy
  • Netscape
  • YahooMyWeb

Tagged:
, ,

Comments