How to make your website accessible for the disabled

website accessible
website accessible

Making your website accessible matters! Did you know there are 20 million blind adults in the U.S., 10% use screen readers, and 8% of men and .5% of women are color blind? And did you know that the UN recognizes web accessibility as a basic human right (Article 21). So with these facts in front of you do you really want to isolate that audience?

Also, did you know that by making your website accessible you are making the site more search-engine friendly? Basically search engines read your content just like screen readers. All you have to do is turn off images and javascript in your browser and you will see exactly what the search engines/screen readers see. This is a quick and easy way to tell whether all of your content is readable or not.

  • Don’t use red and green colors together since they blend together for color-blind people. Use more contrasting colors.
  • Use descriptive text for links — DO NOT use “click here”! (ex. “Download our Animal Report”, “View all your health options”, etc.)
  • Don’t rely on javascript when not needed.
  • Avoiding mouse-dependent actions.
  • Use descriptive, unique, and relevant URLs, headings on the page, and meta tag page titles and descriptions.
  • Use descriptive alt tags for images (ex. image name is grapes.jpg but alt tag says “A man holding grapes”).
  • Label form fields appropriately and make sure someone can navigate through forms via their arrow keys, select and fill in all fields, including submitting the form. Highly recommend testing this with a screen reader tool.
  • Avoid tables for layout, but DO use tables for data only. See article from WebAIM on “Creating Accessible Tables” on how to do that.
  • Don’t use frames at all! They are deprecated anyways and search engines can’t index them.
  • Allow people to use their arrow keys to get around (content and pages).
  • Identify the language of your pages.
  • Allow multiple ways of finding content (search, sitemap, clear & consistent navigation).
  • Provide useful links to related/relevant resources.
  • Avoid CSS or other stylistic markup to present content or meaning. (ex. do not say “click the red button to…”)
  • Define abbreviations and acronyms.
  • Use intuitive navigation.
  • Use “skipnav” links so that screen readers can jump right to the content of a page without reading each and every navigation item first.
  • Use user-friendly design aesthetics.
  • For audio & video, use content alternatives like captions and/or transcripts.
  • Use Evaluation Tools to do Accessibility Testing – ex. Color Oracle, Chrome Spectrum (color-blind tester only), WAVE, Web Accessibility Checker, AChecker, Accessibility Valet
  • Assistive Technologies used by the disabled to read websites are braille display, screen reader, text-to-speech, voice browser, voice recognition, keyboard navigation.

If you are interested in getting a fully accessible site contact Evolv to give you an accessibility quote

back to top