Skip to main content

Welcome to our new website! The content and organization have been heavily redone and we want to hear from you! 
Submit feedback

Experience Accessibility Simulations

Walk in someone else's shoes to understand why accessibility matters.

🎮 Interactive learning

Understanding through experience

The best way to understand accessibility is to experience barriers firsthand. These simulations approximate—but can never fully replicate—what people with different disabilities experience daily.

⚠️ Important note

These simulations are educational tools, not perfect representations. Real experiences vary widely. Use these to build empathy and understanding, but always center the voices of people with disabilities themselves.

🎨 Color vision simulation

About 8% of men and 0.5% of women have some form of color vision deficiency. See how your content appears to them.

Sample content

Error: Required field
Success: Saved!
Info: New update
Warning: Check input

Chart showing Q1-Q4 performance

Legend: ■ Q1 ■ Q2 ■ Q3 ■ Q4

What did you notice?

  • Red and green become nearly identical in most color blindness types
  • Color-only indicators (like red=error) become meaningless
  • Charts using color-coding become unreadable

Solutions:

  • Use icons + text + color (not color alone)
  • Add patterns or labels to charts
  • Ensure sufficient contrast between adjacent colors
  • Test with color blindness simulators

👁️ Low vision simulation

About 12 million Americans over 40 have vision impairment beyond what glasses can correct. See how blur affects content perception.

Sample form

* Required fields

What did you notice?

  • Small text becomes unreadable
  • Low contrast elements disappear
  • Tunnel vision means missing content outside focus area
  • Form field boundaries become unclear

Solutions:

  • Use high contrast (4.5:1 minimum)
  • Support browser zoom up to 400%
  • Keep related content close together
  • Use clear visual boundaries

⌨️ Keyboard-only navigation challenge

Many users can't use a mouse due to motor impairments, tremors, or situational factors. Try navigating with keyboard only!

🎯 The Challenge

  1. Put your mouse aside (seriously, don't touch it!)
  2. Navigate to each button below using only Tab
  3. Activate each button using Enter or Space
  4. Notice which elements are easy or hard to reach

Interactive elements

Now try these problematic elements:

❌ Click me (div, not button)

Reset buttons

What did you experience?

  • The div "button" can't receive keyboard focus
  • Without focus indicator, you can't see where you are
  • Tab order should follow visual order

Key takeaways:

  • Use real <button> and <a> elements
  • Never remove focus outlines without replacement
  • Test every interactive element with keyboard

🔊 Screen reader simulation

Screen readers convert visual content to audio. Experience how your content sounds.

🎯 The Challenge

  1. Close your eyes (or look away from screen)
  2. Have someone read ONLY the text below—no descriptions of layout
  3. Try to understand the content and navigate the "page"

What a screen reader might announce:

"Heading level 1: Welcome"

"Image" [no alt text]

"Link: Click here"

"Link: Click here"

"Link: Click here"

"Button"

"Table with 5 columns and 10 rows"

"Edit text"

vs. Accessible version:

"Heading level 1: Welcome to University of Arizona Accessibility"

"Image: Students studying together in the library"

"Link: Accessibility training schedule"

"Link: Testing tools and resources"

"Link: Contact the accessibility office"

"Button: Submit registration form"

"Table: Course schedule with columns: Course, Day, Time, Location, Instructor"

"Edit text: Enter your email address, required"

Key differences:

  • Alt text describes images meaningfully
  • Link text describes destination (not "click here")
  • Button labels describe the action
  • Table captions explain what data the table contains
  • Form labels explain what to enter

🧠 Cognitive load simulation

Cognitive disabilities affect attention, memory, and processing. Experience content overload.

Simulation coming soon

Take it further: Real testing

Simulations build awareness, but real testing finds real issues:

🎯 Your next step

Try navigating your own website or application using only a keyboard. Spend just 5 minutes. You'll be amazed at what you discover.

Resources