Accessible Graphics on the Web

Are your graphics accessible to all audiences? This presentation introduces key concepts and methods behind accessibility. It focuses on SVG on the web, but many ideas have broader applications, to the graphics you create and the tools you create them with.

The talk will address the following questions:
– What does it mean for content to be accessible? Using the Web Content Accessibility Guidelines (WCAG) standards, we ask: is it perceivable, operable, understandable, and robust?
– How can graphics be accessible? It depends on their purpose: What information should they communicate? How should they be interactive?
– How does SVG support accessibility? It features structured content, readable text, interactive links, and alternative text.
– How can accessible graphics be improved? Web accessibility tools now support advanced interaction and document navigation using ARIA (Accessible Rich Internet Applications) attributes, but ARIA 1 did not emphasize graphics.
– What is being done now? The W3C’s SVG Accessibility Task Force is helping integrate ARIA and SVG, and providing guidance on best practices.
– How will this impact non-SVG graphics? Annotated markup can be used in hidden fallback content for HTML Canvas graphics, and could be integrated in other XML-based vector graphics and charts.

Amelia Bellamy-Royds

Amelia Bellamy-Royds is an invited expert member of the W3C's SVG Working Group, active in the SVG Accessibility Task Force. She is the co-author of SVG Essentials, 2nd Edition (with J. David Eisenberg) and the forthcoming Using SVG with CSS3 and HTML5 (with Kurt Cagle). More broadly, Amelia is a freelance writer specializing in scientific and technical communication, with a particular interest in data visualization. She has a B.Sc. in Bioinformatics, a Master's in Journalism, and an unending desire to discover new things. Online, you can find her as AmeliaBR on Codepen, Stack Exchange, Github, or Web Platform Docs. Offline, she lives in Edmonton, Alberta, Canada.