Marketers love infographics. They’re a popular way to share complex data or information in a visual manner. But did you know most infographics are completely inaccessible? Many people are unable to understand infographics due to their health, abilities, and environment.
tbk’s sibling company, AODA Online, recently hosted a webinar with actionable steps about how to design and develop accessible infographics. Led by our Senior Auditor and VP of Technology, Andre LeFort, the webinar was so well received, we thought it’d be a disservice not to share the valuable information with you too.
Why is it that so many infographics are inaccessible? It’s a great question with a multi-layered answer. Some of the reasons include:
Information Density – When many layers of information are included within an infographic, it takes the human mind longer to process them all.
Colour Dependence – If the chosen colours within an infographic do not work well together (e.g., there are contrasting colour issues), text can be difficult to read.
Combination of Fonts and Imagery – When fonts and imagery are not laid out strategically, the infographic can become visually cluttered, leading to incomprehension.
Poor Reading Order – If content is not logically presented, people struggle to understand it. This is an indication that the information hierarchy was not built correctly.
Rasterized Text – When text appears exclusively on images (and not elsewhere to reiterate the information), the infographic can become inaccessible.
Mobile Device Incompatibility – Too many infographics are not compatible with many mobile devices, making it difficult for people to interpret them. The infographic may be accessible on a computer/laptop, but not on a mobile phone or tablet.
So, the question becomes this: what steps can I, as a marketer, take to build accessible infographics?
Accessibility begins by emphasizing with your audience and taking their needs into consideration with the content you’re creating online. As you work to design your infographic, remember the principles we’ve learned above.
First, consider the reading order of your content and plan your heading structure. Keep it simple and use a logical flow of information. Compile information into grouped buckets, being careful not to overload the reader.
Once you’ve collected the written content, move forward with accessible design. While you don’t want to rely on colour alone, you will want to ensure good colour contrast. Use adequate font sizes and minimize the use of capitalized words, which can improve accessibility. Do not embed text into imagery; make sure the message is presented in plain text somewhere outside of the image so it can easily be read.
Finally, consider how the information may appear on different electronic devices. Be mindful of mobile devices and rotation/position. You’ll want to allow for the rotation of the mobile device.
Make sure you regularly review and audit your code. There are a number of tools that designers and developers can use. Tools such as the free or enterprise offering at www.AODAOnline.com provide automated solutions that can ease the burden of managing code compliance on many pages on your website. For one-off, manual reviews, a number of browser tools such as WAVE by WebAim allow designers and developers to audit pages one-by one.
A word of caution: in order to become and remain compliant and accessible, a technical understanding of the WCAG 2.1 and its criteria is necessary. Only designers and developers with training and experience in this space are prepared to take on this challenge. If you’re unfamiliar with the guidelines and criteria in the WCAG 2.1, we recommend you find a qualified team with accessibility experience with which to partner. They can help you select the appropriate technology (HTML5, JavaScript and CSS) along with a Content Management System (CMS) that will allow your team to manage the content in your infographics.
By taking the steps outlined in this post, you’re now equipped with the necessary knowledge to create accessible infographics. Share with confidence!
For more helpful information and hands-on consulting for web accessibility, please visit https://aodaonline.com/. You’re also welcome to reach out directly to tbk’s tech-savvy team to talk about accessible marketing initiatives for your business.
