How to Add Interactive Features to Your Infographics - dummies

How to Add Interactive Features to Your Infographics

By Justin Beegel, MBA, The Infographic World Team

Without a doubt, interactivity is the hottest trend in infographics. The rise of online sources of news and entertainment content has made everyone curators. You choose the websites you want to visit, the links you want to click, and the information you want to share.

So, it’s only natural that when you’re given the chance to play around with your information, to dive into a sea of data and make it work for your own purposes, you love it. You don’t need to be a programmer to add interactive features; a working knowledge of Adobe Flash Player is enough to get you started.

But you can’t rest there. Even now, web-design languages like HTML and CSS are threatening to overtake Flash in the field of interactive graphic design. If you want to make sure your graphics read well on mobile devices, start working on adding HTML5, CSS3, and JavaScript to your programming language toolbox.

Interactive graphics promise a depth that an ordinary print graphic could never convey. The possibilities are endless and often fascinating to readers. Here are two ways how infographics designers are making their work more interactive.

Place information on different pages

When print media was the most common platform for infographics, the entire graphic had to be viewed as a unit. Whether the graphic took up a single column in a newspaper or a two-page spread in a magazine, design rules called for the entire graphic to be self-contained.

No more. In an online platform, you can present a simple block of information in an opening page. To move on to your next block of information, you could create a vertical design, allowing your reader to scroll down the page to move on to the new information.

Or, you could place your second block of information on an entirely new page, with a link encouraging the reader to click for more information. Add another graphic element, place it on a third page, again with a call-to-action link.

This approach may be tremendously appealing for clients who use page views to determine advertising rates and overall popularity. The downside of a click-through graphic: Your reader may not stick with you through the whole thing.

Let the reader choose

Say you created an infographic to show the percentage of the population in each U.S. state that holds a college degree. Simple, right? You probably made a map of the United States, with a percentage figure in tiny type in each state.

Interactivity allows you to take many other approaches. You could skip the numbers entirely. For example, start by color-coding your states. Perhaps states with less than 50 percent of the population having a college degree are light green; 50 to 65 percent is medium green; and 65 percent or more is a forest green.

You can then embed your data, using HTML5, so that a reader could hover the computer mouse over a single state, and see the exact percentage. You can add plenty of data this way. Perhaps you’ll break out the percentages of men and women who hold college degrees, or you could use a slider bar to change the data according to decade.