Codepath

Web Accessibility

What is accessibility and why is it important?

How do you use the internet? What are the steps that you take to find information that you need on a website? How do you know where to find the information you are looking for? How do you navigate through a web page?

These are questions that many people may not think about and are instinct. Many technologies, both physical and digital, disregard the needs of a large portion of our population, those who have a disability. According to the CDC, about 1 in 4 people in the United States has a disability and about 15% of people worldwide. There are a large variety of types of disabilities from physical (mobility), cognitive (brain functionality), auditory (hearing), visual, etc. While people who have similar disabilities may share similar experiences, it is important to remember that people are individuals with their own unique perspectives and experiences. It is important to put individuals first especially when considering their needs. Check out the CDC’s website on disability and learn more about how it impacts all of us.

Accessibility and inclusion is important and essential. In fact, designing with accessibility at the forefront benefits everyone. You may not realize, but many accessible technologies have been incorporated into everyday lives because of its benefits to all. For example, automated doors at stores, the pull down handle (instead of knobs), and voice recognition technology.

Web Accessibility

When thinking about digital content, there are many ways to make sure that the information you present is accessible to all users. Making a website more accessible isn’t hard, just requires an open mind! There are many simple ways that you can incorporate accessibility!

  • Using heading elements to introduce a new section. Users who use assistive technology like screen readers use headings to navigate quickly between text. This will allow users to jump around the webpage and find the information they are looking for faster without reading or listening to all of the information presented on the page. Along the same lines, use only one h1 element on your page. This indicates the high-level purpose of the page or view.
  • Provide both written and audio transcripts. Make sure that your users have multiple ways of receiving the information provided. This also applies to any videos provided on your page as well.
  • Use large font sizes. By default, font sizes should be no smaller than 16px.
  • Check animations for minimal movement/flashing. Strobing lights or animations may trigger seizures. It is also very distracting to most users.
  • Select accessible colors. There are many different types of colorblindness. Try using a grayscale filter over your website and check there is a strong contrast between colors. If you are using a Chrome browser, try using this Colorblindy extension to simulate different types of color blindness.
  • Providing alt text for images. By adding the alt text to images this provides users with a screen reader a text description of the images on your website. To learn more about alt text, check out Alt Text as Poetry. Since alt text is read by a screen reader, you can also use the Alt Text Viewer Chrome Extension to check the alt text of images for sighted users.
  • Links and buttons use unique and concise words. Be sure that any links or buttons have unique words to let your reader know where they will be redirected. Avoid links or buttons that just say “here”, “link”, “click”, etc.

These are only some simple ways to incorporate accessibility to your website. We highly recommend checking out the A11y Project for a full checklist and additional resources to learn more about web accessibility.

Resources

Fork me on GitHub