When you think of website image alt text, the first thing that often comes to mind is the SEO (search engine optimization) advantages it may provide. Having accurate alt text can help increase traffic from image searches and keep the “Google Gods” happy by improving usability across the board. However, alt text has an even more important job that you need to consider.
Alt Text supports web accessibility
Providing a great experience for everyone who uses your website should be a priority for your website design. Adding images can be a great addition to your site, and can add impactful representation of your content (ex: charts and infographics). But what about the users that have visual impairments and do not have the ability to see the images? Providing accessibility elements to non-text elements of your site is important and should never be ignored. Adding proper alt attributes for your visitors that cannot see your images will provide a great experience for all. Plus, even if you don’t consider accessibility for the sake of your users, you should at least be considering it to avoid a law suit.
So what exactly is Alt Text (Alt Attributes)?
Alt text stands for Alternative Text and it is used with your HTML to fully describe images on your site when they are not visible. Providing text that describes what is happening within the image is what we are looking to do. This allows accessibility tools like screen readers to properly relay the message for visitors that do not or cannot see the images displayed on web pages.
Incorrect Alt Attribute:
<img src=“small-business-banking-relationships.jpg” alt=“small business 400×400“>
Correct Alt Attribute:
<img src=“small-business-banking-relationships.jpg” alt=“Hands Holding Black Leather Wallet with Card and Ten Dollars Showing“>
This step seems simple but it is often forgotten or ignored by developers. Because alt attributes are a principle of web accessibility we need to take the time to make sure that this step is not skipped. Doing this might take some more effort from those developing the content for the site. Taking time to save your images with accurate descriptions helps developers when it comes time to implement the design.
You can find more specifics on Alt Attribute Guidelines to get a better understanding of how you should use them here. It is important to consider everyone when developing content for our websites to make sure all have a positive experience and are able to find what we’re looking for.
Wayne Hagerty is an Interactive Developer at RDW with years of experience in WordPress site development, Mobile App Development as well as other aspects interactive development services. He also believes that every Patriots football game day should be a national holiday.