Digital Accessibility Strategies by Eric Zirlinger

Apr 17, 2025

View transcript

Lecture Notes: Eric Zirlinger's Presentation on Digital Accessibility

Introduction

  • Presenter: Eric Zirlinger, Design Leader at Deque
  • Style: Energetic and uses body language
  • Focus: Practical approaches to digital accessibility
  • Goal: Equip designers with strategies for accessibility design issues
  • Audience: Beginners and experienced designers
    • Encourage community knowledge sharing

Key Points

Understanding Digital Accessibility

  • Accessibility is complex
  • WCAG: Web Content Accessibility Guidelines
    • Helpful but can feel overwhelming
  • Importance of simplifying complex concepts
    • Example: "Doors need handles" instead of complex legal jargon

Practical Approaches to Accessibility

  1. Color Contrast in Design

    • Definition: Difference in luminance or color making objects distinguishable
    • Importance: Helps users accomplish goals
    • Use of decision trees to understand WCAG color contrast
    • Simplified Approach:
      • Needed: 4.5:1 contrast
      • Helpful: 3:1 contrast
      • Not needed: No requirement
    • Examples: Buttons and donut charts

  2. Not Relying on Color to Convey Meaning

    • Never use color alone to communicate information
    • Use icons, patterns, or text labels as alternatives
    • Testing method: Apply the luminosity blend mode in design tools
    • Example with red, yellow, and green circles and mobile layout

  3. Reading Order

    • Definition: Sequence content is presented, especially important for screen readers
    • Importance: Assures content makes sense for assistive technology users
    • Approach:
      • Determine user goals
      • Document reading order, using arrows or numbers
      • Consider different breakpoints (desktop, tablet, mobile)
    • Example with a complex dashboard

  4. Writing Meaningful Link Text

    • Should convey destination without needing surrounding context
    • Avoid generic "Learn More"
    • Use a verb and noun (e.g., "Learn Digital Accessibility")
    • Ensure clarity especially when links open new tabs

Q&A Highlights

  • Breakpoints: Variations in content layout across devices
  • Color Contrast Simplification: Explained using zebra stripes analogy
  • Decorative vs. Meaningful Images: If removing an image affects understanding, it needs alt text
  • Aria Labels and Icons: Use ARIA for accessibility but ensure clarity for all users

Conclusion

  • Focus on practicality and user goals
  • Encourage interactive testing with real users
  • Community Involvement: Share experiences, ask questions

Post-Lecture Actions

  • Join community discussions on Discord
  • Share experiences on social media with hashtag #Axe-con

These notes capture the essential strategies and advice given by Eric Zirlinger regarding digital accessibility, emphasizing practical approaches designers can implement immediately in their work.

Full transcript