- Published on
What is `role="img"` in an SVG tag?
- Authors
- Name
- hwahyeon
SVG elements can have various role
values. To explicitly indicate that an SVG is an image and make it recognizable to assistive technologies, use role="img"
. You can further improve accessibility by adding attributes like aria-label
or title
to describe the image's purpose for users relying on assistive tools.
If the SVG is purely decorative and does not convey information, it's better to use aria-hidden="true"
instead of adding aria-label
or title
. This ensures that screen readers ignore the element and its child elements, avoiding unnecessary information for users.