You are here

3 Steps to Improve Accessibility

Elizabeth R. -- Mon, 01/26/2015 - 10:53am

A quick guide to using your site's tools so you can improve the experience for every site visitor. Making your users trudge through mud to get the information they need is not exactly encouraging and doesn't say, "Welcome to UL Lafayette!"

When we say "site accessibility," most often we're talking about making sure your site is easily usable for people with visual, hearing, cognitive, or dexterity impairments. But, in almost every situation, following accessibility standards means improving the experience for every site visitor.

As a university, we have an ethical and legal responsibility to make our sites accessible and ADA compliant. Our templates are already compliant (with appropriate colors and contrast levels), but it's up to you to make the actual content compliant. Follow these four simple steps to make sure you're letting all audiences learn more about your department, programs, office, and activities.

1. Use headings correctly

If someone with a visual impairment visits your site, they'll usually have to use a screen reader. When they visit a new page, the screen reader will read aloud all of the headings and their sizes to the site visitor. That helps a site visitor know which part of the page they need to focus on in order to find the answers they're looking for.

Headings describe the topic you're about to cover or discuss. In the CMS, you have six different heading sixes to choose from, and you use those to create a hierarchy of information. You should use them in this order (and do not skip levels!):

  • H1: The name of the page. This is automatic.
  • H2: Main ideas on the page.
  • H3: Sub-ideas that fall under the main ideas
  • H4: Fall under the sub-ideas

And so on and so forth. You'll rarely using H5 and H6, but sometimes you need 'em. View the University's admissions page for a strong example using H1, H2, and H3. This page, because I don't have many sub-ideas, uses only H1 (for the name of the blog post) and H2 (for each step).

2. Label links properly

When you use a screen reader, it can also read all of the links aloud when you visit a page. If you don't embed your links, that could mean listening to a frustratingly long URL being read aloud to you — with no idea where it leads. If you embed your links but have them say "click here" or "here," that means all a screen reader will locate are the words "click here, here, here, here, here, here, here..." on a page. Can you imagine how frustrating that would be if you're looking for something specific?

If someone has dexterity issues, they may not be clicking with a mouse. Telling them to "click here" can also become troublesome. Just remove the words "click" and "here" from your online vocabulary.

The most important thing to remember when creating links is to provide context! Tell them where they're going and what they'll be doing.

Some examples:

  • "Download the application form;" not "Download."
  • "Visit the Bursar's site for tuition information;" not "Visit."
  • "Email the department head;" not "Email."
  • "Learn more about the accounting program;" not "Learn more."

3. Test your text for readability

In order for your message to be clear, your writing needs to be clear, concise, and simple — which makes it easier for everyone to find the information they need. That's where readability comes in.

We read differently on a web browser than we do a book. In books, we pore over every sentence, making sure we see and absorb everything. On the web, we're all about skimming. We read through quickly to find the word(s) we're looking for. We move through sites quickly. If we don't find what we're looking for, we're on to the next site. Don't give people a reason to leave your site.

To make your site easier to read, you need to write at a 10th-grade reading level. I know that seems low, but that's the best gauge of making sure your information is clear enough.

The easiest way to test the readability of any page in your site is to use read-able.com. It'll tell you what the average grade level for the page is, and other text statistics — all explained pretty thoroughly on the page. You'll get better scores if you use headings properly and use shorter sentences. Compete with yourself to get higher scores! (Am I the only one who thinks that's fun?)

For the record, this blog post scores at a 7th-grade reading level.

What else can I do for accessibility?

Shameless plug: If you want to learn more about site accessibility, sign up for the next Web Writing Workshop! You can also read our accessibility standards.

Test your page's accessibility before and after you make changes by using the WAVE web accessibility evaluation tool.

If you want to know more about captioning videos, providing alt text for photos, creating transcripts for podcasts and videos, and other accessibility initiatives, get in touch. Email me at webcontent@louisiana.edu.