HTML and CSS Reference
In-Depth Information
There are a few ways around this that vary in elegance. If you're using CSS to position
elements on your page, it can make sense to place the navigational elements after your
main content in your HTML file, but use CSS to position them wherever you like. When
a user with a screen reader visits the site, he'll get the content before getting the
navigation. You can then include a link that skips to the navigation at the top of the page,
and hide it using CSS. Users with screen readers can jump to the navigation if they need
to but won't be required to listen to it on every page.
TIP
It's worth remembering that many disabled users rely on key-
boards to access the Web. You can make things easier on them
by using the
accesskey
and
tabindex
attributes of the
<a>
tag to
enable them to step through the links on your page in a logical
order. This proves particularly useful if you also include forms on
your page. For example, if you have a form that has links inter-
spersed in the form, setting up the
tabindex
order so that the
user can tab through the form completely before he runs into any
links can save him a lot of aggravation. This is the sort of conve-
nience that all of your users will appreciate, too.
Images
Images are a sticky point when it comes to accessibility. Users with impaired vision
might not appreciate your images. However, clever design and usage of the tools pro-
vided by HTML can, to a certain degree, minimize the problem of image usage.
Images are known for having probably the best-known accessibility feature of any
HTML element. The
alt
attribute has been around as long as the
<img>
tag and provides
text that can stand in for an image if the user has a text-only browser or the image
weren't downloaded for some reason. Back when everybody used slow dialup connec-
tions to the Internet, it was easy to become intimately familiar with
alt
text because it
displayed while the images on a page downloaded. Later, some browsers started showing
alt
text as a tool tip when the user let her mouse pointer hover over an image.
Despite that
alt
text is useful, easy to add, and required by the HTML5 specification,
many pages on the Internet still lack meaningful alternative text for most (if not all) of
their images. Taking a few extra minutes to enter
alt
text for your images is a must for
anyone who uses HTML that includes images. Also bear in mind that using
alt=““
is
