How to Design an Accessible Website

The web provides a unique way for people to get instant access to entertainment and education. But many parts of the web leave out people who have difficulties with hearing, movement, sight, or cognitive ability.

With more than 75% of families relying on the Internet for information every day, it’s crucial for websites to be accessible to all.

Developers should ensure that websites don’t exclude visitors with disabilities. Luckily, there are design techniques, bolt-ons, and apps that can improve accessibility.

What is Web Accessibility?

Web accessibility means that any person can access a website regardless of injury or disability. People should be able to read, understand, navigate, and even contribute to websites without difficulty. Online accessibility can address a number of different disabilities, including:

  • Issues with hearing or vision
  • Speech impairments
  • Neurological complications
  • Physical disabilities, particularly issues with fine motor skills
  • Cognitive impairments and dementia
Why Website

Why Make an Accessible Website?

From looking up home repair methods to studying for a test, just about everyone goes online to improve their personal and professional lives. Accessible online spaces ensure that even those with disabilities can access the information and communication technologies they need.

According to the United Nations Convention on the Rights of Persons with Disabilities, access to the web is a basic human right. In fact, online accessibility is required by law in certain circumstances.

The W3C Web Accessibility Initiative outlines technical specifications, guidelines, techniques, and supporting resources for online accessibility. These standards are upheld internationally.

Accessible web design makes it easier to read, navigate, and understand for everyone -- including people who are elderly, injured, and even those who simply have a slow Internet connection.

Tips for Creating Accessible Websites

Making your website accessible is not hard; it just requires taking the time to do it. The W3C Web Accessibility checklist is a great place to start.

Here are the most important tips:

Begin With Accessibility

It is much easier to design a website with accessibility in mind than to retrofit it afterward. Waiting may require expensive design changes.

Use Well-Structured HTML

Many people with disabilities use assistive technologies such as screen readers. These work much better with well-structured HTML including semantic markup in HTML5.

Use Color Wisely

Don't depend exclusively on color to transmit information because it may be meaningless to those who are color blind.

Provide Transcripts

Include a text transcript because some visitors may not be able to access audio and video content.

Make Dynamic Pages Accessible

Take care with dynamic page elements that update without a page reload because this can cause problems with screen readers. Use ARIA and HTML5 to make these pages accessible.

Provide Keyboard Navigation

People with fine-motor disabilities have trouble using the mouse. ARIA will help make your pages keyboard-navigable.

Go Minimalist

Minimalist design has long been popular on the web. This design philosophy also makes accessibility easier to implement.

Evaluating the Accessibility

Evaluating the Accessibility of Your Website

The first step in evaluating the accessibility of your website is to use the W3C Web Accessibility checklist.

Once you've worked your way through the checklist, you can dig deeper into various aspects of accessibility like color contrast. The W3C has an exhaustive list of tools you can use.

After you’ve addressed the checklist, you can get a report of your site's compliance with the Website Accessibility Conformance Evaluation Methodology.

Designing an Accessible Website

The Bottom Line on Designing an Accessible Website

According to the US CDC, roughly one-in-four Americans have some kind of disability. That's tens of millions of people you are turning away if your website isn't accessible.

By making your site more accessible, you’ll reach a wider audience and touch the lives of individuals of all abilities.

Want to a printable version of this guide? Download our free Website Accessibility checklist in PDF format.