Web Horizontal Layout

After a gap of some time away, it's time for another horizontally scrolling site for an artist's residency.

I've just started work on a quick, small site for Jackie who needs something for her residency at Pontypridd railway station. The site just needs to provide an online diary and some brief background information. So Jackie can update the diary quickly and easily I've decided to make her a RapidWeaver template.

It's been three years since I last worked on a horizontal layout for the Digest project and obviously the memories have faded enough for me to start work on another.

I do like the way the horizontal layout forces the content to be broken up into small, neat chunks and reading large amounts of text appears easier. A reader doesn't 'loose their place' quite so many times.

There are plenty of reasons not to use a horizontal layout:

  • Not many sites are designed in this way and the user could become confused or not notice the horizontal scroll bars at the bottom of the window.
  • Web browser support for content to the right of the viewport is lacking. Browsers will happily scroll the page vertically to follow a fragment link but many do not alter the horizontal scroll position.
  • Using CSS to position elements on the page is particularly irksome for this layout. All the content columns need a parent container with a fixed width to force the browser to extend the right side of the box past the window's edge. As the content varies from page to page, Javascript is needed to adjust the width of the page after it has loaded.

My head is telling me to stay well away from this layout but my heart is telling me to persevere and continue. I think it's too late now anyway.

|

odds&ends…
Benjamin Miller