Describler allows you to make your SVG images accessible and reusable. It shows you all of the text content of your SVG in an editable list, including both visible text and metadata, and makes it easy for you to add descriptive content, or change the text that's already there. And you can use the “audio preview” feature to hear how your SVG sounds in common screenreaders.
Describler also makes your SVG auto-scaling by default, rather than a fixed size; this allows you to use your SVG at whatever size you need, or to change the size dynamically, and it allows users to zoom and pan easily.
What is SVG?
SVG stands for Scalable Vector Graphics, and it is a vector-based format, that can be created in popular drawing tools like Inkscape and Adobe Illustrator. Because each shape is made up of one or more markup elements, and the document has a DOM like HTML, it can be styled with CSS, and made interactive or animated with JavaScript.
Like HTML, the text in SVG is simply text, and so screenreaders can read it. In addition to the visible text elements, lik <text>, <tspan>, and <textPath> elements, SVG has special metadata elements, <title> and <desc>, which allow you to annotate your shapes for mouseover tooltips and special screenreader descriptions.
How do I use Describler?
-
Upload your SVG file. Click on the orange button with the up-arrow icon, and select an SVG file.
- .
Describler is meant to add accessibility to SVG images, not to interactive SVG applications or GUIs; use ARIA markup for that.