"Alternative text", or alt text, is a text-based description added for an image on the web. It helps describe what the image is about and has many benefits for both your store and your visitors, which we'll explore in this post.
Using well written and descriptive alt text for your images makes it easier for people with visual impairments to navigate non-text content on your site.
When using assistive technology, like a screen reader, the alt text is read out loud to the user, giving them a clear understanding of what the image is depicting.
(all the images in this post have alt text added to them! Check it out!)
2. Search Engine Optimization (SEO)
Alt tags are also extremely valuable when it comes to SEO and how your Shopify store ranks in search engines like Google. When the search engine crawls the content on your site, alt text helps identify relevant content related to the search and provide accurate results.
While we're on the topic, DON'T keyword stuff (using alt text to cram as many relevant keywords as you can think of into it). This will end up working against you and will hinder anyone using assisted technology from properly interacting with your site.
Let's take a look at two examples and how to best use alt text in your photos (we'll use our dogs because dogs make everything better):
Okay: <img src="lewis.png" alt="Black dog">
Better: <img src="lewis.png" alt="Black dog sleeping">
Best: <img src="lewis.png" alt="Black dog sleeping on grey couch in the sun">
Okay: <img src="scout.png" alt="Happy dog">
Better: <img src="scout.png" alt="Happy dog at the park">
Best: <img src="scout.png" alt="White, brown, and black dog at the park with his tongue out">
When an image fails to load for any reason, the browser will show a broken image and the alt text will load to still be able to get an idea of what the page is about. Images may not load for multiple reasons, so ensuring your images always have alt text is kind for ensuring your users can read and understand your content in all technological situations.
4. Social Media
Did you know that most of the social media platforms you use give you the ability to add alt text?
Facebook, Instagram & Twitter all provide the ability to add alt text to your images and you should. For example on Twitter if an image *has* alt text on Twitter it will indicate that...
Taking the extra moments to ensure that your images have proper alt text to them helps out users who are searching for your content and helps the social media platforms surface your content easier.
Alt Text - Further Reading
Shopify has a wonderful considerations when writing alt text article, Content King has a great guide on Image SEO that includes a lot on alt text, and of course Mozilla has a great authoritative piece on the semantics and accessibility of alt text that's a really worthwhile read.