10 Tips For Website Accessibility: Your Website Accessibility Checklist

favicon-noah-website

When it comes to how your company is being represented online, aesthetics and volume of content are not the only significant factors in how “accessible” you are. Website accessibility should be approached similar to the way an architect needs to look at an office building or other facility. That is, you also need to take into account the sorts of inspection guidelines that the Americans with Disabilities Act (ADA) brings to light.

The ADA is a civil rights law providing protection to people with disabilities. Your website should be making audio-visual accommodations to help users to navigate your site, and that includes scenarios where they have to use assistive devices.

Below are a few of the ways that you can make sure that your business has an inclusive, ADA-“compliant” website.

Review Accessibility Guidelines

Putting the cart before the horse isn’t a good idea. Before overhauling parts of your website, make sure you know the Web Content Accessilibity Guidelines (WGAC) 2.0 and make a plan. Prioritize updates according to the concepts outlined in the WGAC:

  • Perceivable
    Non-text content is represented with text alternatives so it can be translated into forms like braille, symbols, speech, or otherwise.
  • Operable
    All the actions available on your site are able to be executing by way of the functions of a keyboard.
  • Understandable
    Is the language you use easily understood, abbreviations explained, and unusual idioms or jargon expanded upon in the text?
  • Robust
    Sections, markup, and other components of your site are nested and implemented in an order that makes the site compatible with assistive technologies and add-on components to support visitor needs.

Audit Your Site

Have you already done an assessment of your website as it is today using a tool like Google’s Lighthouse or WAVE?
As the saying goes: If it ain’t broke, don’t fix it!

Tools like the above-mentioned Google one in particular will only catch a portion (read: less than half) of your overarching accessibility issues… but it is a start. The WAVE tool will identify page errors that you can pick out and fix one by one if you so choose.

If you want to test the site with a keyboard-only navigation software you will get a better feel of whether your pages actually have the logical sense needed to make translation and interpretation possible and straightforward.

Use Alt Tags

Players, voice-over tools, or other screen reading technologies will help visually impaired visitors to navigate your website. Across your site you use images, and each of those should have alternative attributes (commonly referred to as “alt tags”) that tell the visitor what they’re looking at in text form.

Every image you have on your website should have alt text!

Alt text should be around 75 to 100 characters and should be as descriptive as possible, also including any meanings and references.

Choose Intentional Graphics

All images you feature on a site, all the picture representations, should be meaningful and intentional. Not only that, but the images themselves should be easy to interpret by someone who isn’t able to see well but might be able to make out some components of the image.

The WCAG has particular recommendations to help guide you when selecting images, including contrast ratios and orientation guidelines.

One other thing in this category to pay special attention to: Avoid flashing page features in consideration of users who are susceptible to seizure activity.

Make Sure You Have Legible Text

In addition to the obvious things like using contrasting colors for legibility, it’s important to check your fonts and make sure you’re using all “sans serif” style across the site. This means they don’t have little decorative extensions like Times New Roman, for example. Sans serif style is easiest to read and is widely available. Some examples are Calibri, Arial, and Helvetica. We encourage you, if interested, to visit TeachingVisuallyImpaired.com for more information.

Review Your HTML Tags

Enlist help on this one if needed, but the “robust” aspect of the WCAG guidelines means you’re using standard HTML tags across your entire site. That includes all images, graphics, forms, buttons, menus, attached files, and so on. Platforms like WordPress already build this right into their site code for you, but it is still a good idea to have a developer take a look and check the code and CSS (also referred to as your “style sheets”).

Inspect The Navigation

Help your users to find what they might need or want to see, and help them to keep track of where they are on the site. Menus should be readily available, and they should include some indication of where the visitor is in their journey across the site. Your URL structures should show their relative “depth” on the site, and should be a direct reflection of your clean hierarchical design.

Again, this should all imply that your site is navigable by keyboard alone, meaning no mouse or touchscreen is necessary to use the site. Even your video content, for instance, should be able to be controlled via keyboard functionality. All of this all comes down to core website accessibility by way of structure and features.

Feature A Transcript For Audio And Video

If you have YouTube or Vimeo videos, or anything else that’s playable on the site like that, you should have transcriptions and associated audio in place for hearing-impaired or visual-impaired users browsing your site. This same concept applies for audio, in that you want to make sure that if people cannot hear it that you have a way for them to at least know what it features. Better yet, the transcription will tell them exactly what it is and what it is saying.

Find Users To Test The Site

Peer review is key. If you can, ensure the content truly is accessible via different methods by having it attempted! Methods might include: Screen readers, braille devices, synthesized speech, magnification software, eye tracking systems and keyboard-only use, and/or caption-only or transcriptions.

Stay Up To Date

Needs of those that the ADA supports and protects can change, as with all technology this day and age. There will be new emerging assistive tools and other developments, so you should keep your website accessibility up and make sure your website code stays current and organized while you’re at it!

Website accessibility is not simply a matter of compliance. Make your content available to all who are interested in seeing what you have to offer online! It is just one way to ensure that you are being inclusive and available as an organization and a resource.

For more tips on maximizing the quality and usability of your technologies, stay tuned in here on the Cooperative Systems blog.

Contact us with any thoughts or questions related to this topic, if you’re interested in having an audit done on your company’s website, or if you would like to know how Cooperative Systems can assist with your website accessibility and performance!

  • This field is for validation purposes and should be left unchanged.