Flickr Badge

Friday, May 06, 2005

Fixed vs Liquid reopened

Matt Linderman at Signal vs Noise reopens the fixed vs liquid debate. Check out the comments too.

The main reason for most websites not adopting liquid layout is line length readability. I changed my site layout a few months ago from fixed (which was the blogger default) to liquid.

At 800x600 and 1024x768 it gives about 10-15 words per line, which is about optimum for reading. Higher resolutions can cause the main text width to get too big to be easily readable. This can be solved by using the CSS max-width property, but I've not implemented it yet.

Another advantage is in accesibility. When the user changes the font size, the layout remains consistent without text overflowing from one column into another.

Another reason, which is specific to my site layout is that it gives more space for the photo thumbnails at the top of the page. At 1024x768 it spaces out the thumbnails nicely with a pleasing margin at the sides. In the previous design, they were restricted to about 760 pixels of width leading to some amount of cramping. The flip side is that they now take two rows at 800x600.

Fixed width designs can be good in situations where there are a lot of fixed width elements in the design (images etc). They are also good when designers need control of the design to maintain some identity. The main problem with liquid designs, the line length readability issue can be solved with the max-width property.

Otherwise I feel more people should give liquid layouts a try. If it doesn't work, it can always be thrown away, but the sad part is that most people don't even try it, prefering instead to copy a fixed width design from somewhere because everyone else is doing it.


Gaurav said...

I agree liquid layouts are the way to go. But my personal experience is that creating liquid layouts is an order of magnitude higher and browser compatibility issues are also more apparent in liquid layouts.

BTW, if you know of an ace dhtml/css developer in India, please refer them to me. I am having a very hard time hiring a good web designer.

Anonymous said...

Your blog certainly is very easy on the eye. It was, even earlier, but today I noticed the difference and then read that you had actually changed something!

Siddhi said...

Gaurav: I don't know anyone really, but if I see anyone, I'll refer them to you.

Anonymous said...

I agree, and I think the liquid layout works fine for your site.

The line-length argument is a little weak to me, considering that any liquid layout can be resized (a crazy idea!) and also considering that large text doesn't really suffer from that problem.

I have always been interested in liquid design, especially since I got a widescreen laptop. I noticed that liquid layouts are few and far between, so I decided to make one of those site galleries to show off the few websites that get liquid design right. You might be interested in seeing it.