Subscribe to the RWT RSS Feed

RWT Webmaster Tools Blog

Resources and Tools You Can Use

 

Fixed Width Layouts are best for beginners

I recently messed around with converting this website over to a liquid layout. For the last couple of months it has been in a liquid form. While I generally liked the look and feel, there were a few problems:

1) The website was borked when viewed with an 800×600 screen resolution. This was not a major concern since only 5% of the viewers of this website use 800×600. However, it still bothered me that I would either have to redo the entire design or create a special CSS file just for that resolution (which I know some sites do).

2) General weird bonkiness. I can’t explain all of the weird stuff that would occur. It seemed an issue of control. Various pages, under certain viewing circumstances displayed weird behavior.

While the percentage of viewers was small, it still bothered me that a portion of my viewers were seeing a messed up website. And while the general weirdness was mostly minor, I dreaded the thought of tracking down each individual issue. I am not a web developer by trade. I would rather write content than fix a web design problem. So with a tweak to the CSS here and there, I switched back to a fixed width layout. I realize my CSS now contains some extraneous code. My main concern however is that it displays correctly no matter the screen resolution. yeah!

Part of the impetus to reverting back to a fixed width layout was Alex King’s series on his blog redesign. He redesigned in a fixed width layout made for the 1024×768 screen resolution. This seemed to me like a fair compromise.

It seems to me that a fixed width layout provides added levels of control over the placement of design elements. Fixed width layouts essential create a “box”. Elements are kept within the parameters of the box. The box hardly breaks (only when there is a misplaced div). It seems that a fixed width layout is the way to go for beginners since it eliminates “some” of the unruliness of cascading style sheets.

A fixed width layout designed for a 1024×768 resolution does impact 800×600 viewers. Users do have to scroll to see the whole site. However this is somewhat mitigated depending on the design. My design uses two columns to the far right. The leftmost of those columns contains my main navigational menus. The rightmost contains anciallary data and links. While the width is fixed for a 1024×768 screen, 800×600 users still see my main content and my main navigation column. They only have to scroll to see the ancillary material. Again, seems like a fair compromise.

I do think that a designer needs to consider the website’s audience. 5% of my viewers use 800×600, 45% use 1024×768 and 45% use 1280×1024. If your website sees 25% or more of its viewers using 800×600, than you should probably still base your design around that resolution. But like I said, the 1024×768 fixed width layout does offer a compromise. Just ensure your 800×600 readers dont have to scroll to see your main content.

As this is the first post in 2007, I hope that everyone had a safe New Year. I am looking forward to a great year :-)

Leave a Reply