A Primer to Website Accessibility

As the internet is becoming ubiquitous, more and more people with accessibility needs appear in the digital ecosystem. Website accessibility is an essential feature that doesn’t solely help disabled users but also improves the user experience of every visitor who lands on your site.

According to the World Health Organization’s statistics, there are more than one billion people worldwide who live with some kind of disability, and due to the aging population, this number is growing every year. Thus, targeting the expanding disability market is not only a moral or legal issue anymore but also an important business imperative, which is still largely unrealized.

Disability market and website accessibility, diagram
Image: Demographic analysis of the disability market (2020) by the Return on Disability Group

What Is Accessibility?

Accessibility is an overall design objective that aims to make products and services usable for people with permanent or temporary disabilities. Some examples include wheelchair-accessible ramps, Braille keyboards, audio signals at pedestrian crossings, or high-contrast user interfaces.

Digital Accessibility

Digital accessibility is a part of accessibility. It refers to the design and development of websites and applications built with the needs of disabled users in mind, following accessibility guidelines, patterns, and best practices.

Types of Disabilities

Accessibility needs come in many forms, including:

  • sensory impairments: the partial or full loss of one of the five senses (sight, hearing, touch, smell, taste)
  • physical impairments: the partial or full loss of one or more body system
  • mental impairments: various types of mental, cognitive, and psychological dysfunctions

Many disabilities fall into more than one category — for example, vestibular disorders cause both physical and mental symptoms. Some people also have more than one type of disability, such as deaf-blindness

All in all, disabilities have many intersections that accessible website design needs to take into consideration.

Accessible Website Design and Development

Accessible web design creates digital user experiences that users with different kinds of disabilities can consume, understand, and use without any loss of information and with as little extra effort as possible. 

Website accessibility is technically implemented by accessible web development practices that make sure that web browsers, assistive technologies, and other user agents deliver both the content and functionality without any access issues.

Digital Accessibility Needs on the Web

The best way to address the digital needs of people with disabilities is using an accessibility-first design approach that starts at the ideation phase and encompasses the entire development workflow — you can even make it part of your DevOps culture

The following comparison table summarizes the most important things to know about website accessibility:

Type of disabilityExamples and symptomsAssistive technologies and servicesWebsite elements that can cause access issuesDigital accessibility needs (examples)
Visionblindness, color blindness, low vision, blurred vision, extreme light sensitivity, astigmatismscreen readers, Braille devices, text-based browsers, applications in high-contrast mode, audio descriptionsfonts, colors, images, videos, icons, forms, navigationhigh color contrast; descriptive text alternatives for images, icons, and videos; properly labeled form controls; adjustable font size
Auditorydeafness, hearing loss, hyperacusis (sound sensitivity), tinnitus (ringing in the ears)speech recognition software, HATS (hearing assistive technologies), sign language interpretersaudio and video contentclosed-captioned videos, transcripts, removal of unnecessary background noise
Cognitiveautism, dyslexia, attention deficit, learning disabilities, memory losstext-to-speech and easy reading software, graphic organizers, specialist keyboards (e.g. helpikeys)longer text blocks, distractions,  navigationwell-structured content (illustrations, diagrams, comparison tables, summaries of longer text blocks), fewer distractions, clear navigation, descriptive error messages
Seizure and vestibularepilepsy; vestibular migraine, seizures, and nausea; dizziness caused by sudden/unexpected movementsbalance belts, wearable sensors, virtual reality apps (for rehabilitation)animations, auto-playing videos, too much movement (e.g. flickering or flashing effects), parallax effects, scroll-jackingthresholds for the frequency of content flashes (fewer than three flashes per second), animations with pre-set duration, short videos instead of animated GIFs
Motorloss/damage of limbs, multiple sclerosis, cerebral palsy, spinal cordone-handed keyboards, half-keyboards, trackball mice, foot-controlled micemouse and touch movements, keyboard navigationhighly visible focus styles, easy-to-follow tab navigation, ‘jump to main content’ links

Web Accessibility Standards and Laws

There are two official resources that can help you implement website accessibility: standards and laws. While laws are mandatory, web standards are guidelines and recommendations you can follow to meet the needs of disabled users and comply with accessibility laws.

Website Accessibility Standards

Web standards that discuss digital accessibility implementations are published by the World Wide Web Consortium (W3C).

They are as follows:

  • WCAG (Web Content Accessibility Guidelines) 2.0, 2.1, 2.2 (all three are in use: WCAG 2.1 extends 2.0, while WCAG 2.2 extends 2.1)
  • HTML5 (many assistive technologies understand semantic elements)
  • WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications) for accessibility features not covered by HTML5

Accessibility Laws and Regulations

While there are many local and regional regulations, the most well-known and frequently quoted accessibility laws are:

Accessibility Tools and Resources

You can make use of various tools and resources to improve website accessibility, including: 

  • Accessible color palettes
  • Accessibility-ready themes for content management systems such as WordPress
  • ARIA best practices
  • HTML5 conformance checkers
  • Website accessibility testing tools
  • Accessibility features of your browser’s developer tools

It’s also recommended that you manually test websites with the tools disabled people typically use, such as screen readers, keyboard navigation, or text-to-speech applications.

However, avoid using accessibility overlays as they can seriously harm website accessibility.

Color palettes for website accessibility
Image: Accessible color palettes by Accessible Palettes

Wrapping Up

Implementing website accessibility takes long-term commitment, accessibility-first design, and continuous testing and evaluation.

It also comes with many advantages — for example, you will:

  • support disabled users
  • reach a larger audience
  • provide better user experience for everyone
  • increase business value
  • connect with socially conscious customers
  • comply with website accessibility laws and regulations
  • improve your search engine rankings

To learn more about website accessibility, look into the accessibility checklist of the A11Y Project, check out the success criteria of the WCAG 2.0 guidelines, or generate a WAVE accessibility report for your website.

You can also see how assistive technologies work in practice by giving a try to your device’s built-in accessibility tools, such as Immersive Reader for Microsoft Edge, VoiceOver for iOS and macOS, or TalkBack for Android.

Anna Monus
Anna Monus

Anna Monus is a professional technical writer and editor, covering web development, programming, cloud computing, tech culture, accessibility, and more. Her work has been published by leading tech blogs and publications, including IBM Cloud, Envato, Raygun, Hongkiat, LogRocket & others. See more on her website or Twitter @azaleamollis.

Articles: 1

Leave a Reply

Your email address will not be published. Required fields are marked *