Viewport width: Size matters, but not in the way you’d expect

Brian Dillard, Wednesday, December 26, 2007 @ 5:51 pm

When a company gears up to redesign its website, the question of screen resolution always seems to eat up tons of time and energy. Despite the long, slow evolution of the browser from a publishing medium to an application platform, many developers still think in terms of "web pages" - large units that require, if not fixed dimensions, then at least a fairly defined range of viewport mins and maxes. Rather than thinking of the browser window as an operating system full of work spaces, palettes and menus, we think of it in print terms, like a newspaper page full of columns and sidebars. This occurs despite a decade of education to the contrary from any number of software and visual design experts.

The advent of large, widescreen displays encourages us to target wider and wider "average" viewports. The question gets framed as "how wide can we go?" rather than "how narrow?" Smart phones and other portable devices cram full-featured browsers into much smaller resolutions. Yet we continue to base our assumptions about viewport layout on ever-expanding new PC screens.

This bums me out not only because it renders the resulting sites ugly and difficult to use in many situations, but also because the perceived advantages are so illusory. Larger horizontal dimensions encourage columns of text so wide that they're difficult to read; a profusion of sidebars and widgets that increase complexity while reducing usability; and the continuing pursuit of a more-is-more design aesthetic. We don't know how to get our users to the content and functionality they actually want, so we try to cram more and more little boxes above the fold in the widest space we can possibly justify.

Look at the web interfaces that really work:

• the humble blog, with its narrow, scrolling text column and unobtrusive sidebar.
• the RSS feed, which strips away all distractions to present content in simple, 1995-era HTML.
• Facebook, which strips away the MySpace clutter like a parent looting a teenager's messy bedroom with a garbage bag.
• the Google results page, with its much-dissected minimalist elegance.
• the classic Orbitz flight matrix, with its plain-jane data grid.

Instead of asking ourselves how much more we can do on each page, and how many assumptions we can make about our users to enable it, we should ask ourselves how far we can pare down our interfaces so there's a confluence of form and function on every screen. It doesn't matter whether you're serving up basic content or complex Ajax functionality. Let's make 2008 the year simplicity wins out on the design front.

Technorati Tags

• user experience design

agile ajax

Comments: 1 so far

• Leave a comment
• Comment feed for this post
• TrackBack URL

1. 

   Good post. As someone who is both a web developer and as someone who has just joined the iPhone generation, developing for different size screens is suddenly very interesting. Even with the iPhone’s amazing Safari browser capabilities, it is easy to see how doing small things in terms of browser-specific CSS (mobile media) could make HUGE differences in the experience.

   Comment by Ben Nadel, Thursday, December 27, 2007 @ 8:39 am

Leave a comment