5 web design sins from the experts

by / Filed under Web

As you can probably gather from this blog, I’m interested in the areas of usability and accessibility and how they relate to web design. There are some fabulous web designers out there, but the age old apparent conflict between attractiveness and accessibility sometimes flares up on their own web sites. Here I present 5 areas in which even the experts could improve:

1. Squinting is not fun

A perennial favourite. I think designers often find large, sans-serif text ugly. So a surprising number of sites still use really small text:

An example of too-small text

(From Mark Boulton’s web site).

Small text is difficult to read, even when given a generous leading. And 11 pixel Lucida is too small.

Designers can be very creative when they style their links, but there are some very sensible guidelines that should be followed in order to ensure they are clear to all users (according to wikipedia, 6% of males are deuteranomalous). If designers use red or green as their link colour they should ensure that the link is underlined, otherwise it becomes indistinct from the rest of the page:

Red, non-underlined links are indistinct from the rest of the text, as this screenshot from the Information Architects website shows

This is an example from iA: superb designers who write extremely entertaining, oftimes controversial articles about design and the web.  But can you spot the link?  This is how some colour-blind readers see the page (screenshot made possible by the essential ColorOracle).

3. Text is words, not pictures

The web and html are inherently flexible and copyable phenomena. If I read something I like on the web I should be able to copy it and manipulate it as I please (in a Word document, for example). Unfortunately for designers, there are only a few fonts that are ‘safe’ to use across the web. To get round this designers will go to extraordinary lengths, perhaps by using images instead of text:

An example of image replacement from Daniel Malls site - beautiful fonts, but not copyable

(This is from Daniel Mall’s site - normally bold in its adherence to good old simple text and typography.)

4. Some fonts should stay on paper

I’ve written about this before. Unless it’s being used as a large heading, Times is inappropriate for the screen. Georgia is a wonderful thing.

Times is cramped on the screen

(From the New Yorker.)

5. Who turned the lights out?

I see this often when designers use dark backgrounds. Contrast is important for all users, not just the visually impaired:

Contrast too low

(From Bright Creative.)

So we can see that designers often make decisions that affect the usability and accessibility of their sites. Is this a disaster, or quibbling?