Monday, 26 December 2011

By choosing images over links, and by restricting markup, Facebook, Twitter and Google+ are hostile to HTML. This is leading to the plague of infographics crowding out text, and of video used to convey minimal information.

The rise of so-called infographics has been out of control this year, though the term was unknown a couple of years ago. I attribute this to the favourable presentation that image links get within Facebook, followed by Twitter and Google plus, and of course though other referral sites like Reddit. By showing a preview of the image, the item is given extra weight over a textual link; indeed even for a url link, Facebook and G+ will show an image preview by default.

Before this, in the blogging age, there was a weight given to prose pieces, and Facebook and Google preserve some of this, but the expressiveness of HTML through linking, quoting, using images inline, changing font weight and so on, is filtered out by the crude editing tools they make available.

Feeds and feed readers started out this way too, but rapidly gained the ability to include HTML markup. Twitter went back to the beginning, and added the extra constrain of 140 characters because of it's initial SMS focus. Now it is painfully reinventing markup, though the gigantic envelope and wrapper of metadata that accompanies every tweet. This now has an edit list for entities pointing into it, and instructions for how to parse this to regain the author's intent is part of the overhead of working with their API.

Image links, however — at least those from recognised partners — are given privileged treatment. Facebook and Google have emulated this too, leading to the 'trite quote as image' trope. The spillover of this to news organisations became complete this year, with blogs and newspapers falling over themselves to link to often-tendentious information presented in all-caps and crude histogram form.

So here's my plea for 2012: Twitter, Facebook, Google+: please provide equal space for HTML. And for authors and designers everywhere, stop making giant bitmaps when well-written text with charts that are worth the bytes spent on them could convey your message better.

49 comments:

Wow, now that's bizarre. I went straight from the summary on Facebook to the comment section without reading that you'd already said everything I was going to say in my comment in the bulk of your post.

As a web accessibility specialist, I am most concerned that the conveyance of "reliable communication" via images alone effectively shuts out a significant segment of the on-line community: those who cannot see those pretty infographics which are rarely if ever accompanied with the equivalent text (and no, @alt is not going to cut it).

Meanwhile, a significant segment of the standardista community is actively seeking to eliminate accommodation mechanisms (a.k.a. the obsolete @longdesc folks) - often with the response that authors should include the textual equivalent of these complex images on the same page. Yet as we see here, this is simply not happening.

This is not to suggest that retaining @longdesc will solve the problem - authors still need to invest the time and effort to actually supply the longer text, but mechanisms such as @longdesc at least provide a means of linking textual equivalents to the infographic (thus accommodating both the non-sighted as well as the "semantic web" requirements that are currently being lost) while still preserving the visual info-bite requirements that are driving this current trend.

Don: the problem is that innovative, dynamic visualisations will get previews that are text striped of styling if they are done in HTML, but a much bigger visual image if they are made as a static, giant .pngTom: similarly with your 'page full of text'; if layout is stripped that is all you'll get.GME: input sanitization is a reasonable well-understood problem.Have a look at Caja for a mature, resilient answer.

johnfoliot: Accessibility is another key point; it used to be that indexability by Google was important enough that pure image content was deterred, whereas this trend is having the opposite effect. (I also realized that I omitted useful al text in the images in this post; corrected that now)

As i mentioned on Twitter there are two major reasons I see them not implementing HTML embedding.

1) Security. Yes, of course there are ways around this, but there are *always* ways around those security patches. If there wasn't, Caja wouldn't *still* be in active development. Having to handle security just so people can make text big red and blinking is far less a priority. Also, Caja as you mentioned needs SVN and Java. That's an immediate turn off for many, many engineers making these large sites. Most of these new big sites use things like Rails, Python, and now Node/JS.

2) The other, probably bigger reason, people don't want to learn HTML to embed content. My mom, grandma, high school friends, etc, don't want to know <a href="http://url.com"><img src="http://url.com/img.jpg"></a> to just make an image. They'd much rather copy and paste a link. Simpler is better. This has been shown again, and again with consumer sites (and even enterprise now). Or to embed a YouTube video they want to copy and paste a link that generates the embed code. Same with all media. I think you have an engineers view and you're forgetting the majority of people.

3. Shorter reason, I personally don't want to see crap like <h1 style="color:red;text-style:blink">CLICK THIS LINK BELOW</h1>. That's annoying. I follow social media sites and people for the social aspects, I do not follow them so I can see Myspace style Twitter. Twitter also was meant to be a short message type network, why would you want graphs and marquees going on in your twitter stream.

"And for authors and designers everywhere, stop making giant bitmaps when well-written text with charts that are worth the bytes spent on them could convey your message better."

... and eat your vegetables too!

Kevin,A rose by any other name would smell as sweet. Communication through graphics (or video) has the same utility that the written word has, the transference of knowledge.

You seem to be arguing that to communicate with pictures is puerile therefore web services should prioritize accordingly when point in fact that strength of the web has always been its dynamism with regard to how information is presented and consumed.

Love the intentional irony of the rage comic (though I admit I had click the explanation to make sure it was intentional). Also appreciate you shedding light on something that I formerly took for granted regarding infographics vs HTML. Thanks for the thought provoking piece!

The article is right on the mark. It’s been bugging me for a while now that every other link I click on is an image containing… text and nothing else.

As for infographics, I find that most of them hinder more than they help, so I skip any such links I see. (Mind you, I’m not the sort of person who believes images are evil or anything like that. I just haven’t seen many genuinely useful infographics.)

Bookzer: I din't say this was trivial, I was noting a pattern. to respond to your points:1. If embedding iframes is so bad, how come Facebook gets everyone to do that for it's like buttons on their sites? Twitter embeds end up injecting them via JS too.2. is irrelevant. the cases I'm talking about have UX to embed previews already, and youtube's copyable embed tags are a good counterexample.3. the richer embedding is arguably how mySpace outcompeted the earlier SNS's; Facebook and Twitter found different paths. There's room for compromise.

Jeff Nolan: fair point. Perhaps I should have been less extreme and said to think about what the right mode is, not pick one reflexively. I love good visualisations; I own all the Tufte books, but so many of the infographics are nothing of the kind.

Hello Kevin,I find it ironic that you post an infographic (from google , showing the increase in use of the term "infographic") in a post saying how evil they are.

But maybe the word has started to cheapen, and yes, if an infographic is just somebody's wank in illustrator, I agree such images are very irritating, but there is always a place for well-made tables, figures, charts and other data-driven visualisations. I regard these as infographics too!

Who cares about HTML. I certainly wouldn't give any weight to it. Images are links. But I think the author is trying to say two things.

1. A link with a text label should give the contextual text a greater weight

2. A link to textual content should have greater weight than a link to an image.

Ignoring the fact that "weight" is not giving to the link -- the link gives weight to it's destination - - both arguments are flawed.

1. Images can have text labels. These can provide useful semantic information or be completely bogus. So you can't give too much credence to it.

2. Almost all images that are provided in link (especially of the lolcats variety) are actually links to HTML and the image is embedded as an additional link within the HTML. All images are in fact links -- well, not exactly, but they're separate HTTP requests, which is what you mean when you say "follow a link".

I understand what the author is trying to get at, which is that textual information is more easily categorized than an image, and text embedded in an image (a la lolcats) is too difficult to get contextual information out of. In theory you could use OCR but it's not practical.

You could use meta semantic markup, but like link text, it can't be trusted.

Now there may be some weighting done if the text of a link such Aaron's blog matches the content of the destination some higher weighting could be given to it, but that's also easy to fake, because I could put bogus content on the destination with a font that matches the background and have my SPAM page content clearly displayed (perhaps in an image so a search engine couldn't detect that it wasn't relevant.)

About Me

Kevin Marks works on IndieWeb and open web tech. From 2011 to 2013 he was VP of Open Cloud Standards at Salesforce. From 2009 to 2010 he was VP of Web Services at BT. From 2007 to 2009, he worked at Google on OpenSocial. From 2003 to 2007 he was Principal Engineer at Technorati responsible for the spiders that make sense of the web and track millions of blogs daily. He has been inventing and innovating for over 25 years in emerging technologies where people, media and computers meet. Before joining Technorati, Kevin spent 5 years in the QuickTime Engineering team at Apple, building video capture and live streaming into OS X. He was a founder of The Multimedia Corporation in the UK, where he served as Production Manager and Executive Producer, shipping million-selling products and winning International awards. He has a Masters degree in Physics from Cambridge University and is a BBC-qualified Video Engineer. One of the driving forces behind microformats.org, he regularly speaks at conferences and symposia on emergent net technologies and their cultural impact.