Web Accessibility

Posted: October 21, 2014
Last updated: February 9, 2015

In a nutshell, web accessibility means that all users, regardless of disability, must have equal access to the information on your website and must have equal opportunity to perform tasks on your websites (eg. filling out forms). As a branch of the State of North Carolina, Appalachian State University is also required to comply with Section 508 of the Rehabilitation Act of 1973, so web accessibility on campus is not just good practice—it is the law.

The most common types of disabilities for which your website must account for are...

  • visual
  • hearing
  • motor
  • cognitive

Consider users with each of these disabilities when preparing and posting information to your website. Although I do recommend an online accessibility checker below, there is no magic solution and there is no substitute for common sense. You must put yourself in the position of a user with a disablility and evaluate your website from that user's perspective. This is sometimes impossible unless you actually have that disability. A project called WebAIM (Web Accessibility in Mind), which is sponsored by Utah State University, has a website full of great resources, including a good Introduction to Web Accessibility that includes information directly from the perspective of users with disabilities.

Levels of web accessibility

The accessibility of your website is assessed at different levels...

Site level

Is your website navigable by people with disabilities? Can it be navigated without a mouse? Is your website navigable with scripting turned off in the browser? These accessibility features are usually handled by the web theme that you are using.

Page level

Do your pages use proper HTML markup? Do you have appropriate headers, lists, etc? Are all links properly described? If your page contains visual information, does that information also appear on the page as text that can be read by a screen reader? You need to pay particular attention to this. As a content creator, you have the power to make your pages accessible, or to open yourself up to liability under the law. Page level accessibility is in your hands.

Resource level

If your page links to a PDF, is that PDF itself accessible? Are videos closed captioned or, at least, include transcripts? Is audio transcribed? Do images contain appropriate alt text where appropriate? These things are also up to you. Pay attention to the accessibility implications of the documents, videos, etc. that you post.

Trouble spots

Headers

Headers - ie. HTML elements <h1> through <h6> - are used to break the content of the page into logical sections. Screen readers see headers as semantic in nature and pay particular attention to them, offering them up to users as a means of navigating within a page. Often, however, site editors will deploy headers just because they want a certain piece of text "more visible" or as a shortcut to a certain visual look. Do not do this. Only use headers to delineate content.

Video

Video requires at least two accessibility considerations. The visually impaired are relying on sound to pass them information, so graphics with no corresponding speech, such as the name of somebody being interviewed, would need to be in a transcript that can be accessed by a screen reader. The hearing impaired rely on visual cues, so closed captioning or, at least, a transcript is required. (Closed captioning is recommended.)

Audio

Audio, such as podcasts, readings, sound bites, etc. requires a transcript for the hearing impaired.

PDFs and documents

PDFs and documents, because they are downloadable and thus represent separate standalone objects, must be individually accessible. Please consult the documentation for the software that you use to create these documents for instructions on how to make them accessible.

Images

Any image that either contains information, such as embedded text, or that serves as a link, such as a thumbnail, needs to have appropriate alt text that describes it so that a visually impaired user can still reap that information. In the case of an image that serves as a link, the alt text should describe where the link goes. In the case of images which are pure eye candy—eg. decorative page header images, etc.—the alt text should probably be left blank. This is not a perfect science— ie. there may be pros and cons to using any solution. Also, image treatment is often influenced by page context. If the content on the page describes what is on the image, supplying alt text for the image may be superfluous.

Tools

There are several online accessibility checkers. My favorite is the Wave web accessibility evaluation tool.

Related links

Pete Montaldi
montaldipa@appstate.edu