Google SEO: Image Alt Tags Best Practices
Text in Alt tags are ‘counted’ by Google (and Bing) on a page level, but I would be careful over emphasising them – as with every element of SEO in 2017.
I’ve seen a lot of websites penalised for over emphasising invisible elements on a page. Don’t do it.
ALT tags are significant and I think an important challenge to get right.
Where it is relevant and time permits, I try to put the main keyword in an ALT once when addressing a page. Just enough to make a page ‘relevant’.
I wouldn’t optimise your ALT tags (or rather, Alt Attributes) JUST for Google, though.
Use ALT attribute text for descriptive text that helps visitors – and keep them unique where possible, like you must do with your titles and meta descriptions. Variation = traffic.
If you are too lazy to address image ALT tags on your page, at least, use a blank ALT (or NULL value) so people with screen readers can enjoy your page without unnecessary interruption, too.
Best Way To Optimise Alt Text
Update 17/11/08 – Picked This Up At SERoundtable about Alt Tags:
JohnMu from Google: alt attribute should be used to describe the image. So if you have an image of a big blue pineapple chair you should use the alt tag that best describes it, which is alt=”big blue pineapple chair.” title attribute should be used when the image is a hyperlink to a specific page. The title attribute should contain information about what will happen when you click on the image. For example, if the image will get larger, it should read something like, title=”View a larger version of the big blue pineapple chair image.”
Barry continues with a quote:
As the Googlebot does not see the images directly, we generally concentrate on the information provided in the “alt” attribute. Feel free to supplement the “alt” attribute with “title” and other attributes if they provide value to your users! So for example, if you have an image of a puppy (these seem popular at the moment :-)) playing with a ball, you could use something like “My puppy Betsy playing with a bowling ball” as the alt-attribute for the image. If you also have a link around the image, pointing a large version of the same photo, you could use “View this image in high-resolution” as the title attribute for the link.
Alt SEO Test – How many words will Google count as part of ALT Text on a page?
If you are interested in the actual number, I ran a simple test using ALT attributes to determine how many words I could use in IMAGE ALT text that Google would pick up.
The basic premise was; take an ALT tag, and put a lot of nonsense keywords in it, and see if the page will return in Google for all (or any) the keywords. I confirmed with a similar test most search engines do count keywords in ALT text long ago.
The following images on this page are observations from some testing I did back in 2011… which still seem to ring true in 2017.
Usefulness? I was thinking squarely from an accessibility point of view, not spamming search engines.
I think spamming ALT text can get you into trouble from what I have seen – probably depends on the site, and page, in question – or rather, the intent, as Google perceives it.
Yes, you can use other alternatives to describe complex images, but how many words will google count in the ALT tag?
Is there a limit?
Here is the ALT text I tested with way back a few years ago (2011):
I revisited this test in 2015 to see if
- Google still treated ALT text in this fashion and
- if indeed it was 16 words and not limited by characters.
While the way Google creates SERPs is evidently different these days – you can just about still determine that, under the hood, Google still seems to process Alt attribute text in a similar fashion:
- Google seemed to count the first 16 words in the ALT tag text – of the image on this current page – in this instance – and interestingly in the snippet Google uses it does seem to completely cut of the rest of the ALT and from the 17th word
- Having 16 words to work with might prove very useful if you are using ALT tags to describe more complex images. There is potentially plenty of available space to describe images properly for accessibility purposes AND SEO impact.
Test It Yourself
I have this kind of data on a lot of SEO factors. On page SEO tests are fun but you should always carry out experiments on your own site to validate any claim you read about online.
Remember, too, that this is just one example of one page I can observe and show ‘working a particular way’.
ALSO – This is a live running test – results might differ when Google caches the page, for instance.
TAKEAWAY – Alt Text has SEO And Accessibility Benefits
ALT attribute text is a pillar of accessible website design and search engine optimisation. Failure to include ALT tags with images represents a Priority 1 WCAG error and would mean your website would not be able to comply with basic UK DDA and SECTION 508 (in the US) recommendations – if anyone cares about that.
It IS easy to forget about them, though.
Importantly, a text equivalent for every image should be provided for visually impaired visitors, for instance. (e.g., via “alt”).
Non-text elements include: images, graphical representations of text (including symbols), image map regions, animations (e.g., animated GIFs), applets and programmatic objects, ASCII art, frames, scripts, images used as list bullets, spacers, graphical buttons, sounds (played with or without user interaction), stand-alone audio files, audio tracks of video, and video.
Text is considered accessible to almost all users since it may be handled by screen readers, non-visual browsers, and braille readers. When a text equivalent is presented to the user, it fulfils a substantially similar function (to the extent possible) as the original content. For simple content, a text equivalent may need only describe the function or purpose of content. For complex content (charts, graphs, etc.), the text equivalent may be longer and include descriptive information.
The non-text element does not mean all visible elements. The types of non-text elements requiring identification is limited to those images that provide information required for comprehension of content or to facilitate navigation.
- When an image indicates a navigational action such as “move to the next screen” or “go back to the top of the page,” the image must be accompanied by actual text that states the purpose of the image, in other words, what the image is telling you to do.
- When an image is used to represent page content, the image must have a text description accompanying it that explains the meaning of the image.
- HTML allows content developers to specify text equivalents through attributes (“alt” or “longdesc”) or in element content (the OBJECT element).
<IMG src="filename.gif" alt="Place alt-text here">
A very useful tip is to include empty alt tags (NULL ALT) for spacer images or graphic elements on a page used only for design purposes.
<IMG src="filename.gif" alt="">
This process helps assistive software ignore these elements when ‘reading’ out the contents of a page instead of reading out “image, image, image” etc.