Search Engine Optimization, SEO for Infographics
Information graphics are one of our favorite ways to convey the big picture for complex ideas. A question on Quora was the inspriation for thinking of how to SEO the complex data maps. Social Media will probably drive more traffic over the life of the graphic, if the content is good. SEO is a valuable tool though, if the graphic is important for decision makers, shoppers etc. or entering any longstanding discussion about a topic- search is going to be a key driver of traffic. Leaving social and content optimizations aside from this particular conversation- they are necessary, but only confuse the conversation of SEO strategy here.
The basics of on-page SEO
1) A clear title tag focused on the keywords and contents of the graphic. Like any content page, get your title tag and meta data on point and focused for the audience you are persuing.
2) A clear H1 that reflects the title tag in prominent text on the page with the infographic. Following this H1 should be the same focused content in the form of some body content. This h1 and body content should be as early in the HTML as possible regardless of onscreen placement. As for the placement, the content should not be obfuscated in anyway.
Your Infographic
There is a range of how an infographic could be implemented- there are a few different implementations for infographics across the web right now:
1) A Static Image
Static images are important for ensuring a widely accessible experience for the infographic. Even if you aren't trying to offer a static image as the main experience, you ensure that mobile gets something even if it isn't the whole experience, that there is an image that appears with the page when its shared on facebook. Additionally you can apply your typical accessible alt text and topic centric file name here to for inclusion in things like google image search and one box results.
2) Plugin Based Interactive Graphic (Flash, Java etc)
As noted above- the first optimization should be offering that alternate, static image experience for all the basic reasons above. Google has said that it does crawl flash for content, but the performance of this vs traditional HTML content has not been proven to be competitive. I would recommend focusing on getting the above pieces in place and optimized for SEO and then use other marketing and social tools to build traffic.
3) HTML Interactive or Rendered Graphic
This option offers the most SEO opportunities, and is probably the least understood as to how a search engine spider might crawl and interpret your information. Engadget has the simplest form of this in its story activity graphic in the sidebar, and NYTimes often features hybrid pieces that indicate where it may be going.
The opportunities here are lie in writing the most semantic markup possible. We want to to create our graphic using the best html elements to represent the type of content we are presenting. A good example is using li tags for things like map points. If those points link out to another page, you are building a natural list of links that would be accessible even if they were presented without javascript or css. Within things like legends and descriptions, it is important to use your header tags as needed to convey the appropriate heiarchy of content.
If these elements are manipulated by different controls, you may want to look for opportunities to avoid things like AJAX calls to load data and instead load the majority of the content up front on the page. For popup information, make sure it will work if javascript is turned off. If each popup is a small independent page with proper title tag, h1 and body copy representing the data it is conveying- you have built a nice index of database driven SEO friendly pages.
Navigating the Database
Most information graphics are representations of large data sets. Taking the opportunity to represent that data in a simple tree structure of HTML pages is a great way to offer an alternative experience and expose your data for the search engine.
What I am attempting to describe comes down to a marriage of the type of information that is being presented with the most natural representation of it in hyper text as possible. Thinking about it in terms of 'Navigating the Database' is an easy way to philosophically approach representing your graphic's information. Creating a natural, text and image experience that conveys as much of that data as possible will open up the visibility opportunities