In the HTML document, Tag <img> is used to insert image. <img> tag has following syntax:
<img src=”indian_flag.jpg” alt=”Indian flag” title=”Indian flag” height=”300px” width=”600px”/>
<img> tag’s properties/attributes are:
- src – it defines the path (root domain’s path or complete URL) of the image, that we want to insert in the document.
- alt – defines the alternative text of the image.
- height – it defines the height of the image (we can set it either in pixels (px) or in percentage).
- width – it defines the width of the image (we can set it either in pixels (px) or in percentage).
- title – it defines the title of the image which displays on the webpage when we move the cursor on the image.
In this article, we are going to discuss Alt Text of the Image tag. As I wrote above “Alt” is a property/attribute of Image tag and it stands for “Alternative Text”.
What is Alt text of images?
If an image is not displaying on the webpage for any reason, the alternative text will display there, it provides information to the Reader that at this place there was an image related to “Alternative Text”.
There may following reasons for not displaying an image on the webpage
- Invalid path/URL
- Images are blocked to display through the firewall or local server.
- If an image is unable to load.
For any image that is going to be displayed on the webpage must contain the “Alt” text attribute, it will be easy to the reader to understand blocked/ unavailable image and it will directly impact to the SEO (Search Engine Optimization).
Note: “Alt” Text is also known as “Image description”.
Why is Image alt text important for SEO?
If for any reasons (listed above) image is not displaying on the webpage. Alt text display as an alternative text, the user can easily understand the purpose of the image.
Therefore, an alternative text should be there for image description or image identification to the Readers.
2. Ranking in the image searches
An alternative text is important for accessibility and transparency to the readers. Same as it’s most important for the SEO (consider it for image searches SEO).
If we want to crawl, index and rank the images in search engines, it is important that image tag must have an alternative text. Why?
Search engines crawl following things for an image tag
- Image name
- Alternative text
- Title text
All these three attributes must be defined to crawl, index and rank the image in search engines. Alt text is the first parameter that considered by the searched engines because it provides the description of the image. It is as important as the description of any webpage.
Therefore, an alternative text must be unique for the image, descriptive and it must contain the keywords in it on which you want to rank the image.
3.Traffic from the images
If any image is ranking in image searches, sometimes users click on the actual path/URL of the image.
The search engines like Google, Bing etc displays the actual URL of the webpage where the image is available on the right side, someone can click and visit the page.
See the below-given image…
At the right side, Google displays the Title of the webpage and the website name.
Therefore, the ranked image may generate traffic on your website. So, you must optimize the image by defining the all required attributes.
4) SEO impact on webpage
In a webpage, images are used for better user experience and to explain the things the better. But, images (Having optimized ‘img’ tag) are also impact to the webpage SEO, if we want to rank any webpage, we can put the keywords in it.
While optimizing a webpage for SEO purpose, you should not leave any parameter that can be helpful for the SEO.
How to decide the alt text of images?
Finally, it is cleared that an “img” tag must be optimized by defining everything related to it, and the most important factor is the image description which is directly crawled and considered by the search engines.
Now, How to decide a better alt text that can help in SEO?
Alt text is the description of the image and it is defined to provide a description of it. So, Image “alt text” must be descriptive, so that when the image is failed to load reader can identify the purpose of the image.
A non-descriptive text may confuse the reader as well as search engines and our purpose to get traffic, to rank in the image searches will not fulfill.
2. Unique, short and relevant
An alt text should be unique, short and relevant to the topic. It must not be very large, recommended maximum number of characters for an alt text is 125. So, try to keep it within the 125 characters.
Talking about the relevancy of the alt text, let’s understand by an example, let suppose if you are writing an article that contains the information about Indian flag and you are displaying an image of the Indian flag, and you write “flag image” as an alt text, it will not be relevant. The examples of relevant alt text are “Indian flag “, “Indian flag in HD format”, or “flag of India”, etc.
3. Targeted keywords
Targeted keywords are those words on which we want to rank the webpage or/and image, You must place a targeted keyword with the alt text, and you must be avoided keyword stuffing, do not use more keywords. One keyword (which can be a long tail keyword) is sufficient.
4. Avoid the words like “image of”, “picture of”
Alt text is an attribute to an image tag and search engines crawlers can assume that it’s an image, so there is no need to use “Image of”, “picture of” word with the alternative text. It should be very clear, short, with the keyword on which you want to rank the image/webpage.
5. Don’t avoid the small and frequently used images for logos, buttons etc
Sometimes, while using images in logos, headings, buttons, etc we forget to define its alternative text, it’s also important that you must define alt text for them.
Some of the examples that you can consider,
- For logo – “Marketing91 logo”, “logo of marketing91”
- For heading – You can give the short name for your heading, Note: if in the heading you are using an image from the CSS, there is no need to define alt text because we are not using it directly to the website.
- For button – let suppose, there is a submit button for registering a course and it is using an image, you can define alt text like “sign up for marketing course”, “marketing course registration”
Images can improve website’s readability, user experiences but an optimized image tag can help a lot in SEO, and it may improve search visitors.
Therefore, it is most important and should not be avoided that images must have their descriptions. You must define alt texts for all images that should be unique, short, and descriptive.