One of the first things to consider when creating nearly anything is your audience, and websites are no exception. At first glance, most simply consider the audience when it comes to what content will be on the site, and how it’s displayed. However, for many websites there is a forgotten audience: those who need the use of screen readers and other accessibility tools.

What is website accessibility?

Website accessibility allows users with various disabilities to navigate and access online content where otherwise they would not be able to. Let’s use screen readers as an easy example. The screen reader is going through a paragraph of text. Simple. Then an image comes up. Screen readers will not be able to read the picture is without alternative text (alt tags) giving a brief description. While having alt tags for images is technically a best practice for web developers, it can easily slip under the radar as a low priority since they’re invisible to the majority of users.

How does it affect you?

Making your website accessible often simply involves following current best practices in development. Don’t be dismayed if your website is not already accessible though, it doesn’t mean best practices weren’t used when setting it up or that it doesn’t work. Standards in web development evolve, and currently they’re headed towards accessibility. Even if your site works fine without being accessible, it’s worth your time to look into updating it. Not only does making your site accessible help your content reach a wider audience, it can often improve your Search Engine Optimization (SEO) and make your website more user friendly to all who use your site.

In certain instances, not having an accessible site may violate the Americans with Disabilities Act (ADA). This year in a first of its kind trial, a case was won against Winn-Dixie Stores, Inc. for not having an accessible site. Public accommodations, such as grocery stores, are required to comply with ADA Standards. It was ruled that the website was an extension of the store. Therefore it was also deemed to be a place of public accommodation, requiring that the site be made accessible.

Whether or not you are legally a place of public accommodation, you should still consider making your site accessible. It’ll benefit more than just those with disabilities.

Accessibility Standards

The Web Content Accessibility Guidelines (WCAG) are the standard for how to make your website more accessible to those with vision and hearing impairments, learning disabilities, limited movement, speech disabilities, or any combination of these. Three different levels of conformance for these guidelines are provided in the WCAG standards. Different levels may be encouraged for different sites. Below are some of the main guidelines, and how they can help your site as a whole.

  • Text alternatives for images

Adding text alternatives for your images doesn’t just help the visually impaired have access to your content. Having alt tags relevant to the rest of your page’s keywords can help your SEO too. Turns out search engines and screen readers recognize content pretty much the same way. Added bonus, if the images are just taking a while to load, users will know what’s there anyway.

  • Captions and audio descriptions for video

This one is pretty straightforward. If you have a video, provide optional audio descriptions for the visually impaired. Adding captions makes your videos accessible for the deaf. It also makes people who silence their phone for videos most of the time more likely to watch them.

  • Straightforward and consistent site structure

Make sure your site’s layout makes sense and is consistent across the site. For example, try not to move the navigation to a different spot on every page. When inputting content, the html should be properly formatted with appropriate start and close tags, headers, and nesting attributes. If you’re a developer, you know what I’m talking about. If you’re not, let me show you what I mean. You see this article right here that you’re reading right now? Good. Notice those bold paragraph headers? If you simply bold that text, screen readers won’t recognize them as anything special. If you add the appropriate heading tags, screen readers can recognize them. That will give others accessibility to skim through the main points, just like you are right now.

  • Separate foreground from background

Believe it or not, having a medium blue background with medium grey text isn’t going to make your content easy to read. The same goes for overlaying text on images. Make sure there is a strong contrast between the foreground and background for a better user experience all around.

  • Make functionality available from a keyboard

A lot of websites are based on the assumption that the user has either mouse or a touch screen. If you’re blind, knowing what you’re clicking on might be a little difficult with either of those things. Those with physical limitations and tremors may also find it necessary to navigate the web with a keyboard. Make sure your site can be used from only a keyboard. Go ahead and try it now and see how far you get; the tab button may just become your new best friend. (Shift+Tab is for navigating backwards, good luck.)

  • Provide users enough time for content

If you have anything that automatically advances on your site (like rotating header images—a lot of sites have these), make sure that you give users plenty of time to fully view content before it progresses. When in doubt, including manual navigation is always helpful.

  • Do not design content in a way that is known to cause seizures

Is your dream to have a website background that strobes through bright colors? It’s time to let that dream die. Not only is it a bad design decision, it can be dangerous to some.

  • Provide clear navigation

We’ve all gotten lost in a site where you can’t get back to that one page you needed. Don’t be that site. Make your menus straightforward, and if your site really is too complex to have every page available from main menus, provide a breadcrumb navigation. Breadcrumbs let people can backtrack how they even got to this page in the first place. Many shopping sites use breadcrumb navigation at the top of their page—below is an example of Target’s.

Image of Breadcrumb navigation

Example of Breadcrumb navigation

  • Make content readable

Use a standard language when writing content. Including slang or unusual jargon can make your content difficult to read, especially for some screen readers. Include section headers if you’re planning on talking about a lot of things so people can easily follow what you’re talking about.

  • Help users avoid and correct mistakes

If a user has to input their information in a form, help them out by marking which fields are required. Did they miss a field? Have the page point out which one so they can progress more smoothly.

Improving site accessibility is likely going to become a bigger deal as the internet is seen more as a necessity rather than a luxury. Following best practices in this area will not only benefit your audience with disabilities, but your site overall. Having clear design and navigation helps all users. Having proper structure in the backend helps any non-human going through your site, like search engines. Even if you’re not sold on revamping your whole site, you’ll want to keep accessibility in mind moving forward.

Article written by

digital accounts executive/great british baking show enthusiast/crafting connoisseur