Alt attributes are designed to display alternate text if the website cannot display the image or if users are visually impaired.
Alt tags are placed within the code surrounding an image and are typically only seen when an image cannot load or read by text-to-speech programs.
Using these tags is vital for visually impaired people, as it helps them better understand the content on your site they cannot see.
Search engines can also use alt tags to get a better understanding of the content within an image. Alt attributes are essential to SEO as search engines place more emphasis on the content they contain.
How to see alt tags
When looking at code, alt attribute syntax is:
<img src=”img.png” alt=”text” / >
When viewing a website’s code, the alt tag may appear as:
<img src=”http://www.calibrenine.com.au/img/seo-optimisation.jpg” alt=”Infographic” />
From this example, you would see the alt attribute reading the infographic explaining SEO optimisation.
If your site uses abstract or decorative images and provides no context for the content on the page, there is a code that allows you to skip using alt tags.
<img src=”image.png” alt=”” />
Providing this description accurately describes the content found in the image, the tag offers very helpful information for search engines to see.
SEO benefits for alt tags are significant in visual-based industries. Retail-oriented websites, for instance, make sure that all product images include alt tags that list the products’ style and colour.
Search engines such as Google will index images alongside other content from the page, with the image increasing the page relevance, referring to search terms for the style or colour found in the product.
Alt attributes can also impact if and how images will appear in Google image search.
Avoid over-optimising alt attributes
The power and usefulness of alt tags have made them easy targets for over-optimisation. This is when people write alt tags focusing more on keywords rather than describing the image.
To combat this, Google has incorporated the misuse of alt text into its search algorithm and made it a rule that alt text should be limited to just labelling images.
Is there alt text that you ‘hover over’ to see still used?
Those who used Internet Explorer might remember seeing alt text appear when hovering over an image. With current specifications in HTML, this is no longer correct behaviour and should be avoided.