- What is an alt tag?
- Uses of alt tags
- Optimal alt text format
- Why are alt tags important?
- How do I write a good alt text?
- Keep it short
- Describe the images as precisely as possible
- Include your keywords
- Say no to keyword stuffing
- Don’t forget longdesc=""
- Don't use images as text
- Avoid including "picture of," "image of," etc. in your alt tag
- Don't neglect form buttons
- How to check if an image has an alt description?
An alt tag, also known as "alt description," "alt text," or "alt attribute," is an HTML attribute applied to image tags to describe the appearance and function of an image on a page.
Alt tags have many uses, including:
When added to photos, alt texts improve web accessibility, especially for visually impaired users. Such users will read the alt descriptions to understand on-page images better.
In the event images on your website fail to load, alt tags will display the info describing them.
By doing so, alt tags make it possible for search engine crawlers to index images properly.
The right format for an alt attribute is a sufficient description that doesn't contain spammy content or keywords. For the sake of ease, here are some examples of alt tags for an image of a delicious-looking stack of blueberry pancakes.
- <img src="pancakes.png" alt="Stack of blueberry pancakes with powdered sugar">
- <img src="pancakes.png" alt="pancakes">
It is ok to write your alternative text either way, but the first option is much better because it is more descriptive of what is in the image.
- <img src="pancakes.png" alt="pancake pancakes pan cake hotcakes hotcake breakfast food best breakfast top breakfasts breakfast recipes pancake recipe">
- <img src="pancakes.png" alt="">
What is wrong with the above two examples? Any guesses? Well, the first one demonstrates keyword stuffing. The second doesn't have any alt text (the quotes are empty). So, avoid implanting either of these two practices.
As mentioned earlier, alt text provides a way for visually impaired people to decipher what on-page images are all about. Besides, if your screen reader or browser is blocking images, you will understand what the image is all about by reading alt descriptions.
Alt texts are also good for SEO. While search engine recognition technology has advanced in recent years, search crawlers yet can't see images on your website as we do - that why it crucial to include the alt text. By having an alt description, you make it easier for them to rank for the right keywords.
Try to keep the description around 125 characters. Long descriptions won't give you an upper hand!
Give enough information and be cautious not to add unnecessary content or keywords so that even users who can't see them can understand what the image is about.
Alt tag offers you another opportunity to include those keywords you target on your page, making it easier for search engines to see your pages' relevance to particular search queries.
Google hate poorly added alt texts. In fact, you might be in trouble if Google notices you are using alt descriptions as an opportunity to stuff as many relevant keywords as you think. So, don't let that desire to include more keywords drive you.
Explore using the longdesc="" tag for more complex images that require a longer description.
Search engines can't read text within your images. Therefore, avoid using images in place of words. If you must do so, use alt text to explain your photos.
It is already assumed your alt description is referring to an image. So, there is no need to specify it.
Those form buttons on your website, such as the "submit" button, make sure to include an alt text if using images. Image buttons should have an alt description that describes the function of the button like "apply now," "search," "sign up," etc.
Do the following to check if you have added alt descriptions to all images on your website: Go through your content management system and scrutinize every image you included to see if it all has alt text. Note that this can be time-consuming, so you may be better off using a third-party app to go through your website to see if alt text exists on every image. Fortunately, there are many alt tag checkers on the market. Once you notice some images require alt text, instantly correct that.