On this page
Visualization is just one form of data representation. Data visualizations such as charts, graphs, maps, and infographics provide visual representations of information that help to make complex information easier for some people to understand. They are designed largely as an accommodation for sighted people for whom patterns, trends, and insights might be difficult to grasp from raw data alone.
While visualization is a widely used form of data representation, data can, and should be, represented using other forms as well for people who process information differently (e.g., using data tables, descriptions, or raw data sets that can be rendered using sound or haptics).
Key accessibility considerations
Accessibility needs vary by visualization type and complexity, but four broad design principles can improve accessibility in most cases. Use them – along with the listed resources and tools – to help ensure your data is accessible to all users, including those with disabilities.
Principle 1: Focus your data representation on essential insights
- Identify the key takeaway(s)
- Remove unnecessary data
- Avoid excessive complexity or density
- For multi-dimensional data, split into separate views or allow users to add dimensions
Principle 2: Use clear descriptions to guide all users
- Start with key information and context
- Include all necessary interpretive details
- Ensure hover-revealed information is accessible via keyboard and screen readers
- Use both visual and audible cues for dynamic changes to content
- Avoid static images of charts; if used, keep them simple and add alt text
Principle 3: Provide multiple means of representing the data
- Present the data in a table alongside the visual representation.
- For datasets with more than 20 rows, include a representative sample of data in the table, instead of the entire dataset.
- Make raw data available for download.
- Explore additional representation options available with your tool or platform (e.g., sonification).
Principle 4: Apply accessibility standards
Ensure all data representations and interactive elements comply with the W3C’s Web Content Accessibility Guidelines (WCAG), such as:
- Ensure good color contrast between text and graphics and their backgrounds.
- Don’t use color as the sole means of differentiating between lines, bars, or other meaningful visuals; add different patterns or sizes.
- Check that interactive elements like links and buttons are keyboard accessible and are big enough to easily click.
- Ensure text is large enough to be readable and resizable.
- If practical, design visualizations that scale well on a variety of screen and window sizes, without requiring horizontal scrolling.
Resources
Checklists
- Chartability is a comprehensive audit checklist designed to uncover specific data representation accessibility issues.
- UGA Digital Accessibility Checkpoints provide an overview of common digital accessibility issues and techniques
UGA resources
- UGA Libraries Research Guides – Search UGA Libraries’ research guides for data visualization tools, services, and resources curated by UGA subject librarians.
- UGA Professional Education Portal (PEP) – A library of online courses on digital accessibility and data visualization available to anyone in the UGA community with a MyID.
- Consultation on digital accessibility is available through DASH. Contact us at [email protected].
Business intelligence platforms
Tableau and Power BI help users create charts and dashboards without coding. While popular for visualizing data, these tools can pose challenges for users relying on screen readers or keyboard navigation, especially for highly complex and interactive visualizations. Ensuring accessibility requires thoughtful design and settings adjustments. UGA has enterprise licensing for both platforms through EITS.
Get started:
- Tableau: Tableau Accessibility FAQ
- Power BI: Overview of Accessibility in Power BI
JavaScript (JS) charting libraries
JS charting libraries streamline the coding of custom data visualizations for the web, but their built-in accessibility varies. Web developers must assess and enhance output to ensure it meets accessibility standards.
The HighCharts JS charting library is one option that provides several tools out of the box to assist with implementing accessibility. It also comes with an education license, available to UGA students, faculty, and staff.
Common mistakes to avoid
- Using color as the only differentiator: Relying solely on color to distinguish data series excludes users with color vision deficiencies. Always add patterns, shapes, or labels.
- Missing text alternatives: Charts and graphs without alt text, captions, or accompanying data tables are inaccessible to screen reader users.
- Overly complex visualizations: Cramming too much data into a single visualization makes it harder for everyone to interpret, and especially difficult for users with cognitive disabilities.
- Static images of charts without context: Embedding a screenshot of a chart without a meaningful description or data table provides no access to the underlying information.
- Inaccessible interactive elements: Tooltips, filters, and drill-down features that only work with a mouse exclude keyboard and screen reader users.
- Insufficient contrast: Low contrast between chart elements and backgrounds makes visualizations difficult to read for users with low vision.
WCAG 2.1 success criteria
The issues described on this page map to the following success criteria in the W3C’s Web Content Accessibility Guidelines (WCAG) 2.1:
- 1.1.1 Non-text Content (Level A) – All non-text content (charts, graphs, infographics) must have a text alternative that serves the equivalent purpose.
- 1.3.1 Info and Relationships (Level A) – Information, structure, and relationships conveyed through presentation must also be available programmatically or through text.
- 1.4.1 Use of Color (Level A) – Color must not be used as the only visual means of conveying information, indicating an action, or distinguishing a visual element.
- 1.4.3 Contrast (Minimum) (Level AA) – Text and images of text must have a contrast ratio of at least 4.5:1 against their background.
- 1.4.4 Resize Text (Level AA) – Text must be resizable up to 200% without loss of content or functionality.
- 1.4.11 Non-text Contrast (Level AA) – Visual elements required to understand content (such as chart lines, bars, and icons) must have a contrast ratio of at least 3:1 against adjacent colors.
- 2.1.1 Keyboard (Level A) – All interactive features (tooltips, filters, drill-downs) must be operable via keyboard.
Getting help
If you have questions or need assistance, the Digital Accessibility Services Hub (DASH) is available to support colleges, schools, and administrative units as they build sustainable accessibility practices.
- Contact DASH at [email protected] for consultations, training, or technical assistance.
Accessibility is a shared responsibility, and every step you take makes UGA’s digital environment more inclusive.