What Is The Best Way To Optimise Alt Text?

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?

This is a live test that has been running for over 6 years. See image at the top of this page for latest (2017) results. The following text is a written explanation of the screenshots above.

Original Test – 2011

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.

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):

Google Results:

and

and interestingly

and

HISTORY: 2015 Test Results

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:

…and it seems to be the case today (2017) that this not changed much.

SO….

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 off 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”).

The 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 the 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.

Techniques

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.