Comments on: How to make your infographics accessible and SEO friendly at the same time

By: I can haz infographicz? | Infographics For Dummies

I can haz infographicz? | Infographics For Dummies — Sun, 06 Feb 2011 15:10:23 +0000

[...] Coles raises an important point on his site in this post: How to make infographics accessible and SEO friendly at the same [...]

By: Malcolm Coles

Malcolm Coles — Tue, 25 Jan 2011 13:37:03 +0000

Do you mean put all the relevant copy on the page and then place the whole infographic image on top of it (obscuring the words unless you're a search engine / screen reader)? That does seem less work than the above method - although typical users wouldn't be able to EG copy and paste words they wanted (not that many people probably want to do this).

By: LordManley

LordManley — Tue, 25 Jan 2011 13:31:51 +0000

If you use Levin Alexander then it is scalable, mind.

The crossover between accessibility and SEO is exciting.

By: Malcolm Coles

Malcolm Coles — Tue, 25 Jan 2011 13:08:09 +0000

I didn't say it was scaleable

While you're here, what font was it - if Google fonts has it I'll use the right one ...

PS I have your book. It's brilliant.

By: David McCandless

David McCandless — Tue, 25 Jan 2011 12:53:08 +0000

Nice!

Fancy going through my site and doing that to all my images then?

By: Malcolm Coles

Malcolm Coles — Tue, 25 Jan 2011 12:42:06 +0000

Yes, I've never seen anyone use longdesc properly. Wonder if people even look out for it these days. And taking people off to a different page to read something they should be able to read on the first page seems a bit pointless to me ... And from an SEO POV having the content on a different URL to the page with the image (to which people link) also seems wrong.

By: Joanna Butler

Joanna Butler — Tue, 25 Jan 2011 12:34:21 +0000

Great advice here Malcolm! I just caught yours and @hobo_web's conversation on Twitter last night about long descriptions. Back in the day I can remember those being recommended... but you know what? Never came across a single, genuine implementation. Infographics would be a perfect case for having longdescs in theory but I'd say alt attributes and slicing images in logical ways as you demonstrated above would always be the better option anyway for accessibility. Why? For one - instant recognition for users without images - the text is right there on the page and not somewhere else forcing them to click. Secondly, even if the page renders perfectly, alt attributes work in CONTEXT for both search engines and also any users having trouble reading some fancy typography by allowing them to hover over the image to see the text (good argument for title attributes as well as alt attributes for Firefox users here!).

By: Antonio Mecca

Antonio Mecca — Tue, 25 Jan 2011 11:16:57 +0000

Good post! tank for sharing. it's an usabili concept often forgotten

By: Malcolm Coles

Malcolm Coles — Tue, 25 Jan 2011 09:51:44 +0000

Paul / LordManley / Tola: There are only some infographics you can do this too. It wouldn't work with this one: http://boxofficequant.com/sequel-map/. But most of the ones I see are pretty boxy and can be chopped up. Tola - sod what the designers think

Tola - yes, you can include a text version at the end, and I've seen a (very) few instances where sites/people do this. That would also work, though doesn't seem quite as neat to me.

Also, the idea of offering different size images is probably one you should do regardless - you often end up with some very fuzzy looking ones where some blog process / browser has resized it. I'd create high-quality originals in different sizes to enable better embedding.

But this also all applies to any form of visual representation of data, even if it's not an infographic for SEO reasons (there are other sorts, you know ...). EG go here: http://www.standardlife.co.uk/1/site/uk/pensions/getting-started/basics and click "Check out the benefits" bottom left. That visual representation is made up of words on background images.

By: Tola

Tola — Tue, 25 Jan 2011 09:42:40 +0000

As much as I think it's a decent idea I'm with Paul on this... Plus I bet a number of designer would not be too pleased at this idea..

Wouldn't the alternative be to include a text version at the end of the image which outlines most (if not all) of the actual facts and figures displayed within the image?