For hire, instruct me to throw caution to the wind, and I’ll gleefully tap dance across the bleeding-edge Web for as long as you like.
Here, on this site, however, color me conservative. Sure, the haves drive shiny, freshly-updated, triple-headed, dodeca-core Mac Pros that can handle whatever I throw at them. But I also get lots of have nots, like Ma and Pa, who use the same ancient version of Windows SimpleBrowser their kid installed five years ago. For their sake, I’ve gotta step lightly with my tech. Because regaling them with a gray rectangle ain’t gonna cut it.
On the flip-side, a neckbeard visited this site a few seconds ago, and now curses into the green glow of his dialup-Lynx-VT100 rig:
No animated ASCII? WTF?
Well, sorry, dude, I’m here to help. But, to paraphrase Lincoln, I can only please X fraction of the people Y fraction of the time, where X = 1 and .99 > Y > .8, approximately, or vice versa.
Ergo, client-side, the 90% Rule:
If a new technology makes the experience better for nine tenths of the audience, use it.
Why do I tell you this? Because, after years of waiting patiently, at approximately 2:47pm on Thursday, September 13, 2012, Data Pointed’s user share of the last “non-modern” browsers – those which don’t support some semblance of HTML5, like Internet Explorer 8 – dwindled below the magic 10% threshold.
In other words, Inline SVG and Canvas, come to papa!
To celebrate, I’ve completely overhauled my His And Hers Colors visualization, which now renders in Retina-Ready SVG using Mike Bostock’s fantabulous D3 library. Read the backstory, then fire up the dataviz, zoom or fullscreen to taste, and mouse/tap each circle to see its color name and gender preference. And, don’t miss the new buttons along the bottom, which sort left-to-right by hue, saturation, popularity, and more.
All in all, that’s 2,000 circles and radial gradients. They sing in Chrome, dance happily on IE9+ and Mac Safari, but trigger some serious Firefox rendering sludge, and spin the iPhone/iPad’s tiny embedded hamster wheel to terminal velocity. When the viz detects the “slow” browsers, it degrades gracefully, drops the fancy transitions, and displays at lower quality to improve the viewing experience.
Please give it a whirl, tweet me your feedback, and stay tuned for more HTML5 hijinks, coming soon.