Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SVG icons need alternative text #10

Open
aardrian opened this issue Jun 2, 2016 · 1 comment
Open

SVG icons need alternative text #10

aardrian opened this issue Jun 2, 2016 · 1 comment

Comments

@aardrian
Copy link

aardrian commented Jun 2, 2016

This is not related to the missing alt attribute. I raise that in issue #8 and should still be added to the <img> in the SVG version.

This relates to the SVG files themselves missing alternative text. For example, if you look at the source of the Twitter SVG, it has no alternative text.

Suggest modifying each of the SVG files to have a <title> and <desc> element. So the SVG would open like this:

<svg height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" aria-describedby="desc">
    <title id="title">Twitter</title>
    <desc id="desc">The Twitter share icon.</desc>
    <rect …/><path …/>
</svg>

You can find more context and tips in the article Tips for Creating Accessible SVG, though some may not apply as your code references SVG via the <img> element.

@stefanbohacek
Copy link
Owner

@aardrian Hmm, I didn't actually create the SVGs, so I wonder if I should contact the original author(s) and use their modified files.

I am going to keep this issue open for now while I think about this a bit more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants