Ultimate Guide to Alt Attribute (or Alt Text)

alt text seoptimer guide

Table of contents

 

Definition

Alternative text, “alt attribute” or “alt text” is an HTML attribute that describes an image as a text. Alt attributes are not seen by users but by search engines to help define what that image is about.

 

Why is the alt attribute important?

 

Alt attribute text is also used by screen readers to convey information while image titles cannot be displayed by screen readers. It helps display text in case an image cannot be rendered by the browser.

 

A picture is worth a thousand words. However, images without the alt attribute become irrelevant to search engines since it is used by their image recognition software to identify what that image is about.

 

If search engines don’t know what’s in an image, there’s no way for them to tell how it relates to the page content. They also won’t be able to figure out if it’s relevant to an image search query. With machine learning and A.I., search engines are getting closer to identifying what an image is supposed to be, understand actions, and identify objects within images. Yet, images explained by the actual owner allows technology to process the information faster.

 

Fortunately, there’s a relatively simple way to solve this problem to improve your SEO and user experience: image alternative text. By providing alt text, you are helping search engines identify and categorize the images to provide users with relevant information.

 

Difference between image alt text and image title

 

Alt text is the HTML alt attribute and it gives more information about the image. Image title is displayed as a popup when you hover your mouse on an image. If the image fails to render, the alt text is provided, but not the image title.

 

Best Practices: How to write an alt text

 

Images are content, which requires them to be high-quality, attractive, and engaging;  alt text requires the same level of quality. To learn how to write the best alt text for your images, here are some guidelines:

Be descriptive

An image description can include nouns, verbs, adjectives, and adverbs. Description of what is happening in the image, or what has happened, or what is going to happen must be written so that search engines can process that information effectively.

  • Enable the user to visualize the image if and when an image fails to load
  • No more than 1 or 2 sentences
  • Avoid using phrases such as “graphics of” or “image of” and unnecessary information that can lengthen the text.

Avoid keyword stuffing

You’ll need the same amount of dedication in creating rich information for users to identify your images as you do with title tags and meta descriptions.

 

Below are some example guidelines to help you identify what search engines are looking for in alt text:

 

  • Bad (missing alt text): <img src=”puppy.jpg” alt=””/>
  • Bad (keyword stuffing): <img src=”puppy.jpg” alt=”puppy dog baby dog pup pups puppies doggies pups litter puppies dog retriever  labrador wolfhound setter pointer puppy jack russell terrier puppies dog food cheap dogfood puppy food”/>
  • Better: <img src=”puppy.jpg” alt=”puppy”/>
  • Best: <img src=”puppy.jpg” alt=”Dalmatian puppy playing fetch”/>

 

How to add alt attribute in WordPress

 

There are three ways to add alt text in WordPress.

 

  • If you are uploading an image directly onto the page itself:
  • You can edit the image by clicking on the image and select the Pencil icon.

An image which displays where the edit button is located so that you can write your Alt Text

An image highlighting the Alternative Text box in Image Details

 

  • Go to Library and select the image you want to add the alt text to.

on wordpress where to find your images uploaded to make changes for alt text

An image highlighting the Alt Text Box withing a selected image

 

How to add alt attribute in Wix

 

You can add alt text images once you’ve added the image to the page. If you’ve already added the image, you can click the Gear icon.

where in wix to find alt text option

 

Highlight the image, then click the first option on the right side named Title (Alt text), where you can add your description.


 

How to add alt text in Shopify

 

Shopify does have a media library located in Settings Files. However, you won’t be able to add alt text to your images from here. There are three places where you can edit your image descriptions.

 

If the uploaded images are product images, you can click on the “ALT” feature located on the bottom of each image.

An Image showing that If the uploaded images are product images, you can click on the “ALT” feature located on the bottom of each image.

 

Or, add your alt text directly onto the image here:

how to add alt text on images in shopify site

 

If you’re creating an actual page with the image added to your page, there’s a three-step process to adding alt text. You’ll need to click the image icon to upload an image, then click on the actual image, and then click on the image icon again.

An image of how to add Alt text explanation of how to click on an image and then on image icon

 

You can also add your alt text to the image URL:

An image showing how you can add Alt Text to an image URL

 

Featured images are important to identify on each page, collection or post. Once you’ve added an image, you’ll need to click on Update to be able to add your alt text for that specific image.

An image showing you what to click when you want to select a featured image for Alt Text

An image showing where to enter your description of a featured image for Alt Text

 

If you’ve already uploaded hundreds or thousands of images, the best way to implement alt text to all images is to either go to each product individually, or possibly download a plugin. As an e-commerce, most alt text has to do with products, specifics, and types. These plugins can help you add the main description, however, you should focus on providing high-quality descriptions and avoid streamlining and automating alt text.

 

Some plugins that can help you expedite your alt text needs

Lion App

lions app on shopify can help with alt text image attributes

 

This Lion Apps plugin won’t help you add descriptive alt text to your images, but it does allow you to add Product Title, Type and Vender to your images to describe a product.

An image of the Lions App plug-in where you can add Product Title, Type and Vendor

 

SEO All in one

SEO all in one app in shopify

 

The Softpulse Infotech SEO All in One app provides another variable for you to choose from. “Variant title” allows you to add more than one variant of the product, such as color, size, and style to your alt text descriptions.

 

An Image of the The SEO All in One which its inputs of color, size, and style to your alt text descriptions for Alt Text.

 

SEO Image Optimizer by Booster Apps

SEO Image Optimizer Shopify

 

SEO Image Optimizer by Booster Apps is the most popular plugin, since many Shopify users use their apps. However, all are created equal and do the same things for alt text.

An Image of SEO Image Optimizer by Booster Apps

user-gravatar
Jay Kang

Putting all things SEO under a microscope. I'm an experimentalist, researcher, recording every step of how to rank number 1. Here to help, verify, explain, cross-examine the wonders of search engine.





SEOptimer Report Preview

SEOptimer - SEO Audit & Reporting Tool.
Improve Your Website. Win More Customers.

Get a Free Website Audit Instantly