What is alt text?
Alt text — short for alternative text — is a brief and descriptive text associated with an image on a web page. It serves several important purposes, primarily related to accessibility and user experience. By setting alt text for images, website owners can help visitors using screen readers understand the context of images on the page.
More about alt text
The main functions of alt text include:
- Accessibility: Alt text is crucial for individuals who use screen readers or other assistive technologies. When a screen reader encounters an image, it reads aloud the alt text, providing a textual description of the image content. This allows people with visual impairments to understand and engage with the content.
- SEO (Search Engine Optimization): Search engines use alt text to understand the content of images. Including relevant and descriptive alt text can improve the search engine visibility of your web page and contribute to better rankings in search results.
- Broken Image Replacement: If an image fails to load for some reason, the alt text is displayed in its place. This ensures that users still receive information about the intended content even if the visual element is unavailable.
When adding alt text, it’s important to keep it concise, descriptive, and relevant to the image’s purpose.
If an image is purely decorative and doesn’t convey meaningful information, it’s often best to use empty or null alt text (alt=””) to indicate to screen readers that the image can be ignored.
Adding alt text to images on Shopify
To add alt text to images on your Shopify website, follow these steps:
- Log in to Your Shopify Admin:
- Go to the Shopify login page and log in to your admin account.
- Navigate to Products:
- In the Shopify admin, click on the “Products” tab.
- Select the Product:
- Choose the product for which you want to add or edit images.
- Upload or Edit Images:
- If you are adding new images, click on the “Images” section within the product page, and then click on “Add images.” If you are editing existing images, click on the image you want to edit.
- Add Alt Text:
- For each image, you should see a field labeled “Alt text.” Enter a descriptive and concise text that describes the content of the image. This text will be read by screen readers and is also used for SEO.
- Save Changes:
- After adding or editing the alt text, be sure to save your changes. Look for a “Save” or “Save changes” button, usually located at the top or bottom of the product page.
- Preview the Changes:
- You can preview your changes by navigating to the storefront and checking the product page. Inspect the images to ensure the alt text is displaying as expected.
Adding alt text to images on Amazon
If you’re an Amazon seller enrolled in Brand Registry, you can make use of A+ Content. Within which you can set alt text for images.
- Log in to Your Amazon Seller Central Account:
- Go to the Amazon Seller Central website and log in to your seller account.
- Navigate to A+ Content Manager:
- In the “Advertising” menu, look for the “A+ Content Manager” option and click on it.
- Choose a Product:
- Select the product for which you want to create or edit A+ Content.
- Select a Module:
- A+ Content is created using different modules (text and image blocks). Choose a module type based on the content you want to add, or select an existing image-based module.
- Add Alt Text:
- Hover over the image you have added, then click the ‘Edit’ button and add your alt text to the ‘Image keywords’ box, then save your changes.
- Submit for Review:
- Once you are satisfied with the A+ Content, submit it for review. Amazon will review the content to ensure it meets their guidelines.
- Monitor Performance:
- After your A+ Content is live, monitor its performance through Amazon’s reporting tools to see how it affects customer engagement and sales.
While the temptation may be to add as many keywords into the alt text boxes as possible, remember the primary purpose of alt text is accessibility.
Try to describe the image for what it is, but be smart about also using relevant keywords in doing so.
Adding alt text to images with other platforms
Whatever platform your eCommerce brand is using, it should provide a simple way to add alt text to images.
If for some reason is doesn’t, here is an example of code you can use to apply alt text to an individual image:
<img src="image.jpg" alt="A cat playing with a ball of yarn">
In this example, the alt text “A cat playing with a ball of yarn” provides a descriptive representation of the image.