Alt text describes images for screen reader users, while descriptive labels explain the purpose of interactive elements like buttons and links. Keep alt text concise and specific, avoid keyword stuffing, and ensure labels clearly state what action users will take. Both are essential for making your website accessible to visually impaired users.
Alt text is descriptive text that conveys the meaning and context of images for screen reader users. When done well, it dramatically improves user experience for people with visual disabilities.
Keep it concise and unambiguous, usually a sentence or two, often just a few thoughtfully selected words. Consider what's important about the image: the setting, emotions on faces, colours, or relative sizes.
For example: "Frothy cappuccino in a white cup" rather than "Image of coffee."
Don't repeat surrounding text or use phrases like "a graphic of" or "an image of." These add no value for screen reader users.
Don't use file names, duplicate text, or URLs as alt text
Don't use generic descriptions for interactive elements like "Click here," "Download," or "Read more." Instead, be specific about what action the user is taking
Don't stuff keywords into your alt text for SEO purposes. Alt text is for accessibility, not search rankings
Don't write overly long descriptions. If an image requires extensive explanation, consider providing the detailed information in the main content instead and keep the alt text as a summary
For images and photos, describe the content and purpose briefly.
For charts and diagrams, convey the insight. Rather than "A bar chart showing sales over time," try "A bar chart showing sales over time. In July, sales for brand A surpassed sales for brand B and kept increasing throughout the year."
For tables, write clear, descriptive alt text that explains what information the table contains.
For videos, describe the visual experience if the content isn't explained through audio.
Decorative objects that add visual interest but aren't informative (like stylistic borders) should be marked as decorative. This tells screen readers to skip them so users know they're not missing important information.
If you're using automatic alt text generators, always review and edit the output. Remove generic comments like "Description generated with high confidence" and ensure the description is accurate and useful.
Partnering with agencies like us can help to cover all bases from an accessibility point of view. We partner with AudioEye to assess websites, identify accessibility issues through AI, tech and real user testing and help implement solutions that meet WCAG standards, all while keeping your branding and design intact.
Let’s chat about how we can help you take your first steps towards digital accessibility.
Proud to partner with
