Educational Technology and Change Journal

By Claude Almansi
Editor, Accessibility Issues
ETCJ Associate Administrator

There seems to be a new infographic craze, particularly about education and social media. I had been vaguely aware of the term as an annoying pseudo-nerdy buzz word  for a while, when the Swiss satirical weekly Vigousse started running an “Infographie imbécile” (Dumb Infographic) on the last page of each issue in January 2010. For instance:

From Vigousse N. 46, January 21, 2011.
©2010 Vigousse Sàrl .Reused by kind permission of the Editorial Board.
While most of the words can be understood by English speakers,
in French, “gag” means “joke,” and “rire jaune” = “to laugh from the wrong side of the mouth.”

Shortly after that January 2011 issue, the “Infographies imbéciles” stopped: possibly because the targeted newspapers got the message and soft-pedaled on infographics. Or maybe the editorial team of Vigousse got bored with doing them.

Infographics?

But what are infographics, actually? If you look up the word in Wikipedia, you get very sensibly redirected from http://en.wikipedia.org/wiki/Infographics to http://en.wikipedia.org/wiki/Information_graphics, which reminds us that:

…In prehistory, early humans created the first information graphics: cave paintings and later maps. Map-making began several millennia before writing, and the map at Çatalhöyük dates from around 7500 BCE. Later icons were used to keep records of cattle and stock. The Indians of Mesoamerica used imagery to depict the journeys of past generations. Illegible on their own, they served as a supportive element to memory and storytelling. …

Infographics as support are useful, indeed: in IFPI.ch’s  explanation of its “Game Over” pirate hunting operation, now deleted from its site but preserved in the Internet Archive, the “Comment traquer les pirates de musique” picture  helps us understand the previous verbal description of the spying technique used by IFPI.ch to get the IP addresses of people who download copyrighted music via P2P, so as to ransom them with the threat of a lawsuit. Similarly, the graphic of the Superintendent Trojan (commissioned in 2006 by the Swiss Federal Office of Communication to spy encrypted Skype conversations) in the Tools and sourcespage of Megapanzer.ch, the website of one of its authors, is a great help for nontechies who might be lost if they only had the preceding verbal description.

Other definition

On April 6, 2007, Dave Gray proposed a tentative definition of infographics in “What Is Infography?” (on the multi-author blog Infography):

…About a week ago I had an interesting conversation with Juan Velasco, Graphics editor of National Geographic, where we tried to answer some of these questions. It’s the beginning of a manifesto — can you help us make it better? WHAT IS AN INFOGRAPHIC? 1. It’s a visual explanation that helps you more easily understand, find or do something. 2. It’s visual, and when necessary, integrates words and pictures in a fluid, dynamic way. 3. It stands alone and is completely self-explanatory. 4. It reveals information that was formerly hidden or submerged. 5. It makes possible faster, more consistent understanding. 6. It’s universally understandable.

As an amendable draft, this definition was innocuous. Unfortunately, it has since been taken up as Gospel by many people, as the 69 results of a Google search for Infographic + “It’s a visual explanation that helps you more easily understand, find or do something” show. This is where things went wrong.

• Infographics that “integrate words” cannot be “universally understandable,” particularly if they are presented in image formats that cannot be computer-translated easily.
• If such an infographic image is offered as something that “stands alone and is completely self-explanatory,” instead of as a support, it excludes blind people and cannot be indexed by search engines, unless it is provided with an alternative description attribute, which is rarely the case.
• Even when sources are mentioned in an infographic image, links cannot be clicked.

But the main issue  is that real information and knowledge do not stand alone, but acquire their meaning in context. If something “stands alone and is completely self-explanatory,” it is not information or knowledge. It is authoritarian propaganda.

Examples

Vile but working

Unfortunately,  hate mongerers are often very efficient at making infographics that conform to Dave Gray’s definition. In 2007, the Swiss ultra-right-wing party, paradoxically named “Union Démocratique du Centre,” was campaigning for an initiativefor adding in the Swiss constitution articles that foresaw  the expulsion of foreigners who had committed crimes or illegally received welfare benefits. It produced this poster:

Pour plus de sécurité = For more security

Of course, there was an outcry and attempts to retort. For instance, in the Italian-speaking part of Switzerland, people added stickers to the poster:

From Luca Mascaro's "Quando la comunicazione viene resa più esplicita," Aug. 31, 2007 (click on the picture to view his post)

There were also well-argued textual replies. Nevertheless, the initiative was accepted by the Swiss people and the modifications it requested were integrated in the Swiss constitution. This is one big danger of graphic information that “stands alone and is completely self-explanatory”: it is most efficient in appealing to the ugliest gut feelings and in paralyzing rational thinking.

Obnoxious but inefficient

The deplorable success of Dave Gray’s tentative definition also leads to obnoxious but fortunately inefficient infographics: on Dec. 15, 2010, DegreeSearch.org published “10 Staggering Facts about Education in America” in its Education Insights blog. The post consists mainly of an infographic image  followed by a call for more similar stats. Here is the infographic:

When someone commented:

Umm. 1.2 Million / 365 days = ~3287.7 dropouts per day, nowhere near 7000 per day. Maybe you guys should take point #4 more seriously.

DegreeSearch took 2 months to reply:

Anonymous, you’re right! It doesn’t add up for 365 days, but it was calculated for 180 school days. The numbers are taken from Education Week. Here is their explanation of those numbers: Education Week. (2007, June 12). Diplomas Count 2007: Ready for What? Preparing Students for College, Careers, and Life after High School. Bethesda, MD: Editorial Projects in Education Research Center. Per day figure derived by dividing 1.23 million by 180 school days per year. Per second figure derived by dividing 1.23 million by 31,536,000 seconds in a full calendar year. The number is then 6,833 students every day, or nearly 7,000 students. We’ll update the graphic.

So much for infographics “stand[ing] alone and [being] completely self-explanatory.” Three months on, DegreeSearch has yet to updated it. It is more complicated to update a graphic than real text.

Moreover, in the original post, this infographic is inserted with an alt=”” attribute, i.e., an empty alternative description. This attribute tells screen readers that an image is purely decorative and doesn’t convey information, and should therefore be skipped when voicing a page to a blind person.  Even if the “decorativeness” of  this gutter-press-styled infographic is arguable, blind people are not missing much by being excluded from its content. However, their programmatic exclusion is not acceptable. Unfortunately, a Google search for “10 Staggering Facts about Education in America” shows that this visual and conceptual eyesore has been taken up over 800 times.

Better but improvable

On May 23, 2011, Dan Martell published “The Joy of Social Media: How Bob Ross Sees It” on FlowTown, in which he inserted this infographic:

Again, this infographic is a picture containing a lot of text that can neither be accessed with screen readers nor indexed by search engines. However, this time, there is an alt attribute, yet it only says “11.05.18_BOB-ROSS-SOCIAL-MEDIA-sm,” which is not very informative. But Dan Martell also copied the first text in normal text under the infographic:

Of all the happy little worlds Bob Ross has created on his canvasses, none are as intriguing as his social media landscape series. So strap on your painting afro, get out your titanium white dress shirt, and try your hand at drawing everyone’s favorite social media destinations.

This is already far better than “10 Staggering Facts about Education in America.” Unforunately, many people who republished the comic just gave the picture. It is also much more interesting because it mercifully does not fulfill Day Grave’s “3. It stands alone and is completely self-explanatory” criterion for infographics, i.e., it is not propaganda but a humorous incitement to think about social media. However, it would even be possible to insert the texts as real texts in this infographic. This is what the Vigousse team did with their “Infographies imbéciles.” Granted, the linearized list of words a screen reader would voice does not make much sense, but there are other alternative solutions:

Considerately efficient 1

In 2008, the Office of Learning Technology of the University of British Columbia published  a page entitled “Current and Evolving Accessibility Practices” with this picture:

The picture was simply linked to the PDF file where the info, summarized in the bicycle, was expounded in full. This was logical, too. It differs from Kyle Weems’ comic: the main work was the textual essay in PDF, and the graphic was “a supportive element.”

Unfortunately, this page has since disappeared, and the version saved in the Internet Archive has not preserved the picture – nor the linked PDF. I retrieved the picture from http://accessibility4all.wikispaces.com, where Roberto Ellero and I had used this example for an online discussion about accessibility.

Considerately efficient 2

In “Comic Update: Squirrel in the Dark,” published on CSSquirrel on August 19, 2009, as a comment to his #34: Squirrel in the Dark comic, Kyle Weems described the real issue with making comics accessible to blind persons:

… After all, a comic is at it’s heart a visual medium. Would a blind person want to sit through the annoyance of having the joke described to him, like the co-worker’s bungled re-telling of a standup joke he heard last night? I started reading a lot about HTML 5, and the arguments that it’s birthing process has spawned. One of the banners that differing “sides” of the involved parties frequently have been waving is accessibility, or the perceived lack thereof, or the problems with different scenarios of implementing it. One of the voices I’d see the most was John Foliot, who’s graced this comic a couple times now. I’ve even been lucky enough to have him provide me with a technique for making an accessible summary of a comic for this site. I have not yet implemented that technique. How much do I suck? After today’s comic, I will be doing so. …

And indeed, in his following #35: The HTML5 Super Friendscomic, Kyle Weems added to the picture the following attribute:

alt=”Comic” aria-describedby=”ariaLink” longdesc=”http://www.cssquirrel.com/comicscripts/script35.htm”

Screen readers used by blind people voice this attribute as “Link to a transcript of this comic.” Non-blind people who do not have a screen reader do not get the link  (unless they look at the source code of the page, as I did to retrieve the attribute and URL of the transcript). This is logical: “The HTML5 Super Friends” is primarily a visual work so non-blind people should primarily use it visually.

Infographics for learning?

Discussing hate infographics like the Swiss “black sheep” with students may increase their wariness towards this kind of communication. However, creative activities in visual communication are likely to work better. The same obtains for obnoxious, gutter-press-styled infographics like  “10 Staggering Facts about Education in America.” Thus, while infographics  that  summarize the main points of a verbal essay, like the “Accessibility bicycle,” can be a great learning aid, students will probably learn even more by producing their own visualizations of verbal texts. And vice-versa, students might learn a lot by producing verbal descriptions of visualizations, as Kyle Weems did in http://www.cssquirrel.com/comicscripts/script35.htm for his #35: The HTML5 Super Friends comic. Anyone game to produce such a verbal description for his #34: Squirrel in the Dark comic? Here it is:

From http://cssquirrel.com/comic/?comic=34 . © 2009-2011 Kyle Weems. All rights reserved. Reproduced by kind permission of the Author.

Filed under: Accessibility, Multimedia | Tagged: accessibility bicycle, Bob Ross, comics, CSSquirrel, Dan Martell, Dave Gray, DegreeSearch, Education, FlowTown, Gray, hate, infographic, infography, Kyle Weems, Luca Mascaro, Martell, Mascaro, propaganda, Ross, UDC, University of British Columbia, Vigousse, Weems |