Accessible Charts Done Right: Myth or Reality

on YouTube ↗34m

" summary

Accessible charts are possible and practical: use SVG with explicit roles and concise descriptions, add per-markup focusability via tabindex="0" and announce elements with aria-describedby, or hide a parallel data table with the visually-hidden pattern and proper scope headers so screen readers read rows reliably. Add a skip link to jump over dense charts, offer CSV/XLS downloads, and test with VoiceOver on Chrome. For heavy pages consider server-rendering charts to HTML strings to avoid shipping large D3 bundles and long load times.

AI-written summary · about

" chapters (6)

1. 0:00Start
2. 2:29TOP 10
3. 26:04TIPS
4. 27:16RECAP
5. 28:42SCREEN READER
6. 29:26CHARTS

" related talks

• 35mAccessible Charts Done RightSergei Kriger · FrontEnd Con 2018
• 41mAccessible Charts Done RightSergei Kriger · Inclusive Design 24 (#id24) 2018
• 24mAccessible charts done rightSergei Kriger · WebCamp Zagreb 2018
• 01h 02mDeveloping Accessible ChartsSergey Kriger · HolyJS 2018 Moscow
• 48mAccessibility in Data VisualizationSARAH L. FOSSHEIM · SmashingConf Freiburg 2024
• 50mAddressing the Core Issue of Data Visualization AccessibilityThomas Watkins · ConveyUX 2023
• 38mAccessibility in Data Visualizations: Two Case StudiesCaterina Amato, Ilenia Baronio · Accessibility Days 2023
• 21mMusical Charts: Using OSS to Make Data Visualizations Accessible to Visually Impaired UsersJulianna Langston · Open Source in Finance Forum New York 2022