<alt> Campaign: Let’s make images on the web accessible

Authors note: This is re-published post due to an unavoidable technical issue.

A picture speaks several words. Use of images over the internet is increasing everyday. It’s essential they are make accessible to all users and technologies. Benefits of making images accessible are:

• Information conveyed through images is made available to blind and visually impaired users
• Information is made available to those users who turns off images in the browser
• Information is made available to those users who may not be able to load images due to poor connectivity
• Search engines cannot read images; no matter how beautiful those images are

Today images are used on the websites, social media channels such as Facebook, Twitter, Google+, LinkedIn, Instagram, blogs and almost every platform over the internet. These images carry a lot of information; hence it’s important to make these images accessible.
Here is what 1.1.1 Non-text content talks about:

1.1.1 Non-text Content: All non-text content that is presented to the user has a text alternative that serves the equivalent purpose. (Level A)

If images do not have alternate text, screen readers often try and read associated text based information such as path of image file or link destination if image is a hyperlinked. A few things to be kept in mind about alternate text:

• Alternate text must be meaningful
• Alternate text should not be too long. If information needs to be described in length, then one should use <longdesc> attribute must be used
• Background images should be used only for decorative purpose; if those images are informative, then those images must be brought to foreground and provide appropriate <alt> attribute
• Decorative images must be provided with emplty alt attribute – i.e. <alt=””>

Through this next one month, let’s practice and propagate the following:

• If we find images on any website, let’s write to those companies and have them fix it
• If you are a web developer / website owner, identify images on your website / app, fix if they do not have alternate text
• Let’s avoid posting text embedded on to an image
• Whatever we post on social media such as Facebook, LinkedIn, Twitter etc., let’s be sure to add text description

If you have fixed something to this effect or if you are able to convince someone doing it, leave a comment here to acknowledge the effort.

Let’s make images accessible!