10 best practices for horizontal web design

Some people don’t care for rules when it comes to usability, and with good reason. Not all sites are equal, and more importantly, not all audiences are the same. What’s right for a 15 year old might be very wrong for a 70 year old.

Personally I believe in a hybrid approach, whereby some of the fundamentals of web design should be set in stone, and adhered to. After that, it’s a horses for courses approach, where recommendations trump rules, which are in any case there to be challenged. Apart from white text on a white background of course. That would be stupid.

One of those rules that I would have until very recently placed in my top 25 usability fundamentals would be to avoid horizontal scrolling, at all costs. However, there seems to be a growing trend towards horizontal web design.

What we’re talking about here isn’t so much a problem where web designers have opted for fixed width layouts that are too wide for most people’s screens, but where sites have been designed to specifically provide a horizontal experience for users.

Horizontal design can work well in a number of circumstances. I have seen this approach used best for gallery sites, portfolio sites and – occasionally – for ultra niche retailers.

The control issue

There is a problem with horizontal sites, and it's to do with navigation and movement. In the same way that we do not always use the vertical scroller to navigate vertical websites, we do not want to be limited to hovering over fiddly horizontal scrollbars to move through a horizontal website.

For vertical sites I use the spacebar (which acts as ‘page down’) and the arrow keys more than I use the vertical scrollbar. The latter works (poorly) for horizontal sites, but the spacebar is redundant. On top of these controls we use on-page navigation aids to move around websites, and we use the mouse scroller. There are also page up and page down buttons to factor in. And no doubt a bunch of others that I don't personally use.

So at this point it is worth remembering Steve Krug’s ‘Don’t Make Me Think’ mantra. I'm normally forced to think each time I visit a horizontal website. Before figuring out whether or not it is a good idea to reinvent the wheel it is worth considering whether or not you actually need a horizontal website. I mean, do you? Really? While I admire anybody who wants to step away from the flock, the user experience should not be compromised on the basis of simply wanting to do something different.

What can you do?

Many horizontal websites simply rely on the browser’s scroller. In my world this sucks. But what’s worse is to kill the browser’s scroller altogether (as many do), leaving the user to figure out exactly how to use a website. That sucks even more, especially when the navigation controls appear are also AWOL. We're all cognitive misers, remember, and we won't jump through too many hoops.

Read More Article...