Question 420863 in Html Question posted in
Some basic documentation can be found here.

Html – Do I need aria-hidden for a decorative <svg> within a <button>?

If I have a button:

<button>
    <svg width="1em" class="inline"><use href="#start-icon"></use></svg>
    Start
</button>

Will screen readers ignore <svg> (which is a desired behavior) or I should hide it (with aria-hidden, for instance)?

Tags:

2

Answers


  1. 0

    By default, screen readers will announce the <svg> content if it is accessible. So yeah, you should hide it using aria-hidden 🙂

    <svg width="1em" class="inline" aria-hidden="true"><use href="#start-icon"></use></svg>

    Login or Signup to reply.
  2. 0

    Screen readers will read SVG by default, so you’re right you should use aria-hidden="true" to hide it

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search