ptg16476052618 LESSON 22: Designing for User Experience
colors to indicate the status of something) is not accessible. The best alternative is to
label them with text. For example, you might display an error message this way:
<p class="error">ERROR: You must enter your full name.</p>
Remember, too, that color impacts not just people who cannot see, but also people who
are color blind. If you have content on your page that relies on a difference between two
colors, your page will not be accessible. It will have the problem of using color I just
mentioned, but it may also run the risk of looking like two identical colors to a color
blind person.
You can also cause difficulty reading your page if the colors don’t contrast enough, espe-
cially your text and background colors. There is a reason that most word processors use
black text on white or pale backgrounds: The high contrast makes them easy to read, and
that makes it accessible to everyone.Fonts
When you specify fonts on your pages, you can cause accessibility problems if you’re not
careful. In some cases, font specification doesn’t matter at all because the user accesses
your site with a screen reader or alternative browser that completely ignores your font
settings. However, users who simply see poorly can have an unpleasant experience if you
set your fonts to an absolute size—particularly if you choose a small size. If a user has
set his browser’s default font to be larger than normal, and your pages are hard coded to
use 9-point text, that user will probably dump your site altogether.
In many cases, it makes sense to leave the default font specification alone for most of the
text on your site. That way, users can set their fonts as they choose, and you won’t inter-
fere with their personal preferences. If you do modify the fonts on the page, make sure
that the fonts scale with the user’s settings so that the user can see the text at a comfort-
able size.Be sure to test your pages with a variety of text size settings when
you do browser testing. Many users increase the size of fonts in
the browser to make them easier to read, and you should make
sure that if users have done so, your pages still work for them.
And, as mentioned previously, zooming on mobile devices is just a
pinch away.CAUTION