One of my favorite parts about Luke Wroblewski’s workshop at this year’s An Event Apart conference in San Francisco was the demonstration of some of his recent work with Windows 8. Specifically, Microsoft’s new “Snap” feature which allows users to place one app on the side of the screen where it will continue to run, while you continue doing something else within the main part of your screen. “Great, Chris,” you may be saying to yourself. “You’ve just described Windows 3.1.” And while it is true multitasking is nothing new to the world of personal computing, Luke’s discussion of the Snap feature interested me in relation to something even older than Windows 3.1: The Television.

The Xbox One, Microsoft’s latest video game console, runs on a Windows 8 kernel. It ships with Internet Explorer 10, has the Snap feature built into its user interface, and is powered by an x86 CPU. For all intents and purposes it is a modern PC, albeit one viewed from 10 feet away on a massive HD television screen.

Consider for a moment a real-world use case of Snap on the Xbox One: A user opens Internet Explorer 10 and visits her favorite responsive-enabled website on her 42” HDTV. Assuming she is using a 1080p television, the browser will report her viewport as 1920px wide and serve up the site’s respective breakpoint.

She browses the website for a bit but then decides she wants to watch some Netflix as well. The Xbox One user “Snaps” IE10 to the side of her screen, effectively changing the browser’s viewport to 320px wide (per the feature’s spec), thus triggering the website’s “mobile” breakpoint. Meanwhile the main part of her screen is now watching the best movie ever made, Star Wars.

“That’s great! Responsive Design FTW!,” right?

It is true IE10 is now correctly displaying the “mobile” breakpoint on the Xbox One user’s screen; our media queries worked as expected. But there is a problem: Our Xbox One user is sitting on a couch 10 feet away from the television. The mobile breakpoint she is now observing was designed for small screen devices such as a smartphone which are typically held only 1 foot away from the user’s face. Our “mobile” breakpoint is now too small to read in relation to our user’s posture.

There are other things to take into consideration with responsive content consumed on a television as well. For instance, ensuring color contrast for easy reading at large distances, or the use of a d-pad (digital pad) that is typical among video game consoles and moves in up-down-left-right movements as opposed to touch (smartphone) or point (mouse).

So how, as web developers, do we account for this? At the moment, there is no way to accurately test if a user is on a television without some form of user agent detection. CSS2 introduced the media type media query which was intended to convey whether a browser was a “screen” or “handheld” or “projection,” etc. But over time, web developers began to report everything as “screen,” and this form of media query eventually lost relevance.

So what does Luke, our workshop presenter, think?

“Ultimately trying to cover all input types and all user postures in a single interface is a daunting challenge. It’s hard enough to cover all the screen sizes and resolutions out there. Couple that with the fact that an interface that tries to be all things to all devices might ultimately not do a good job for any situation. So while I embrace supporting the diversity of the Web as much as possible, I worry there’s a limit to the practicality of this approach long-term as the amount of possible inputs, outputs, and user postures continues to grow.”

Ah, so much like The Web as a whole then: a work in progress.

Of course, this trend will continue as more and more screens become online-enabled. We see this already with the new Google Glass eyewear, which creates a perceived effect of an HD picture that is projected 8 feet in front of the user, but with a display viewport (as of this writing) of 640px wide. In fact, wearable tech appears to be quite the burgeoning frontier, with rumors of an Apple-branded “iWatch” consistently making the proverbial rounds.

Luke has much more to say about multiple screens, user postures, and “Snap,” in his excellent blog post, “Responsive Web Design: Relying Too Much on Screen Size.” Please enjoy on whatever device, web-connected pajamas, or HD Barcalounger you desire.