Imagine you’re a resident who is blind, trying to navigate your city’s website using a screen reader. You come across an image of your city council members. The screen reader announces, “Image.” But what image? Is it a group photo? Individual headshots? A picture of the council chamber? Without alt text, this image is meaningless to you and a barrier to accessing important information.
In our previous posts, we’ve discussed website accessibility for local governments, focusing on topics like color contrast and text hierarchy. Today, we’re diving into another crucial element: alt text. Don’t worry if you’re not tech-savvy – we’ll break it down in simple terms and provide practical tips for making your images accessible to everyone.
What is Alt Text?
Alt text, short for “alternative text,” is a written description of an image that’s invisible to most website visitors. It’s embedded in the image’s HTML code and is read aloud by screen readers, assistive technologies used by people who are blind or visually impaired. Alt text also appears if an image fails to load, providing context for all users.
Not all images require the same type of alt text. There are three main categories:
- Informative Images: These convey essential information that is not present elsewhere on the page. They require detailed, descriptive alt text. (e.g., a chart illustrating crime statistics)
- Decorative Images: These are purely visual elements that add to the aesthetic of the page but don’t convey any meaningful information. These can have null alt text (alt=””) or a very brief description. (e.g., a background pattern)
- Complex Images: These contain a lot of information, such as charts, graphs, or maps. These require a longer description that summarizes the key takeaways.
Why Alt Text Matters for Local Governments
Alt text isn’t just a nice-to-have feature; it’s essential for making your website accessible to everyone. The Americans with Disabilities Act (ADA) requires that government websites be accessible to people with disabilities, and alt text is a key component of that.
But beyond legal compliance, alt text offers several benefits:
- Improved SEO: Search engines use alt text to understand the content of images, which can help your website rank higher in search results.
- Enhanced User Experience: Alt text provides context for users with slow internet connections or those who have disabled images in their browsers. It also helps users understand the purpose of an image if it fails to load.
How to Write Effective Alt Text
If you’ve been persuaded of the importance of alt text, how do you then create strong alt text for your website? Writing good alt text is both an art and a science. Here are some tips:
- Be Specific and Descriptive: Describe the image in detail, including its subject matter, any text within the image, and its purpose or function on the page.
- Keep it Concise: Explain the image and its function as succinctly as possible.
- Use Keywords Strategically: Include relevant keywords that accurately describe the image, but don’t overdo it. Prioritize clarity and accuracy and avoid keyword stuffing, shoving as many keywords into the alt text as possible, wether they fit or not.
- Avoid Redundancy: Don’t repeat information that’s already present in the surrounding text.
- Tailor to the Image Type:
- Photographs: Describe the people, objects, and actions in the photo.
- Infographics: Summarize the key takeaways.
- Charts and Graphs: Describe the data and trends represented.
- Maps: Explain the location, landmarks, and any relevant information depicted.
Common Mistakes to Avoid
Writing alt text that will be a help to your users and a boost to your SEO isn’t hard, but there are some common pitfalls you’ll want to keep an eye out for.
- Leaving Alt Text Blank: This is a major accessibility issue and should be avoided at all costs.
- Using Generic Phrases: Phrases like “image of” or “picture of” don’t provide any useful information.
- Keyword Stuffing: Overloading alt text with keywords can make it difficult to understand and is bad for SEO.
- Writing Overly Long Descriptions: Keep it concise and focus on the essential information.
Conclusion
Alt text is a simple yet powerful tool for making your city website more accessible and inclusive. By following these best practices, you can ensure that all of your residents, regardless of ability, can access and engage with your online content.
At Starry Eyes Media, we specialize in creating accessible websites for local governments. Contact us today for a free consultation and audit of your website to ensure it’s meeting the needs of all your residents.
Don’t forget to check out our other articles in this series on website accessibility for local governments:
