The Do’s and Don’ts of Writing Image Alt Tags

Virtually no website operates today without a pronounced visual element. Your brand, value proposition and overall identity are almost impossible to convey without strong, high-quality imagery.

“Web designers know how important it is to choose the right images. However, it’s just as important to use the correct alt text.”

Alt text performs an important function when it comes to user experience, and contributes to image SEO. In some cases, poorly written alt text can be as detrimental as providing no alt text at all, as it can lead to major confusion.

What is alt text? (alt attribute)

Alt text (or alternative text) is used within HTML code to describe the image or what it represents. The primary purpose of alt text is to describe visual elements to those who cannot see them; including sight-impaired users and users whose browsers or screen readers block images. Alt text is visible when an image is not able to load.

Google uses alt text in the same way visually impaired people do. A Google algorithm cannot “see” images, and it uses alt text to comprehend them. The alt text tells Google what the image is about, so it can serve it in image search results. Alt text also provides contextual relevance regarding the page where an image is found.

Image title

Some people may be confused about the difference between alt text and the image title text attribute. The image title is not used for search ranking but is used to provide additional information about the image. Simply use a short, catchy title that complements what you optimized for the alt text. Almost 1/3rd searches on Google are for images,so analyze the image titles and the keywords wisely.

Describe the image specifically

When writing alt text, it should be sufficiently descriptive;  if you close your eyes and someone reads it to you, you should be able to imagine a reasonably accurate description of the image.

“Take a photograph of a cake as an example. You could write <img src=”cake.png” alt=”cake”> .

However, writing <img src=”cake.png” alt=”chocolate cake with caramel icing”> is much better.”

Keep it short

Some popular screen readers cut off alt text at about 125 characters. It’s advisable to keep your description to around 100 characters maximum.

Long descriptions of small details, such as the following one of two dogs, are unnecessary:

<img src=”dogs.png” alt=black dog on the right and white dog on the left in a field of green grass with little yellow flowers”>.

A good description would be <img src=”rabbits.png” alt=black dog and white dog in field”>.

Don’t use “picture of” or “image of” because it’s redundant and wastes space.

Include a keyword or phrase

Leaving the interpretation of an image to the search engine crawlers in not advisable. Google can get it wrong, and you could miss out on a chance to rank for a keyword or end up ranking for the wrong keywords.

On-page keyword usage is still significant when it comes to ranking. When using alt text to describe the image, including a keyword or keyword phrase your targeting can work in your favor and signal to the search engine that your page is relevant to a specific search query.

Use your company name in logo image alt text

If you have a logo then alt text should repeat the company name that appears on your logo graphic. Rather than just writing “company logo” in alt text, mention the name of the company.

Don’t forget about buttons

If a form on your website uses an image as a submit button, you need to write alt text. You can describe the function of the button, such as ‘search,’ ‘sign up,’ apply now, etc.

Avoid keyword stuffing

Keyword stuffing is not as prevalent as it once was. However, there are those who still commit it, leading Google to release algorithm updates to combat the problem.

“Any gains that come from keyword stuffing are short lived. Focus on writing descriptive alt text and include a keyword if possible, rather than trying to insert as many keywords as you can.”

Here’s an example of the type of keyword stuffing that often occurred in the past – “yellow t-shirt, yellow shirt, yellow men’s shirt, yellow short-sleeved shirt, yellow men’s shirt, light yellow t-shirt, light yellow shirt, light yellow men’s shirt, light yellow short-sleeved shirt, light yellow short-sleeved men’s shirt”.

This use of keywords benefits your photo SEO if it is done smartly. Do not be tempted to name the image by its default name. Instead, select quality keywords. If you plan to republish your old content, analyze if new keywords are required or whether you need to change the image to a new one. If republished with new images, Old content can boost organic traffic by 111%, so take the image issue seriously.

Avoid meaningless alt text

Alt text’s purpose is to define meaning for viewers. Web developers are inclined to use alt text for image file names, sizes, etc. However, this is not their purpose. As it does nothing for readers, details like this should not be included in alt tags.

“Use bullets and simple icons in CSS where you don’t need alt text. However, if you have to have them in HTML, use a blank alt attribute. Putting an asterisk to represent a bullet can be more confusing than a blank.”

Avoid the use of images instead of text

Avoid using images in place of words; Google can’t see them, and if there’s no text, it must rely entirely on alt text to comprehend your intentions. A photograph may be more explicit than a thousand words; if it lacks alt text, it’s completely meaningless to Google.

If you have an HTML slideshow or a photo gallery, you can add alt text to these images too. However, if the images in the slideshow are purely for decorative purposes, you don’t need to worry about alt text. It’s unnecessary to provide the same information found within the content surrounding the image in the alt text.

Conclusion

Try to make using alt text standard practice for all images. It’s easy to implement and contributes to user experience and SEO over time. It may not have as much impact as other ranking factors, but it’s still worth the effort to write accurate, concise and meaningful alt text.

Cincopa Provides Mobile-Ready Video Player where a Single Embed Code Fits all Screen Sizes

Embed Fully Responsive Videos and Images that look great on any Device
Learn More

Boost your SEO effort with JSON-LD Embed Codes Automatically Included on Your Videos and Images

Improve Search Rankings and Increase Traffic
Start Now! It’s Free

Originally published on December 6th, 2018, updated on February 4th, 2021
The Blog

The Do’s and Don’ts of Writing Image Alt Tags

by Simi time to read: 4 min
0