Introduction to Infographics

Accessibility is incredibly important to consider when working on any project, but doesn’t always get highlighted within educational assignments. This means that it’s important to strive for more accessible media wherever possible. This section will outline a few important steps you can take to make your infographic a more accessible resource for your audience! 

The Web Accessibility Initiative’s (WAI) Web Content Accessibility Guide (WCAG) contains a helpful guideline to meeting general accessibility standards. WCAG outlines three levels of compliance; A, AA, and AAA. Triple A is the highest accessibility standard to achieve, and is always something creators should strive to meet. Double A is a far more common level of accessibility standard, and are generally considered acceptable best practices that creators should try to exceed. A is of course the lowest rating, and should be a benchmark for the lowest standard of access. The WCAG webpage allows users to search various types of media to determine how a given piece of content can be tailored to meet WAI’s standards.  

You may also want to reach out to the University of Toronto Scarborough’s AccessAbility Services for more specific information on further incorporating accessibility standards into your projects.  

Piktochart also has a great guide on how to make your infographics more accessible! 

As a visual medium, blind or low sighted audiences may need to use screen readers or other tools to access your infographic. Since screen readers can be pretty literal in their function, it's important to create your infographic in a way that will help these readers effectively communicate your content without confusing visual information with text or failing to read sections of content because they are illegible to the device. 

Cascading Style Sheets (CSS) are one way that you can achieve this! CSS are what determines how information is presented on a document, and by using effective style sheets, you can hide extra text and important data on your infographic that screen readers are able to pick up. 

According to TPGi, “images that contain text get distorted and pixelated for low-vision users who use zooming tools, and infographics in general, contain so much data that alternative text just wouldn’t do them justice. The better solution is to mark up the content using native HTML elements (headings, unordered lists, ordered lists, tables, etc., where appropriate) and style the HTML accordingly using CSS to be visually appealing for sighted folks.” This strategy allows: 

• sighted and non-sighted users to scan the headings. 

• screen reader users to quickly find out how many items are listed in data sets. 

• print stylesheets to function properly, giving a nice report on the printer instead of just a photo. 

• simple functions such as copy and paste to operate as expected for sharing content or quoting the source on social networks. 

Check out the rest of TPGi’s page for more information on how to use CSS to make your infographic legible for a wider audience!  
 

You may also want to take a look at the Diagram Center’s guidelines on image description for more details on how to determine what elements must be described, how to format those descriptions, and more! 

An important part of making your work accessible is by being considerate of your usage of colour! Piktochart has a great resource on how to determine the colour palette and contrast of your infographic! Check it out to see what they have to say on creating easy-to-look-at infographics! 

Check out Venngage’s website on how to determine which font is the most visually appealing, legible, and accessible for your infographic! 

With infographics, less is more!  

Unlike full-text essays and articles, infographics look best when there’s fewer elements that viewers have to take in when looking at your work! If there are too many colours, icons, images, varying fonts and type-sizes, your viewer will get overwhelmed and probably won’t be able to properly absorb what you’re hoping to tell them!  

The visuals and graphs used in infographics are data-rich, meaning that each individual element is expressing a larger volume of information than a single picture or piece of text. This is why it can be useful to start your design with a template, and feedback from peer editors can help you avoid going overboard with your visual elements!