Skip to main content

How To Host An Infographic (HTML Fallback)

Published by Michael Spellacy (Spell) on

This is the text based fallback version of our infographic. Some infographics can be very design heavy, so fallbacks are meant to simply convey the same information locked within them, to assistive technology users and search engines.

Infographic Hosting 101

An infographic on how to host infographics. By Michael "Spell" Spellacy

  1. One Image

    You only need one graphic. The primary purpose of an infographic is to be shared, especially across social networks. Having multiple versions of them, one for mobile and one for desktop, works against you. Use one and simply allow it to scale cross-device.

  2. Sharing

    On your webpage, set it as an inline image and not as a CSS background image. We want to allow users to download or share the graphic. Don't forget the alternative text on the graphic!

  3. Linking

    Link the graphic back to itself. We can give the user another chance to access it. This is especially helpful on mobile, as it allows for greater precision to view and is another opportunity to share a direct link out to social media, too!

  4. Accessibility

    It is strongly suggested that a text equivalent of the content in the infographic be provided and called out on the web page that is housing the infographic. You can simply link to this content. This is not only great for accessibility, but for SEO, too!

  5. Source

    It is good form to cite the original URL within the graphic itself. Should a user wish to return to the original source, then you are covered. It also allows disabled users to access the HTML version as well, should they need it.

Source: https://bit.ly/2Ho4v3i

View Infographic Image