Tip:
Highlight text to annotate it
X
I am Rachel. What I do with the team, I do a lot of stuff with Georgia.gov. I work
on the website and do a lot of stuff with the blogs, I write blogs and organize guest
blogs. I know I have talked with a few of you getting your content on our website. I
also do the social media for Georgia.gov. We have a Facebook and a Twitter page. We
recently acquired access to the State of Georgia LinkedIn page, so for the past couple weeks
we’ve been doing that as well. And I also do infographics. We published our first infographic
on the Georgia.gov blog last October. We’ve created ten since, and put them on the blog
and on the social media. And that’s what I will be talking about.
Okay, so this is The What, Why, and How of Infographics. The what: We’re going to start
with a little history. There are a lot of definitions for infographics. People kind
of think of them in different ways, but this is the one that I think best represents what
I am talking about. Marcus Smiciklas is a designer and a digital strategist, and this
is his definition: “It’s a visualization of data or ideas that tries to convey complex
information to an audience, in a manner that can be quickly consumed and easily understood.”
Okay, so it just takes the content, it takes the ideas and makes them visual, and makes
it easier to understand. And so you will see that it says data and it says ideas, so it
doesn’t just have to be data visualization, it can also be text and other things along
those lines. Okay, go back in history to the cave paintings,
of 30 thousand B.C. We don’t know exactly why they were created, but one pretty strong
theory is that it was to communicate. And, they would paint these animals on the cave
walls to show where you would hunt, pretty much. That’s a form of communication. Zooming
way forward to the 1850s, Florence Nightingale was a British nurse during the war, and she
started collecting data of how soldiers were dying during the war. She actually found that
it wasn’t because of the war exactly, a lot of the people were dying because of poor
living conditions and poor health care. And, this was something that she was able to visualize
in this kind of funky little pie chart, and she used this to present to Parliament, and
actually they made a lot of changes to how health care was handled during the war, and
saved a lot of lives. So, infographics save lives.
In 1972, we had the Munich Olympics, and Otl Aicher is a designer who created these icons
of the sports. The Olympics, of course there are lots of people from different countries,
they don’t all speak the same language, and they still need to find where to go to
watch the game that they want to see. And so this designer created all of these icons
to cross that barrier. And then of course more recently, infographics have just exploded.
They are all over Pinterest, there are infographic directories that are specifically for infographics
you can search by topic and all that kind of stuff, and social media.
Why do we use infographics? Why should we even care? If you try and find why on the
internet, this is the statistic that will pop up all over the place: “65% of people
are visual learners” is what it says. That’s based on the idea that there are types of
learning based on different senses. So, visual, auditory, and kinesthetic. This is not necessarily
true. A lot of psychologists disagree about it. But one thing that they do agree on, is
that there are different types of learning. Whether it is by senses or whether it is by
something else, people learn in different ways. And so infographics cover a lot of these
different ways, by providing information visually and with words.
Okay, so I am going to do a test, and I need some audience participation. We will see how
words compare to icons. A word is going to flash on the screen, just real quick, and
I want you to see if you can read it. And then afterward I will flash an icon, and you
can kind of compare which one is easier to understand. We are going to do this twice,
the first one might not be too difficult. So...
Everyone catch that?
- Mm hmm - Okay, so that’s the icon that goes with it.
Okay, then what happens when an image can’t be represented in just one word?
[laughs]
A little more difficult, right? Okay, so we’ll try an icon…
And that’s a little easier.
Basically the idea is, imagery does help. It takes .15 seconds to process a symbol,
.1 second to attach meaning to it, so those images and text that were on the screen, they
flashed up for about a tenth on a second. And we could all see that the image was easier
to understand than the word. It also helps with recognition and recall.
Recognition is being able to understand what you’re seeing. Recall is being able to remember
it later. Studies show that images, you can remember them better than just reading text.
And it’s also the universal language. This goes back to the idea of the Olympics, that
images can help cross those barriers where text can’t otherwise. Which is really important,
because 13.4% of Georgians speak a non-English language at home. We need to be able to reach
those people, just as well as anybody who does speak English.
Another reason why, “sharing is caring” so people like to share what they learn on
social media. And infographics are very easy to share on social media, and so they will
do that. That will help your SEO, people will get back to your website through those infographics.
Here’s a case study from Georiga.gov, this is a blog that we posted about a year ago
about becoming a foster parent in Georgia. Our Google Analytics show that it’s a pretty
average blog. We got 455 views in the first two weeks. The highest number on one day was
74. And on Facebook, it also did reasonably well. It got 4 likes and comments. It’s
pretty average, nothing spectacular, but that’s pretty normal for our blogs on social media.
And then, just last month, we published this infographic about adoption. It’s a very
similar topic, the same types of people would want to be looking at it. Google Analytics
show that in the first two weeks we got 590 views, with a top of 215, and that was the
day that it was posted on Facebook. These are the highest numbers that we’ve ever
seen on our social media. It got almost 40,000 views, with 834 reactions and comments. This
just blew us away. It was amazing that this content could reach so many people, and so
many people were responding to it.
And 44% of adults get news on Facebook.
[laughter] Now read carefully, it does not say they get
all of their news on Facebook, so before you have a heart attack… But yes, this does
just goes with the idea that they are not going to be coming to your website. They don’t
go searching for your website to find out what is going on in this agency. They want
it to come to them. If they’re already on Facebook and we can bring this information
to them in a way that is easy to understand, then they’re going to look at it.
Okay, how do we do infographics? There are a few steps that I’ve outlined: establishing
goals, brainstorming and researching your content, organizing content, and then the
design. I'll go over each of these.
Nothing can stop you from reaching your goals. False. Goalies. Thank you, Dwight.
[laughter]
You want to establish your goals. Some things that we came up with that
we wanted to accomplish with our infographics is to make information easier to understand.
This of course goes along with the why, that I was covering earlier. It makes it a lot
more accessible, a lot easier. And it also increases our reach. It spreads a lot faster
than just a text webpage would. You will need to brainstorm and research your
content. Content is king, it is what’s most important. Even if you have a beautiful infographic
and has all these nice little characters and little icons on it, no one’s going to care
if it doesn’t have good content, if they don’t want to know what you’re trying
to say. A few things that you can try, try evergreen
topics. These are what last over time, things that are not tied to a specific event, so
that way people will be coming back to it. A few areas you can look at include data,
comparisons, you can have a timeline, or quick facts. So just brainstorm with your team and
come up with what type of content that is already available, that you already have,
that you would like to turn into an infographic. Then you need to organize your content. Don’t
be like Michael Scott. Just starting, and let’s see what happens. Not really a great
practice. Here’s where you figure out exactly what you’re going to include. I always start
my infographics with just a very brief sketch. So this shows an outline of where I’m going
to go with it. Here it is a little closer up, you can see that it has different sections.
This is the adoption infographic again, I have different sections in there so I know
what I want to include. I don’t actually include all of the body copy in there. When
you’re figuring this out, use storytelling skills. You can come up with your content
like how you would be writing a blog, just include a beginning, a middle, and an end.
Introduce your topic. I did this here with a definition of adoption, and the numbers,
like who is involved. Middle, that’s where you really get into the bulk of it. And then
an ending. I like to include resources at the bottom, that they can go to learn more.
Include a context and sequence of events. This just lets them know that it’s a story,
but there’s something coming next and they want to find out what it is.
Then you need to actually design it. So, you have all this content, and we’ll put it
together now. Here’s some tools that you can use. I always work in Illustrator, the
Adobe program. And you can also use Photoshop. And then there are free versions of those
online, Inkscape and Gimp. If you’re just looking for a data visualization,
you can even use Microsoft Excel. That gives you some graphs and pie charts and all that.
DKAN, we talked about this earlier, Nikhil talked about it, they are a data visualization
platform that’s available through us. So if you’re interested in that, you can put
in a ticket with us. And then, there are a few online resources
for creating infographics. Visual.ly, Venngage, easel.ly, Infogr.am. These are all infographic
creation tools that you can get online. A lot of them are partially free, you can get
so far and then you have to pay for it. But it can be a good start. I’ve even looked
on these to get inspiration just for how to organize stuff.
Then you’re going to have to put it online. We need to think about how to make it responsive,
accessible. We’ll talk about file format, how to put it on social media and how you
can repurpose it. Responsive design, we’ve talked about it
a lot with websites. It’s making sure that something looks just as good on the desktop
as it does on your little phone. With websites, of course, we do that with code. There is
even a way that some people have done that with infographics, creating it with code,
but that takes a lot of resources, it takes a lot of time, and, actually, limits the design.
Here are some best practices that we’ve been using for our blog. You want to make
sure that it is the width of the column that it will be in, when you design it. Our columns
on the platform are 740 pixels wide. And when you upload it, make sure that it’s at 100%
width and height. And that will make sure that it resizes along with your screen.
And then make sure that your text is legible. I recommend 14 point absolute minimum, 16
if you can. That just makes sure that you can still read it when it’s on your phone
without having to zoom in. We are coming up with a new infographic paragraph type. Kendra
mentioned this earlier. It will, actually, allow you to put the infographics into that
type of content. And then you’ll be able to do things like pinch and zoom on a mobile
screen, and you can still include the alternative text, which I’ll talk about in a second.
It will make sure that everything is accessible, make sure that everyone can actually gain
from your infographics. Make sure that you have high enough color
contrast, this URL right there is a contrast checker that you can use. You can put in the
hex code for the foreground and the background colors, and that will tell you if it is accessible,
if people will be able to see it easily. Also, include alternative text. You always
want to do this with images. What we use with every infographic, we’ll include this little
line, “Graphical representation of the text provided in this blog.” That means that
little picture there is your infographic, and there is a link above it, that’s a jump
link. They’ll see that and if the person can’t see or if they learn better from text,
they can click on that link, and it will jumped them below the infographic, so they can actually
just get to the text part of it. And make sure that you always include a text
version of your infographic on the same page. That way it’s accessible, it’s easier
for screeners because they have less clicks to go through, and also increases your SEO.
Okay, file format. Now that you have this beautiful infographic, you don’t want it
to just be all pixelated and blurry. That would be really sad. We discovered that SVG
is a very good file type for us. That stands for Scalable Vector Graphics, and that means
that you can resize it, and it won’t lose quality. And it’s also a very low file size,
because it’s all just code, it’s not actually the image itself.
There is a problem with SVG, if you’re interested in looking into this more, I wrote a blog
about in on our interactive site. But, basically, if you have any raster images in here, such
as this infographic I made, you can kind of see it, there's a picture in the background,
and in Google Chrome, sometimes that just wouldn’t show up if it was an SVG file,
it was very confusing. It’s just a bug that’s going on right
now, I’m sure they’ll fix it eventually. But if that happens, if you have raster images,
or if you have gradients in your graphic, then it’s best just to save it as a raster
file and optimize it, and get it as small as you can.
And you want to do that anyway for social media. When you post an infographic on social
media, just upload it as a photo. We take our infographics and split them into sections.
So you can see, this is all one long one, and then we have it in three different pieces,
and I always just copy the header and the footer into there. And post one at a time.
That way, it’s actual easier to see on social media, especially Facebook desktop, there’s
no way of zooming in, it’s just going to be as tall as your screen is, so it needs
to be short enough that the text will be legible. And then, also, this helps spread out the
lifetime of your infographic. This one, for example, we spread out over three different
weeks. We posted one piece of it each Tuesday, and the first couple they got decent response,
but the third one didn’t really well. I don’t know if that was just the timing of
it or what, but it gave it another chance to really get some attention.
And when you post on social media, if you worked with anyone on getting the content
together, just make sure that you give them credit for it. And you always want to link
back to where the full infographic is. So, probably it will be on your blog. Just put
a link in there so that they can get to it. And that, of course, brings more traffic back
to your website. On our platform, AddThis, that can be put
down at the bottom of your blogs. That screenshot at the bottom there shows what it looks like.
That’s when someone is on your blog, and they want to share it. Then there are these
easy buttons that they can click on and it will post on their social media for them,
or it will print it, or send them an email. If you’re interested in getting this added,
put it in a ticket with us, so we can get that on your website. Along with that, you
get some analytics, so you can find out where people are sharing your content. You can look
at individual pieces of content, and see how well did you do.
And then you can repurpose your infographics. For example, if you have the capability, you
can make a video out of it. With this Driving on Black Ice, this is an infographic we
worked on with GEMA back in December, after creating the infographic, the still image,
which is on our blog, then we posted these videos on social media. So it just popped
up the different pieces over time. And that is just a way to get more traffic.
And you can also -- hang on with the cat meme -- You can also revisit your content over
time, like this, we’ll probably be posting this again next December. If it’s something
that, maybe some information has changed, you can always update that. And you can still
work with the original graphics, so the bulk of the work is done, just update any information
that needs to be updated. Okay, cat meme. So if this is you, and you
don’t know what to do because you’re not a designer, maybe you don’t have a designer,
maybe you just don’t have time, what do you do? Okay, we’re here to help.
Put in a ticket with us, and I’ll work with you, and you’ll be the masters of the content,
and you can send me your content, and I’ll just visualize it. We’ll work back and forth
to make sure it’s everything that you want. We’ve done this in the past with the Senate
Press Office. They had some Twitter analytics that they wanted to visualize from during
the legislation session, because there was just a huge boom in their analytics and they
wanted to show that, show that they were making a difference, that people were using their
Twitter feed. So we worked together to come up with that. And then, again, this is the
one that I worked with GEMA last December. They provided the content, they were the experts,
and I just put it together. So, that’s pretty much it, I think we’re
going to have a Q&A now. Where we can answer any of your questions. That’s infographics.
[applause]