Guide on Designing Inclusive Infographics Using Our Tool

Guide on Designing Inclusive Infographics Using Our Tool

When creating infographics, it's crucial to consider the needs of all users, including those with visual disabilities and cognitive impairments. Here's a guide to designing accessible infographics that cater to a wider audience:

Strong Color Contrast

Choose color combinations with a contrast ratio of at least 4.5:1 between text and background to ensure readability for those with low vision or color blindness. Avoid relying solely on color and supplement with symbols or icons.

Clear, Simple Fonts with Adequate Size

Use sans-serif fonts such as Arial or Verdana, which are easier to read. Maintain a font size of at least 12pt (or 16 CSS px) to improve legibility, especially for people with dyslexia or low vision.

Clear Visual Hierarchy and Structure

Use headings, boxes, and spacing to separate information distinctly. Well-labeled sections and consistent formatting reduce cognitive load and help all users navigate the content easily.

Incorporate Icons and Symbols

Use icons alongside text to visually categorize information so users don't rely solely on reading. This also helps those with cognitive disabilities or color blindness in recognizing categories or ideas quickly.

Provide Transcripts and Text Alternatives

Include transcripts for any audio or video content linked or embedded within the infographic. Alt text should be supplied for all images and icons to support users with screen readers and other assistive technology.

Additional Tips

• Use simple color palettes to prevent overwhelming users.
• Use bold or different colors to highlight important information, but not as the only method of emphasis.
• Test your color contrast with tools like color contrast checkers.
• Ensure consistent formatting throughout to maintain readability and reduce confusion.

Benefits of Accessible Infographics

By integrating these design principles—contrast, font size, structure, icons, and transcripts—you create infographics that are more accessible to people with various visual and cognitive disabilities while maintaining clarity and engagement.

• Infographics are content assets that convey information in a visual way.
• Creating an accessible infographic makes it more useful and SEO-friendly.
• The concept of inclusive visual design is important to include as many people's needs and abilities as possible.

Practical Considerations

• More than 7,2 million adults (ages 16 to 75+) in the United States were reported to have a visual disability in 2016.
• Use HTML subheadings to ensure your transcript content structure is easy to understand.
• It is important to provide a detailed text transcript for your infographic.
• Test your transcript for clarity using Text-to-Speech tools.
• WCAG 2.0 requires a text font no less than 10 points (about 13 pixels) for it to be accessible.
• It is recommended to avoid using shades of gray, yellow, and orange in infographic design.

Accessibility Features

• Use "Skip Navigation" links to make your graphic transcript easy to locate.
• Offering alternative file formats is a good idea, such as PDF files or videos.

By following these guidelines, you'll be well on your way to creating accessible infographics that cater to a wider audience and adhere to best practices for web accessibility.

1. To guarantee readability for colorblind individuals and those with low vision, opt for color combinations with a contrast ratio of at least 4.5:1, and augment with symbols or icons when relying on color is not advisable.
2. The use of sans-serif fonts such as Arial or Verdana, accompanied by a font size of at least 12pt, improves legibility for people with dyslexia or low vision.
3. Distinct separation of information can be achieved through well-labeled sections, headings, boxes, and ample spacing, reducing cognitive load and aiding easy navigation for all users.
4. Incorporating icons alongside text helps visually categorize information, benefiting those with cognitive disabilities or color blindness in recognizing categories or ideas more swiftly.
5. In order to support users with screen readers and other assistive technologies, provide transcripts for any audio or video content and alt text for all images and icons within the infographic.

Read also: