Website Accessibility Basics

By Kaitlyn Martinez // Associate Director of Development & Accessibility

Website accessibility ensures that your website provides equal access and opportunity to all users, regardless of ability. By making a website accessible, you’re removing barriers which would limit certain user’s experience, thereby giving everyone access to your content.

A man in a blue shirt working with three monitors in front of him.

Website accessibility can seem intangible, making it difficult to wrap our minds around it. Consider how physical businesses ensure that people with disabilities can access their buildings. For physical locations, we have handicap parking, sidewalk ramps, elevators, etc. Website accessibility is essentially translating those items into the web.

Common Misconceptions

Accessibility isn't just for people with permanent disabilities like blindness. It could also be for someone who broke her hand and must now use a keyboard to navigate a site. It could also be for those who recently had their eyes dilated and can’t see as well or even someone with an ear infection who can’t hear as well. In other words, website accessibility seeks to accommodate both long-term and short-term disabilities.

What are the consequences of having an inaccessible website?

Website accessibility is not simply a matter of being considerate; inaccessible websites risk legal ramifications. For example, your business can be sued for having an inaccessible website. In 2017, there were 800 lawsuits filed pertaining to website accessibility. In 2018 and 2019 over 2,200 lawsuits were filed each year.

The likelihood of being sued for inaccessible content depends on several factors:

You are more likely to be sued for an inaccessible website if you have a brick and mortar location. This is because the U.S. does not currently have laws specifically for website accessibility. However, we do have laws about brick and mortar accessibility; so if you have a brick and mortar location, legal authorities expect your online “location” (your website) to be equally accessible.

The industry you are in affects your likelihood of being sued. Below is a list of the most likely industries.

Retail
Food Service
Hospitality
Banking
Entertainment
Education

Certain types of websites are more at risk of infraction. Those include e-commerce sites and ones from 3rd-party developers which are not compliant.

Accessibility Guidelines

The Web Content Accessibility Guidelines (WCAG) cover a range of recommendations to make a website more accessible for as many people as possible. The WCAG outlines three levels of accessibility: A, AA, and AAA.

A is the base level of minimum accessibility suggestions. AA includes all A items and some additional AA items. AAA includes all the suggestions. AAA is a difficult level to reach and could cause usability issues depending on the content of your website. Click Rain normally recommends AA for most sites.

Things you can do today To Make Your Site More Accessible

Link purpose means that a user can determine where a link will take them before clicking, by simply looking at the linked text. We commonly encounter generic “click here” links online. Such links should be much more descriptive and portray exactly what will happen when that link is clicked. One example could be “View our Lunch Menu” instead of “click here” to see our lunch menu.

The page title is the first thing a screen reader reads out when it gets to a page. Make sure that your page title is unique and accurately describes the page’s content.

Website landing pages should use appropriate headings to structure its content appropriately. Headings support page navigation. There are six levels of headings on websites (h1, h2, h3, h4, h5, h6). There should only ever be one h1 per page. From there, you may use the rest of the headings as often as you like. The trick is to make sure the next heading you use after an h1 is an h2. Don’t skip from using an h2 to an h4. They need to be used in order.

However, after you use an h3 you may use another h2, depending on the logic of the page’s content. It’s all about proper order and structuring. Below is an example of how you can structure a page:

Heading 1 - Title
- Heading 2 - Main Idea
  - Heading 3 - Sub Topic 1
  - Heading 3 - Sub Topic 2
- Heading 2 - Second Main Idea

Alternate text is what a screen reader reads out when it focuses on an image. Therefore, all images on your website must include alt text which accurately describes images for users who require assistance. This text will also determine if an image is unable to load for any reason.

Screen readers are unable to read text on an image, so it is important to portray any information in actual text on the page. Depending on the image, text overlay can create a bad contrast ratio, making it difficult for anyone to read.

Use closed captioning or transcripts for video or audio so that people with hearing impairments can also engage with your content.

Ensuring that everyone can experience your website benefits your business by broadening your audience. Ultimately, website accessibility matters because your customers matter. Not sure if your website is accessible, or confused on where to start? We can help!

Let's Talk

Reach out to our team with questions, comments, or new project ideas. We'd be happy to hear from you.

Get in Touch

About the Author Kaitlyn Martinez // Associate Director of Development & Accessibility

Kaitlyn (M.B.A., Dakota State University) plays a pivotal role on the Development team at Click Rain. From CMS builds to standard front-end development, she helps deliver high-performance websites for our clients.