Creating an Accessible, Usable Web Site

Owned by Former user (Deleted)
Last updated: Aug 12, 2019 by Rachel Klingler
A usable site is easy to navigate and digest. An accessible site is one that can be used by persons with disabilities. Following some basic guidelines can help make your site easier for everyone to use.


UW System Guidelines for Accessibility

The UW System Web Governance Committee (WGC) has several policies pertaining to usability and accessibility requirements.

What is 'Usability' and 'Accessibility' Anyway?

  • Usability as an attribute of quality that refers to the promptness with which users learn to use something, the efficiency they attain while making use of it, how easy it is for them to remember how to use it, how error-prone it is and the level of satisfaction that they attain from using it.
  • Accessibility as defined by the The World Wide Web Consortium is an attribute through which “people with disabilities can perceive, understand, navigate, and interact with the web, and they can contribute to the web”. Web accessibility includes all types of disabilities that impact access to the web and thus includes visual, auditory, physical, speech, cognitive and neurological disabilities and adherence to web accessibility principles also benefits elderly users.

How Can I Create a Usable and Accessible Website?

The good news is by using Zuse and adhering to good writing and layout practices, your website will already be following WGC polices. However there are times when a little extra knowledge can make all the difference.  

Images

All information conveyed via an image must also be conveyed in some other way.

If an image conveys meaning beyond being decorative, use alternative text (alt text).  Alt text allows visually impaired users to utilize a screen reader.  Screen readers will read the alternative text of images. All alt text must indicate in complete words what the image is without abbreviations or acronyms.

Do not add alt text to decorative images. The system will automatically add an empty alt text attribute, which will tell screen readers the image does not convey any additional meaning.

Headings

Typically, the average user doesn't know much or care about your markup and whether or not it's semantically correct as long as it looks awesome and provides the needed content/services. However, users that use assistive technologies, like screen readers, rely on well implemented, structured, and meaningful markup.

To help make your site more accessible think about navigating through the header elements as allowing the user to understand the overall purpose of a page and how its content is structured. This could be similar to reading the table of context to a book. Text readers can skip from heading to heading to "skim" the page - make sure that would be an understandable way to read the site.

To use headings semantically, pay attention to to the number of the heading, not what it looks like. H2s should come before H3s, etc.

Always provide context to your links. Screen readers can skip from link to link reading the text that makes up the link. Instead of saying, "Read our annual report here", make the words that describe what the link is the actual link, "Read the annual report".

Writing guidelines

The WGC and University Relations, has put together /wiki/spaces/WT/pages/3211347 to ensure quality, consistency and help websites reach accessibility and usability requirements.