Alternative Text: What and Why

What is Alternative Text?

Alternative text carries several names which most in the IT field will recognize: "alt attributes," "alt text," and "alt descriptions." Essentially put, alternative text is a vital function within the HTML code that describes the function and appearance of an image or object on a given page.

Alternative text has three primary uses with such a wide range of utility that its value cannot be overstated:

• Stand-in contentIn the event an image file can't be loaded (for whatever reason), alt text will be displayed, giving the user a description of what the image is.

• Search Engine OptimizationSuccessful search engine optimization utilizes alt tags to provide a better definition and contextual explanation of the image, resulting in all-around better results by search engines. SEO is a vital component to strong returns in internet marketing.

• Web accessibilityThis is a very important aspect of the modern internet. Not only are there requirements and standards for your web service, but these steps help to ensure your customers or clients feel valued and respected. In the case of visual impairments, for example, properly descriptive alternative text added to photos is a useful tool for those who rely on screen readers to better understand the context of the image in relation to the information your web page provides.

The Finer Points

While the above three points of utility are quite distinct, they all have a very strong overlap of execution, which comes down to high-quality description.

Adding a description of the image is almost always functional — but that description is not always of a decent quality. For example, it can be very easy to describe a stack of pancakes by just putting the word “pancakes” into the alt text field and being done with it. Although that’s technically a functional description that serves its basic purpose, it lacks quality and rich context. A basic description like this will invariably fall flat to the reader, customer, or consumer. The solution here is quite simple in the context of alternative text: as concisely as possible (within the standard 125-character limit for most common screen readers), explain the picture as descriptively as possible.

Using our example above, you can ask yourself a few pertinent questions:

• What kind of pancakes are they?
• Is the picture aesthetically appealing? If so, why?
• Is there anything else of note in the picture — syrup, confectionary, butter, and so on?

Answering basic descriptive questions about the image will provide you with the rich context you need to properly describe the picture. Additionally, you should use this opportunity to target your keywords, connecting the image to the page’s content and making your page more relevant to search queries. A note of caution, however: Keyword stuffing is obvious and many search engines will penalize you for it. Keep your descriptions relevant to the image, but be creative.

Utilized properly, alternative text will help you gain an edge on your competitors, maintain the highest levels of compliance, and demonstrate your company’s commitment to social responsibility.