Get to know WebAim

A great place to start, the well-regarded WebAim site is packed with rules, tools and tips for creating accessible web pages.

Follow the standards

Use HTML tags the way they were intended. Headings, lists and paragraphs should be marked accordingly. Tabular data should be placed within tables. Screen readers take their cues from the markup to organize content for listeners.

Don't mix styling instructions in with your HTML code. Use CSS stylesheets to style the content on pages. Separation of content and style makes pages more accessible and easier to work with.

Provide alternative text for images, graphics

All images, including graphics and buttons, require alt tags. Alt tags describe the content or function of images. They're useful for:>/p>

• People using screen readers
• Those who've turned off their image displays
• Search engines

Longer descriptions: A complicated image, such as a chart, often requires more text. There are several ways to do this:

• Describe the content of the image within the document
• Link to another web page with an explanation of the image
• Use the longdesc attribute in the image tag to link to more information. Like the option above, the link takes you to another page. However, the link generally is hidden from sighted users.

When to use an empty alt tag: If an image doesn't provide any additional content or function (for example, a purely decorative graphic or an image that provides no more info than that already in the text), it still needs an alt tag. But the tag should be empty like this: alt=" ", so that screen readers know to ignore it.

Provide alternatives for video and audio

If web pages contain video and audio files, alternatives should be available to those who have visual or hearing impairments. Generally, these requirements can be met in these ways:

• Audio files: Provide a text transcript.
• Video (no audio): Provide text transcripts and/or audio descriptions of the video
• Multimedia (video and audio, a webcast): Synchronized captions and text transcripts should be provided.

Making video and audio accessible after the fact is much harder than incorporating accessibility into media files in the planning stages. A number of captioning technologies are available for those creating video and audio for the web.

See Captioning Video for Universal Access for useful tips on captioning your Iowa State videos.

Form elements

Ideally, the titles of form elements should be adjacent to input fields. For example the title "STREET" should appear next to an input box for the street and "YEAR" should appear near the year input box. However, when web developers use tables for forms, screen readers have a hard time matching up titles and input areas. The solution is easy: Use explicit labels.

Skip navigation

Sighted people using a mouse can bypass the navigation lists, directories, site searches and icons that traditionally populate the top portions of a web page and quickly zero in on the page's key content. Without skip navigation, unsighted users must listen to a screen reader laboring through the preliminaries. Those navigating by keyboards must peck their way through. The solution is skip navigation. Provide a "skip navigation" link at the very top of the page to let everyone speed through to the main content.

Allow mouse-free surfing

Many users cannot use a mouse. They must access web pages using keyboards or other devices that can be activated by taps or airflow. To ensure that your web page is accessible to these users:

• Do a search to find the keyboard shortcuts for one of the popular browsers
• Call up a web page and unplug your mouse
• Using the keyboard shortcuts for your browser, see if you can access all the content on the page

Add your own accesskeys? It's possible to create customized accesskey shortcuts. However, one big issue is that the customized shortcuts may interfere with shortcuts on browsers.