Alternative image text explained

Written by: Peter Fisher on September 12, 2016
Tagged under: ,
Tweet about this on TwitterShare on FacebookShare on LinkedInShare on Google+Share on RedditEmail this to someone

A picture is worth a thousand words

Alternative image text is used to describe a website image. The content in the text is shown if the image cannot be loaded. This is useful for mobile websites where bandwidth is limited. The alternative content is also indexed by Google and other search engines.

An image in a website can fall into two categories. Design based images and descriptive images. When designing a website it is important to distinguish between the two.

Below is a breakdown of what alternative text is and how it impacts a websites design and SEO

SEO and alternative image text

Alternative image text can help with SEOAs mentioned above alternative image text can help optimise your website for search engines.  Google and other search engines place a high importance on alt text to determine what the image is and how it relates to the other page content. Google can also list the image in its Google Image Search.

Images for website design

A design based image is normally a graphic that is within the website design.
For example if your website had a christmas theme then you could incorporate christmas trees or snow into the websites design.
Other examples include a websites background or borders.

These design assets would be used mostly used as eye candy and wouldn’t serve any really purpose in explaining the content. As graphics for website design don’t explain the page content they should have little or no explanation in the alt tags. Your websites SEO will not benefit from having alternative tags of ‘left border’ or ‘footer background’.

Images used to help describe the content

It is true that an image speaks louder than a thousand words and a descriptive image should do just that. These images should explain and compliment the content of a web page. An example of a descriptive image could be a product or service that the content is promoting.
Unlike web design graphics these images have a greater importance in mobile websites and search engine optimisation.

Alternative image text markup

The markup for alternative tags is as follows:

<img alt="Explanation of image" />

But don’t worry about the technical stuff. Websomatic can add alternative text to your images.

Let Websomatic build your website

Websomatic will add alternative text to your images when designing your website.

We will work with you to decide which pharses best suit your images and how they can compliment your content.

Get in touch with Websomatic to start your next web project

Title image source: Tryptofish

Tweet about this on TwitterShare on FacebookShare on LinkedInShare on Google+Share on RedditEmail this to someone

Peter Fisher is a UK based freelance web developer and cross platform mobile applications developer. He has a degree in E-Commerce and Multimedia and has worked for many web design agencies and hosting companies.

Peter has his own web and mobile development blog and is the host of the HowToCodeWell YouTube channel.

Read more about Peter Fisher

  • Related Articles

  • Ready to start your project?