Fixed vs Liquid: Thoughts

Everyone seems to post on this sooner or later. My turn.

I have been preaching liquid design for at least a year. Folks can see the information in any resolution.rnrnCommon resolutions are 640×480, 800×600, 1024×768, 1280×1024, 1400×1050. (Stats). At work, I surf at 1152×864 with the browser fully expanded. I tried higher and it was … whoa. I tried lower and it was … whoa. I didn’t resize my browser window though. Hmm…. I have at least 4 coworkers (customers) that are at either 640×480 or 800×600. I know this because they call when they have to scroll to the right for some of our larger reports.

Now. What should I do? On a random sampling of 19 sites, 3 are liquid. The rest are fixed, usually centered and random on the background image/color. The fixed size ranges from 597 (A List Apart) to 972 (The Designer’s Lunchbox). Those two extremes also show what folks do with this fixed mass of stuff with alignment.

Perhaps, when I have more time, I’ll separate my random screen measurements into categories. For example, LANL is a DOE lab. Liquid as can be. That’s not bad liquid, in my humble opinion. LANL news has lots of text, but it’s broken up by a 3-column layout. Fine. But — well, I’ll remake the page example with some dummy text. I don’t want to “call” anyone out. But it’s liquid and the text goes from the left of my screen to the right of my screen, fills top to bottom. I find it very hard to read and search for skimmability.

Here’s an advocate for liquid. That’s what I thought, except for “Not everyone browses full-screen anyway.” I thought it was more “web standard.” But I made a layout with 770 fixed, centered, and I found it oh so much easier to read/present information. I did it with only css, and it worked on lots of browsers. (And those that it didn’t, didn’t see the css so got the text anyway. So nyer.)

(Told you I was going to use this as my notebook…)

Ok, so I’m not a big fan of this design anymore, but here it is:
Liquid

and here it is fixed:
Fixed

No big difference to me on usability. But what if I took out the left navigation (possible) and the right image (which helps it mimic 3-column).

Liquid with lotsa text
Fixed with lotsa text

It’s preference, really, but I actually don’t want to look at the liquid one without the 3-column mimicry. It makes me want to call my mom and make the big, mean text go away.


About this entry