|
Is
Your Site Accessible? Five Simple Tests
By Sue Bolander, Webworks7
Accessibility is not a new issue, but there is still a great deal of
confusion out there about what makes a Web site accessible and why it
matters. If you don't think this topic is important, consider this:
Over 10% of the online population is disabled (750 million people
worldwide, 55 million Americans)
Barriers to websites restrict access to information for over 550 million
people with disabilities worldwide, representing over $176 billion in
discretionary income. If that
doesn't matter to you or your organization, remember that some of you
are required by law to have accessible sites, and others may be sued if
your sites are not accessible. If you happen to work for the Federal
government, Section 508 of the Rehabilitation Act mandates that Federal
Web sites need to be designed so that every citizen can access the
information. And finally, remember that we are all just seconds away
from being disabled ourselves. At any moment, an accident or diagnosis
could change our lives. If that happened, we would want to retain our
independence as much as possible, and the Internet would be a big part
of that.
In this article, I am going to focus on a few basic accessibility topics
and some simple ways to test your site for problems. This is not an
article on absolute compliance with the law, but consider the
suggestions presented here as a step in the right direction.
Test 1: Turn Off the Graphics
View your Web site and turn off the graphics. To do this in Internet
Explorer, click "Tools," then "Internet Options," then "Advanced." Look
in the "Multimedia" section and uncheck the box that reads, "Show
Pictures." Click "Apply," then refresh the page.
Are you able to use and understand your site without the graphics? If
not, you need to add ALT tags to your code. These tags provide text
information for each graphic, allowing visually-impaired users to
understand what the graphic represents. These tags are especially
important if you use graphics as navigation buttons. If you use an image
map with "hot-spots" for navigation, provide text links in addition to
this system. Not only will this ensure that all users can access the
pages, it will allow search engine spiders to find them.
Test 2: Copy Your Site Into Notepad
View your page with your browser and choose "Edit," then "Select All,"
then "Edit," then "Copy" from the menu. Next, open Notepad or some other
text editor and paste the text into it. You are now seeing your site
with the contents linearized, much as a screen reader "sees" it and
reads it to a blind user. Is the site in the correct order, or is the
text scrambled? If the site doesn't make sense, you need to examine your
layout structure and redesign the layout cells so that the text falls
into the correct sequence when the page is linearized .
Test 3: View Your Site in Black and White
Print your pages with a black and white printer and make sure that
everything on it can be interpreted when there are no colors present. Is
there enough contrast to make the text legible? Change any instructions
on the site that rely upon color, such as "Click the green button to
submit the form." If you use maps or pie charts, can you differentiate
between the colors that you have used? If not, try changing the colors
or adding a pattern to some of them to make them easier to read in black
and white.
To test your site even further, run a page through the color-blindness
simulator found at Vischeck.com.
This tool will create a graphic of your page as seen by a colorblind
person.
Test 4: View Your Site Without Your Style Sheet
To do this, either move your external style sheet to another folder or
temporarily rename it. Next, refresh your page to see your site without
the designated font faces, colors, or other special formatting features
specified in your style sheet. Does your page look very different in
terms of font faces and sizes? Good - it should. Does it still make
sense and is it useable? If not, you may need to consider other methods
of accomplishing your layout or formatting goals.
If your site looks exactly the same after performing this test, you have
probably used the FONT tag and hard coded your font faces and sizes.
When you do this, you make it impossible for a visually-impaired user to
override your font choices with ones that are larger and more legible.
You should redesign your site so that all text formatting is done with
an external style sheet instead of with the FONT tag.
Test 5: Unplug Your Mouse
Are you able to use your site effectively without a mouse? Many
disabilities make a user unable to control a mouse, and these people
will use your site with the keyboard only. Can you navigate your way to
every page using only the Tab, Arrow, and Enter keys? Can you still use
your forms?
Do you have a menu system that is only visible during a mouseover? If
so, can you access the interior pages without a mouse? You don't have to
get rid of your mouseover menus, but be sure to provide another way to
access the pages, such as a text-only Site Map or text links in addition
to the pop-up menus. This will also ensure that search engine spiders
can find all of your pages.
If you revamp your site so that it passes these five tests, I can't
guarantee that your pages will be completely accessible, but you will be
much closer to that goal.
|