Posts Tagged ‘scrolling’

Whatever happened to fluid design?

Monday, July 5th, 2010

I was intrigued by this Firefox heat map (which I came across via @smashingmag), showing which parts of the Firefox chrome users interact with most.

In particular, I was surprised by how much the horizontal scrollbar is used, with almost half of all users (and more than half of the Linux users) using it at some point during the study. I was also intrigued by why OS X users use the scrollbar so much less than Linux and Windows users. Darren suggested it might be because Mac laptops have had multi-touch gestures for horizontal scrolling for a few years now, which seems plausible—could also explain why Linux users made the most use of the scrollbars, as Linux touchpad drivers aren’t always as full-featured as their proprietary counterparts.

Anyway, it prompted this little rant about fluid design (aka liquid layout). This always used to be one of the number one considerations for good web page design. Horizontal scrolling in particular was meant to be avoided wherever possible, as it’s both physically more demanding (at least with a mouse or keyboard—less so with touchpad or touchscreen gesture) and more disruptive to task flow than vertical scrolling.

With web pages more likely to be viewed in a wider range of window sizes and screen resolutions than ever before, this tenet seems like it should be more important now than ever. Of course, the sorts of things we do on the web today are somewhat different from what we did ten years ago, and fluid design isn’t always possible or desirable for all of them. Nonetheless, many of the fixed width designs you see these days are just annoyingly unnecessary.

Sometimes it’s because designers or their clients are unwilling to have their pixel-perfect vision compromised by users deigning to view it into a smaller window than they’ve designed it for. Sometimes it’s down to inflexible or poorly-customized web content management systems, sometimes it’s inexperience, sometimes just laziness.

Anyway, next time you’re designing a website, just think about how and where people might actually want to use it. And bear in mind that grumpy old men like me won’t visit it very often if you make us scroll horizontally even just to see to all the navigation links across the top of your homepage, merely because we choose not to fill our entire screen with your website.

Incidentally, none of this is directed at the gnome.org websites, which generally resize in a very sane fashion. So kudos to our designers for doing it right :)