Disability Types — Visual, Auditory, Motor, and Cognitive

In this tutorial, you will learn about Disability Types. We cover key concepts, practical examples, and best practices to help you master this topic.

Web Accessibility must address four disability categories: visual (blindness, low vision, color blindness), auditory (deaf, hard of hearing), motor (paralysis, tremor, arthritis), and cognitive (ADHD, dyslexia, autism, memory impairments).

What You'll Learn

You will learn the four main categories of disability, how each affects web usage, what assistive technologies each group relies on, and Design Patterns that make your site work for all of them.

Why It Matters

You cannot design for accessibility if you do not know who you are designing for. Understanding disability types helps you empathize with users and prioritize the right fixes.

Real-World Use

When DodaTech designs a new feature for Durga Antivirus Pro, the team considers all four disability types: screen reader compatibility for blind users, captions for security tutorial videos, keyboard-only scan scheduling for motor disability users, and plain language threat descriptions for cognitive accessibility.

flowchart TD
  A[Disability Types] --> B[Visual]
  A --> C[Auditory]
  A --> D[Motor]
  A --> E[Cognitive]
  B --> F[Blindness, low vision, color blindness]
  C --> G[Deaf, hard of hearing]
  D --> H[Paralysis, tremor, arthritis]
  E --> I[ADHD, dyslexia, autism, memory]

Visual Disabilities

Blindness

People who are blind use screen readers that convert text to speech or braille. They navigate using keyboard shortcuts and rely on alt text for images, proper heading structure, and ARIA landmarks.

<!-- Accessible for blind users -->
<img src="security-chart.png"
     alt="Bar chart showing threat detection rate improved from 92% to 99% in 2026">
<button aria-label="Download report" onclick="download()">
  <span aria-hidden="true">&#8681;</span>
</button>

Low Vision

People with low vision may use screen magnifiers that enlarge portions of the screen. They need resizable text, high contrast, and layouts that do not break when zoomed to 400 percent.

Color Blindness

About 8 percent of men have some form of color blindness. They cannot rely on color alone to convey information. Use text labels, patterns, and icons alongside color indicators.

/* Status indicators that do not rely on color alone */
.status-error::before {
  content: "[X] ";
  color: #d32f2f;
}
.status-success::before {
  content: "[OK] ";
  color: #2e7d32;
}

Auditory Disabilities

Deaf and Hard of Hearing

Deaf and hard of hearing users cannot hear audio content. They need captions for videos, transcripts for audio, and visual alternatives for audio notifications.

<!-- Accessible video with captions -->
<video controls>
  <source src="tutorial.mp4" type="video/mp4">
  <track kind="captions" src="tutorial.vtt" srclang="en" label="English">
</video>

One Deaf User's Experience

A deaf user visiting a security dashboard hears nothing. If a critical threat alert plays a sound, they miss it. Always pair audio alerts with visual indicators like flashing banners or text notifications.

Motor Disabilities

Types of Motor Disabilities

Motor disabilities include paralysis, amputation, arthritis, Parkinson's disease, repetitive strain injury, and temporary conditions like a broken arm.

How Motor Disability Users Navigate

Many motor disability users cannot use a mouse. They rely on keyboard-only navigation, voice control software like Dragon NaturallySpeaking, switch devices activated by a button or puff of air, or eye tracking hardware.

// Ensure all interactions work by keyboard
document.querySelectorAll('.interactive').forEach(el => {
  el.addEventListener('keydown', (e) => {
    if (e.key === 'Enter' || e.key === ' ') {
      e.preventDefault();
      activateElement(el);
    }
  });
});

Key Design Rules

All functionality must be available via keyboard. Touch targets must be at least 44 by 44 pixels. Timed interactions must be adjustable or removable.

Cognitive Disabilities

ADHD

Users with ADHD struggle with sustained attention and distraction. Design minimal interfaces, provide progress indicators, and allow task pausing.

Dyslexia

Dyslexia affects reading fluency. Use sans-serif fonts, adequate line spacing (1.5 minimum), bullet points instead of dense paragraphs, and support text-to-speech.

Autism Spectrum

Autistic users benefit from predictable navigation, literal language, no auto-playing media, and consistent page structure.

Memory Impairments

Users with memory impairments may forget steps in multi-stage processes. Provide clear progress indicators, auto-save, and undo functionality.

<!-- Progress indicator for multi-step forms -->
<nav aria-label="Progress">
  <ol style="list-style:none;display:flex;gap:1rem;">
    <li aria-current="step">1. Account</li>
    <li>2. Security</li>
    <li>3. Review</li>
  </ol>
</nav>

Common Mistakes

1. Designing Only for Visual Disabilities

Many accessibility resources focus on screen readers. Auditory, motor, and cognitive disabilities receive less attention but affect more users combined.

2. Using Color Alone to Convey Information

Red for errors, green for success — but what about color blind users? Always add text labels or icons.

3. Making Touch Targets Too Small

Links and buttons smaller than 44 by 44 pixels are difficult for users with motor disabilities to tap accurately.

4. Auto-Playing Media

Auto-playing video or audio disorients screen reader users, distracts users with ADHD, and overwhelms autistic users.

5. Using Complex Jargon

Security tools are especially prone to jargon. Replace heuristic analysis with behavior check and sandboxing with safe testing area.

6. No Keyboard Support

If a feature requires a mouse, users with motor disabilities cannot access it. Test every feature with Tab, Enter, and arrow keys.

7. Ignoring Motion Sensitivity

Parallax scrolling, animated backgrounds, and transitions can cause nausea and sensory overload. Support prefers-reduced-motion.

Practice Questions

1. What are the four main disability categories?

Visual, auditory, motor, and cognitive. Each has different needs and different assistive technologies.

2. What assistive technology do blind users rely on?

Screen readers like NVDA, JAWS, and VoiceOver that convert text to speech or braille.

3. Why should color alone not convey information?

About 8 percent of men have color blindness. Information conveyed only by color is invisible to them.

4. What is the minimum touch target size for accessibility?

44 by 44 CSS pixels for pointer targets is the WCAG recommendation.

5. Challenge: Choose one page on your website. Identify one design choice that could be problematic for each of the four disability types.

FAQ

Mini Project

Create a user persona for each of the four disability types. Include their name, age, assistive technology they use, and three frustrations they encounter on inaccessible websites.

What's Next

Learn about Assistive Technologies that people with disabilities use to access the web. Then explore The Business Case for a11y.