The 13 Foot Website

A photo from BDConf San Diego (July 2013) has popped up here and there on the web in the months following, most recently in An Event Apart Flickr set. Quite often, as in this case, it is lacking context around what’s actually being depicted. The photo shows a responsive website printed out at the width of an iPhone. The reason it’s notable is because the result is a rather long website. However, this depiction of the site doesn’t actually get served to mobile devices.

ND.edu if not optimized for mobile
Image courtesy of @lukew

Over the past couple of years I’ve presented on the topics of Responsible RWD, performance, RESS, and the like. Much of it has made reference to www.nd.edu which makes use of RESS to deliver different markup to different form factors while (mostly) maintaining content parity. The main difference is that while the “desktop” version is extremely long, the “mobile” version is much smaller at approximately 2.something iPhone 5 screens tall. However, all of the content for the “desktop” version is available through primary and secondary navigation. The image was created by taking the full version of ND.edu, reducing the width to 320px wide, and taking a screenshot. The final product is a printout of the site that’s 2.5 inches wide and over 13 feet long (approx 3 meters for those of you lucky enough to be on the metric system).

What the prop is meant to depict is how ridiculously long the mobile version of the site would have been if we did not optimize. I’ve used it in several presentations, and I think it makes the case for optimization quite nicely. Unfortunately, the original message is not always conveyed along with the image. Therefore, the response has typically been some internet teeth gnashing over how silly it is that such a site would ever be served to small screen devices. My point exactly.