Usability

A usable site does not need to be utterly boring to the aesthetic senses. A usable web site is one that is easy to navigate, works with assistive technology (such as screen readers), and has text large enough to be legible.

Easy to navigate means that the links to click on are obvious. And if they’re not obvious, there is an alternate, more clear link somewhere on the page that goes to the same page. “Mystery meat” are areas on the page that might be a link, might not; they are not labeled.

Musicians seem to be fond of this style of navigation. While that’s fine for games, it can frustrate a user just trying to get to some information. Links that move around or expand to offer more links can be equally frustrating, for if one is not precise with the input device, the links can disappear too easily. Once a link has been clicked, the viewer should be able to get back where they came from easily.

I would disagree with the notion that text link colors must be the designated blue and purple from what the web inventors deemed would work back in the early 1990s. It is a good idea to have a link change in some way so it is obvious that page has been visited, but as long as the colors and link system are consistent throughout the site, the blue and purple can easily be substituted for colors that go more with the overall chosen color scheme.

Some color blind audiences might have trouble seeing a link if color is the only differentiation between linked and non-linked text.

Assistive technology helps those who are vision impaired. There are settings on the computer that enlarge text and turn everything black and white, and it will utterly destroy the look and feel of most web sites. Let’s hope that your site is visually clear enough that most users will not have to resort to this drastic setting. Screen readers, such as JAWS, read aloud the text on a web page, but how does it know what order to read the text? Text should be organized on a page in an interpretable fashion, so that if all the styles and graphics were stripped away it would still read the way it was meant to be read. When I have horizontal navigation in an html based web site, I tend to use the horizontal ordered list. Ordered lists keep your links and information hierarchical, as do h1, h2, h3 tags for headings.

Legible for whom? you might ask. You need to consider your audience. Perhaps teenagers and young adults won’t mind teensy text, but even if you go with text at 8 pt or below, the user should have the option to enlarge it.

For text to be legible it should not blend in with the background, or create a contrast likely to cause a stroke (such as, bright green text on a pink background). Blue text should be avoided (unless it is very dark blue), as blue is a “receding” color, and it is the most difficult color for your monitor to render. Blue as a background is a much better choice.

Text should also not spread out across the entire width of the screen. If you have more than one line of text and it wraps across a wide screen, the reader will have trouble finding where they left off from the previous line. Keep the column widths to the size of a book. There’s a reason that books are as small as they are.

Getting feedback is the best way to test if a site is usable. Having someone who has never seen the project and having them run a series of tasks, preferably while catching it all on video, can go far towards convincing a client where improvements need to be made. This is especially important in designing software, where you will either pay for usability testing before the product is released, or pay in much worse ways when the “usability testing” takes place with paying clients, and fixes need to be distributed to correct bugs and problems.