WebAIM - Web Accessibility In Mind

E-mail List Archives

using .svg images accessibly

for

From: Sandy Feldman
Date: Aug 3, 2017 8:03AM

hey all,

I would like to use .svg images accessibly. I have a test that looks
fine, but it breaks validation. It's based on

https://codepen.io/mambroz/pen/kBGsH

Each svg has a title and a description. The descriptions seem excessive
to me - surely the title, "FaceBook" is enough, and people don't need a
description saying "Link to Facebook"? Can I just delete these, or will
I be making trouble for someone?

The svgs are labelled by their titles <aria-labelledby="title"> . The w3
validator is saying this is done wrong, "attribute must point to an
element in the same document." The attribute is right there, on the next
line.

Total validator is saying "Link text is missing" on the svg images.

WAVE has marked each of the images as errors, but I can't tell what the
error is.

This is my first time using svg images and I need some help getting it
right!

thanks so much, Sandy