As our industry becomes more aware of the barriers it creates for blind and visually impaired people, things are starting to change.
On April 1, 1875, The Times of London published a remarkable graphic. It was the first newspaper weather map that featured air pressure currents, which are universal features on weather maps today. Imagine that you, excited by pieces of data viz history, encountered this map online and it looked like this:
There are lots of things you might have done with this graphic. You might have pored over its construction, noting the details that feel familiar and those that feel distant from modern weather maps. You might have felt compelled to look up other weather reports of that era and dive into its historical significance. You might have casually shared it on social media for other data viz enthusiasts to enjoy.
But you wouldn’t do any of those things because the image is just a plain box, teasing you that something visually interesting belongs there. How frustrating to be blocked from accessing information.
This is the situation that millions of internet users across the globe have to grapple with when they encounter data visualizations that they cannot see. For those with sight-related impairments—blurry or limited vision, color blindness or sensitivity, neurological conditions like dyslexia, or complete blindness, for example—visual information barriers are an everyday struggle.
To put you in their shoes for a brief moment, this article will provide clues as to what’s in that box. And just like a visually impaired reader, you’ll have to hope that the clues will be enough for you to imagine something that resembles the real thing.
Data visualizations have such extraordinary power. They allow the brain to process data faster by turning chaos into structure. They make raw numbers more comprehensible with shapes and color. They make enormous amounts of data more widely accessible. But they can also do the exact opposite for certain audiences, by making the data harder to digest—or even invisible.
Societies are increasingly relying on data visualizations to disseminate information. In certain contexts, visualizations are expected, or even required. During the pandemic, for example, charts, maps, and dashboards were the go-to formats for critical public health information.
That growing reliance, while great for viz practitioners, is excluding an entire segment of society from this societal shift. This situation leaves that population more vulnerable to missing or misinterpreting information.
The good news is that the data viz industry is increasingly acknowledging this problem. And it has begun to address it, primarily by making digital visualizations more “readable” to screen-reader tools that dictate content on a web page.
How we got here
Given that “viz” is in our industry’s name, we might feel wholly and uniquely unsuited to reach people with visual impairments. It turns out, however, that we’re not unique and we’re not alone: According to a recent report from WebAIM, an accessibility nonprofit run out of Utah State University, 96% of home pages on the web today fail at least one critical accessibility metric such as low contrast or not having “alt text” (a term we’re about to explore—hang tight). Really, the web as a whole is not great at accessibility, and digital data visualizations are just part of the problem.
It didn’t have to be this way. Screen-reader technology first appeared in the mid 1980s for DOS. One of the early versions that became popular in the 1990s was called JAWS, or Job Access With Speech. (The software has had staying power; about half of screen-reader users still rely on JAWS as their primary desktop reader today.) In the early 1990s, at the birth of HTML—a language that descriptively identified web elements—early screen readers like JAWS could navigate a webpage, dictate its contents, and allow users to jump around the page to explore points of interest.
But that technology has lagged the broader development of web products. Coding libraries and software products have made data visualizations more elegant and interactive for the web. Screen-reader products, on the other hand, interpret those visualizations today just as they did in the early days: describing charts and graphics as simply an “image” or an unhelpful file name. The only way for a screen reader to “read” an image is if the data viz contains alt text.
In the most basic sense, alt text is like a detailed caption that works behind the scenes. More technically, it is a piece of text embedded in an HTML tag that describes an image’s appearance and its purpose. Screen readers dictate that text. Human readers don’t see it at all.
Alt text, which is short for “alternative text” (a bit of a misnomer, as it’s not an alternative for those who rely on it), is not auto-generated when you embed an image onto a website. While certain tools exist to help people come up with the best alt text descriptions, the alt text itself must be added deliberately by a human.
Remember that weather map? If a screen reader happened upon it, and the image had detailed alt text, it might sound something like this:
An image of a weather map from 1875. The map is all white, except for a black outline of the United Kingdom, Ireland, and European landmasses to the south and west. The map has no country borders or country or city labels. All the text on the map is related to weather. For instance, there is a smattering of temperature readings across the region, and descriptive words like “overcast,” “clear,” “fine,” and “dull.” There are also dotted lines indicating bands of barometric pressure systems and arrows indicating wind direction.
Chances are, you’ve now got a better idea of what the weather map looks like. So problem solved, right? Not exactly.
Identifying our weak systems
If every image on the web had alt text, we’d be in far better shape than we are today. But the fact is, most images don’t. A 2006 research study from the University of Washington found that 60% of significant images on the top 500 high-traffic websites contained no alt text. Meanwhile, 99.9% of posts on Twitter lack alt text, according to a 2019 study by researchers at Carnegie Mellon University and Microsoft.
If an HTML alt tag is empty, screen readers simply note the presence of the image without giving the user any idea what it looks like, rendering information invisible. With a web that is chock full of empty alt tags— even for images that aren’t terribly difficult to describe—that’s a lot of invisible information.
So the problem is already crazy huge, and as more and more images hit the web, the invisibility problem grows in tandem.
For data viz images, in particular, there’s an even greater concern: These visuals are proliferating in both quantity and in complexity. Indeed, data visualizations are in the midst of a phenomenal digital renaissance, benefiting from a swirl of new technological tools. We practitioners are hungry for fresh ideas, and we build off of each other’s inspiring works that fly across social media. Our analyses are ever more robust, our designs are ever more beautiful, our interactivity is ever more engaging.
Considering that we already have so much trouble creating alt text for static charts, maps, and other simple images, are we equipped to make our scrollytelling stories, our interactive graphics, and our animations fully accessible? If we’re being honest here, the answer is likely “no.”
However, complex visualizations are hard to describe with alt text alone. What’s more, visually impaired people navigate around their screens using their tab key, and complex visualizations are often difficult—if not impossible— to tab through. Today’s data viz innovations have been built on weak accessibility foundations. Considering that we already have so much trouble creating alt text for static charts, maps, and other simple images, are we equipped to make our scrollytelling stories, our interactive graphics, and our animations fully accessible? If we’re being honest here, the answer is likely “no.”
Our industry is quickly maturing in so many ways, but we’re at risk of falling even further behind on accessibility, creating more barriers, and becoming victims of our own success.
It’s not your fault
We need to talk about where to go from here (and there’s a lot of exciting stuff on the horizon). But first, let’s establish responsibility. Not in the finger-pointing sense, but in the communal sense. Accessibility is a big, heavy, societal issue, and we’re collectively responsible for it, even though none of us, individually, set out to intentionally exclude our neighbors.
You didn’t miss a prerequisite class. You didn’t skip a required reading assignment. There’s no official guidebook on how to do accessibility right (but check out some resources here). We’re learning at the same time, together, and it’s a steep hill to climb. Nobody is asking you, personally, to lead the charge up that hill. Remember, accessibility challenges are not your fault— they are systemic failures.
But you can—we can—actively start thinking about this problem. We have to establish and agree that moving the needle on accessibility is a priority. If we change our mindset, individually and collectively, then the skills and innovation will follow. That shouldn’t be a massive leap for the data visualization community, which advocates for openness, for transparency, and for iterating and improving on each other’s work. We are surrounded by peers who want the industry to move in the direction of best practices. That starts with recognizing the problem and cultivating a desire to solve it. Let’s go!
The tides are shifting
Now for the good stuff. In recent years, data visualization accessibility has started to move from a fringe topic to a mainstream one, not unlike the broader shift to prioritize diversity and inclusion in our lives and workplaces.
Digital tools, from coding libraries to software, are the main reason data visualizations are booming. But the further we get from knowing how these tools work, the harder it can be to get under the hood and fix accessibility issues.
Fortunately, some chart-building tools have features to help users correct basic accessibility problems quickly. For instance, Datawrapper performs color blindness checks so users can adjust their palettes. Power BI has a host of screen-reader settings like tab order, which allows users to navigate through the visualization in the same order as users who process it visually. Both Datawrapper, Power BI, and similar chart-building and dashboard tools have fields for alt text that are as easy to fill in as a headline or a footnote.
Increasingly, data visualization tools include a link or widget to access the raw data in a spreadsheet or table. This is a great way to give blind readers all the information in case the alt text misses the finer details or specific data points.
Think about this within the context of that 19th century weather map. Say someone is researching historical temperatures and wants to know the weather readings on March 31, 1875. The map contains that information, but the alt text only describes what the image looks like, not the specific data points. A table like the one below would solve that problem.
For developers who want more robust functions, tools like Highcharts, Visa Chart Components, and SAS Graphics Accelerator allow creators to describe the entire visualization as well as provide automatic navigation and descriptions of the individual visual elements within the visualization, such as the title, axes, legend, and data points.
Accessibility shifts are also coming from within companies, including a number of major news sites, that are becoming increasingly thoughtful about their internal work culture, their customers’ needs, and their data products. (Check out these insights from data journalists.) This top-down approach doesn’t just put more resources and talent into solving the problem; it also gets everyone at the organization thinking about accessibility at each step of the workflow. Practitioners who address accessibility from the conception stage have a better chance of success than those who address it at the end and realize that the project has to be retrofitted.
The number of bespoke data visualizations that are blind accessible is ticking up in large part due to these industry leaders. Complex visualizations that are screen reader friendly are still a very rare species, but their population is slowly rising, and they are more common today than ever before. Some even go beyond screen readers and contain audible elements that enhance the experience for everyone.
How you can embrace the winds of change
And then, there’s you. The industry can’t just rely on the software developers and the deep-pocketed corporations to change everything. Change, as the adage goes, starts with you.
Do you feel like you’ve just been handed a trumpet and told to play like Miles Davis? This is the scary part. Maybe you’ve never written alt text before. Maybe you have never heard of an HTML tag. Maybe you’ve never tested your charts for color blindness. So start by taking a breath. Making accessible data visualizations is both a skill and a craft. Like a beginner trumpet player, you’re not going to get it right on the first try, but with practice and exploration you can improve. The only way to do it is to do it. And everyone has to start somewhere.
We’re not going to lie, making accessible charts can be hard at first, but it does get easier the more you try. As you’re learning, don’t be afraid to use resources to help check your work, including the Chartability toolset made by this article’s co-author, Frank Elavsky, which provides guidelines and benchmarks to measure your work and your progress.
Surround yourself with support, seek advice and input from people with visual disabilities, and keep others accountable. If you’re iterating on an already-written project or hacking some code, keep in mind that you might be copying inaccessible work. If you’re not sure, use a screen reader to test it out. (While some screen readers are available for download, nearly all devices available today come with built-in screen readers that can be turned on with a keyboard shortcut or through accessibility settings.)
Above all, work on adopting a fresh mindset so that accessibility becomes both an integral part of your work going forward, and also part of your influence on other data visualization practitioners.
For the data visualization community, it’s time to embrace the winds of change.
This article originally appeared in Issue 3 of Nightingale magazine. Get your copy here!
Looking to make your data visualizations more accessible? Check out our resources page!
Emily Barone is managing editor at Nightingale.
Frank Elavsky
Frank Elavsky is a data-experience engineer and designer who is interested in accessibility, motion and interaction design, and design systems. Frank is also the creator of Chartability.
-
Frank Elavsky#molongui-disabled-link
