Dirk Ginader
Preventing Accessibility Issues Instead Of Fixing Them
#1about 3 minutes
The business case for shifting accessibility left
Investing one hour in UX for accessibility pre-launch can save four hours of engineering time post-launch.
#2about 3 minutes
Understanding the social model and spectrum of disability
Disability is a mismatch between an individual's needs and a product's design, which can be permanent, temporary, or situational.
#3about 7 minutes
Defining page structure with landmarks and headings
Use landmarks for broad page sections and a logical heading hierarchy to create a navigable content structure for all users.
#4about 5 minutes
Defining interaction flow and keyboard navigation patterns
Document exceptions to the natural reading order and use a combination of tab and arrow keys for navigating complex component groups.
#5about 3 minutes
Creating clear labels and roles for interactive elements
Write concise, action-oriented labels that describe function without repeating the element's role, and use the correct element for the job.
#6about 8 minutes
Using Figma plugins to automate accessibility checks
Leverage Figma plugins like eBay's "Include" to annotate landmarks, check color contrast, and simulate various forms of color blindness.
#7about 3 minutes
Ensuring proper touch target sizes and text scaling
Design interactive elements with a minimum touch target of 48x48 pixels and ensure the UI remains functional when text is scaled to 200%.
#8about 3 minutes
Collaborating on accessibility and finding resources
Effective accessibility requires close collaboration between designers, engineers, and writers, supported by external resources and user testing programs.
#9about 19 minutes
Q&A on practical accessibility challenges
The discussion covers topics like accessible floating action buttons, disabled button states, and debugging inconsistencies across different browsers and screen readers.
Related jobs
Jobs that call for the skills explored in this talk.
Matching moments
33:42 MIN
Why you should integrate accessibility early
Going on a CODE100 Accessibility Scavenger Hunt
02:43 MIN
Introducing the shift left approach to accessibility
Shift Left On Accessibility - Geri Reid
22:46 MIN
Making accessibility a core part of your development process
Oh S***! There's a New Accessibility Law and I'm Not Ready!
1:07:26 MIN
Final advice for integrating accessibility into your workflow
WeAreDevelopers LIVE - Gaps in CSS, EU Accessibility Act and more!
14:55 MIN
Addressing the accessibility gap in modern design tools
AI and Accessibility: The Good and the Bad - Fireside Chat
27:17 MIN
The importance of web accessibility as a core developer craft
WAD Live 22/01/2025: Exploring AI, Web Development, and Accessibility in Tech with Stefan Judis
1:05:25 MIN
Final advice on making accessibility a priority
WeAreDeveloper Live: Accessibility in the EU, CSS Gaps and forms with Emma Dawson
07:09 MIN
Fostering an accessibility-first culture in organizations
WeAreDevelopers LIVE - Should We Respect LLMs? Is Rust Taking Over? Developers as Content Creators and more
Featured Partners
Related Videos
Shift Left On Accessibility - Geri Reid
Geri Reid
Data Mining Accessibility
Karl Groves
Going on a CODE100 Accessibility Scavenger Hunt
Chris Heilmann & Daniel Cranney
Accessibility in React Application
Julia Undeutsch
Accessibility powered by AI
Ramona Domen
Oh S***! There's a New Accessibility Law and I'm Not Ready!
Emma Dawson
The What, Why, Who and How of accessibility on the web
Konstantin Tieber
WeAreDevelopers LIVE - Can AI save Accessibility?; Horrid HTML; The Frontend Treadmill and more
Chris Heilmann & Daniel Cranney & Dirk Ginader
Related Articles
View all articles



From learning to earning
Jobs that call for the skills explored in this talk.

Accessibility Spezialist - Inclusive Design & Digital Accessibility
Deloitte
Senior
HTML
JIRA
Figma
Confluence
Adobe InDesign

Accessibility Frontend Developer
Department for Work and Pensions (DWP)
Sheffield, United Kingdom
€44-50K






Experte für digitale Barrierefreiheit und UX-Design
Sparkassen-Finanzportal GmbH
Senior
JIRA
Figma
Confluence
