Accessible Smart SVGs for the Digitally-Inclusive Age
- Date & Time
Wednesday, March 15, 2023 - 4:20 PM PST
Part 1: SVGs and the Future of Digital Graphics (Heather)
SVGs are responsive and adaptive designs. For internet users with low vision or other impairments who rely on WCAG SC 1.4.8, SVGs offer a superior experience over JPEGs and PNGs. Part 1 of this session introduces how SVGs work with assistive technologies and scale beautifully, responding to dark mode, contrast themes, and screen sizes. SVGs are made from code, work in EPUB/native apps, load instantly (saving energy), and include descriptions, metadata, animation, and interactive features such as audio.
Part 2: How to Write Artistic Alt Text for SVGs (Caroline)
We hear the same alt text tips again and again - keep it short, be specific, don’t interpret. Many of these tips don’t fit with describing works of art. Crafting artistic “text alternatives” often means breaking rules. Part 2 explores how to write for the ears and imagination and deliver alt text users can feel and experience. Learn to take SVG alt text from basic to beautiful with a humanistic approach that breaks down the visual barriers to digital art.
Part 3: Advantages of Accessible SVGs (Paul)
An SVG placed directly in a webpage’s HTML code has more accessibility options than raster images which only have alt-text. SVGs have title and description elements and screen reader-friendly semantic HTML embedded directly in the file. Part 3 explains how to combine these elements with ARIA roles and attributes to expand the accessibility of smart SVGs.
- Information & Communications Technology
- Entertainment & Recreation
- Media & Publishing
- Research & Development
- Audience Level
- Session Summary (Abstract)
Make websites, marketing materials, and digital graphics more accessible with smart SVGs and human-crafted alt text. Smart SVGs are WCAG AAA shape-shifting files that change in size, layout, and color to help users tailor their digital experience.
- Primary Topic
- Secondary Topics
- Blind/Low Vision
- Emerging Technologies
- Session Type
- Caroline Desrosiers
- Heather Neff
Add to Outlook/iCal (How it works)
Back to Session List