Accessible Hotspot: All About Micro Alt Tags
Micro alt tags are part of what makes the Hotspot element accessible. These simple text labels are applied to individual segments of an image. As a result, screen reader users will receive text descriptions as they navigate through these individual segments, allowing them to understand the full context of the image.
What’s the difference between a micro alt tag and a general alt tag?
When you embed an image for a Hotspot, you must give that entire image an alt tag. We’ll call this a “general alt tag.”
This is a text description of the overall image. The purpose of a general alt tag is to help learners get their bearing of the entire image. For example, an alt tag for a diagram of the Earth’s interior may be as simple as “Diagram of the Earth’s interior.”
A diagram of the Earth's interior. A general alt tag gives limited description of the image.
This is a suitable label for the entire diagram, but what if you wanted to focus on specific parts, such as the Earth’s inner core? This is where micro alt tags come in. In a Hotspot element, micro alt tags are used to describe individual parts of a larger image. You can either write these for each of the selectable Hotspot areas or make your image fully accessible and write one for each individual section of the image. In the fully accessible mode, you will overlay the image with a grid and create a micro alt tag for each cell.
This image shows the Creator+ interface when writing micro alt tags. It allows a more precise description of the image.
Are micro alt tags the same as Hotspot content?
Micro alt tags are different from Hotspot content, which is what a user will access when they click into a Hotspot area. Micro alt tags are only read by screen readers and act to textually describe the visuals of the images. Hotspot contents are viewable by screen reader users and non-screen reader users. Hotspot content is used to teach or reinforce information about the image.
How to write micro alt tags
Micro alt tags should follow similar standards for general alt tags. Keep things as concise as you can while accurately describing the information in the image. Use proper grammar and stick to under 100 characters if possible.
Remember that micro alt tags will describe only a portion of an image, so you should only describe information for that portion. You could treat this portion as a separate image and just describe what is in that cell.
Do you have specific questions about micro alt tags or setting up a Hotspot? Reach out in the comment section below.
Image source:
Comments
-
The addition of micro-alt tags is a really cool and novel approach to make Hot Spots all the more accessible! It makes highly visual content more meaningful and digestible through more granular navigation and allows for deeper communication between text and imagery. Super cool!
