In January 2019 a class action lawsuit was launched against Beyoncé for failing to make her website accessible. There are several factors that go into making a website accessible, but for the Beyoncé lawsuit the failure to include alternative text on images was one of the key issues. As reported in the Guardian article about the lawsuit, the lawyer for the plaintiff stated, “There are many important pictures on beyonce.com that lack a text equivalent … As a result, Plaintiff and blind beyonce.com customers are unable to determine what is on the website, browse the website or investigate and/or make purchases.” The failure to include alternative text on images could have easily been avoided with a few simple steps.
When you insert an image into your site an <img src=”Path to your image”> element is created. If you open the developer tools on your site (right click on the page and click ‘inspect’ ) you can actually see the code on the page.
The ‘src’ attribute references where the file is coming from. The second attribute that should be included on all image elements is the ‘alt’ attribute. This attribute is meant for the alternative text description of the image. The description does not need to be long, but it should describe the content of the image it is associated with.
If you’re based in Ontario all public sector organizations, and any private sector organizations over 50 people, must now reach a level A in the Web Content Accessibility Guidelines (WCAG). After January 1st 2021, all public websites and web content must reach a level AA. Best to get ready now.
To help meet these guidelines we need to use alternative text for all images that convey contextual meaning to users. For a user who requires a screen reader to navigate a site, the alternative text becomes a key component of creating the overall user experience. As a screen reader goes through your site it will read out the alternative text description to a user. If no alt text is present then the screen reader will read out the path to the image (this is not very pleasant and does not meet accessibility guidelines).
Not only does providing an engaging alternative text to your users increase the user experience, but it also aides in your site’s online ranking. Search engines use alternative text to understand what images are on your pages and how best to index them. Want to rank higher in Google ? Use alternative text in your images.
First, ensure your developer has included the alt attribute on any images that convey contextual meaning. Once this is done you should have a field on the backend where you can add alternative text to your image. In WordPress this can be done in the Media uploads area. Click on an image and you should see an ‘Alt Text’ field.
Insert a brief description of your image and you’re good to go. You could now insert the image into a post and double check the alternative text by inspecting the image on your page.
Adding alternative text to your images will help you meet today’s web accessibility standards and rank higher on Google. It only takes a second, but it could save you from a messy lawsuit. Should you need help integrating web accessibility into your site don’t hesitate to contact us for a free assessment.
