Accessibility Check List: The ALT tag

1 MAR 2010 2

Today we're going to talk about some accessibility specifics and what you can do when creating content to ensure your website remains accessible.  In this post, we'll be talking about one of the most important factors for accessibility that you'll have to deal with as an end user adding content to a website through a CMS, with the intention of it remaining accessible.  You'll have to take this specific HTML code into  account every time you add a picture to your website.

This important accessibility item is of course the ALT tag, and it is usually one of the first things you'll learn about accessibility, solely due to how often it comes up .  It's essentially an additional piece of HTML you can use to attach text to an image. This is very helpful for making a website accessible... at the most basic level, you can use alt tags to describe a picture placed within your content.  A picture of a beautiful sunset would be labeled as "a picture of a beautiful sunset" in the alt tag. When an ALT tag is defined,  if someone who had impaired vision was using a screen reader to view your website,  the screen reader would inform them that there is a picture of a beautiful sunset under the cursor, thus helping them better understand the content of your website.

Things can get a bit more complicated than that in the real world though.  ALT tags are often a favorite tool of Internet Marketers who are focusing on SEO (search engine optimization),  as it gives them another avenue to insert keywords into a page for their search engine rankings.  However, for accessibility's sake, you must ensure that you are providing accurate descriptions of your images, and images that aren't conveying content (i.e. they are purely decorative in nature) must have a null (empty) alt tag -- otherwise an impaired visitor using a screen reader would be confused by the ALT tag descriptions.  To address SEO concerns, you can ensure that images used relate to or contain images of your keywords while being relevant to the page content.  Using this method, you can have proper descriptions in your ALT tags as  well as the keywords that are part of an overall SEO campaign.

An acceptable alternative for images that aren't conveying content is to have them implemented as a CSS background. This method uses CSS code to display the image without actually placing it in the HTML code. However, inserting images as a CSS background is not typically an option available when building content in a CMS system, whereas placing alt tags on images is.

This may seem a little overwhelming, but don't worry... if you are using a modern CMS then it will most likely have  a very easy method of inserting ALT tags for your images that you can manage without any specific technical knowledge, provided you understand what the ALT tag is and what information is supposed to be entered for it.

Fill out the form below to get started

find out what we can do for you 877 543 3110