To All You Designers Who Hate Liquid Layouts

I was recently asked to provide some good examples of liquid/hybrid web page layouts, to defend my position that they are superior. While I believe, fundamentally, that they are a great idea, I had a hard time coming up with "off-the-cuff" examples of sites that I use regularly.


So, I did a little soul-searching (okay, very little) to defend my position. Why do I believe, fundamentally, that liquid (or hybrid) layouts are great idea? Accessibility is the first thing that comes to mind. A liquid display doesn't care what your monitor resolution is. It doesn't require someone with a small screen to scroll to the right to see stuff. It gives a similar user experience to everyone.


Mobile devices is the second thing that comes to mind. How can anyone possibly keep up with all the mobile web devices out there, and design specifically for each resolution?


So, why wouldn't you use liquid displays? Well, it's easier to design, build and test. Just like the argument for only supporting One Browser. And you can maintain the integrity of your visual design without worrying about things "flying around".

Needing more ammunition, I resorted to the most popular research tool: Google. I turned up  http://cssliquid.com, dedicated to the promotion of liquid/hybrid displays, which had some great examples (see for yourself). The examples there aren't all great, but some are quite effective. Like any other usability guideline: "Where it makes sense."

There are many places where you can do elegant, liquid things, Recently, I designed a div-based form that displays in one column on narrow displays and two columns on wider displays. All we did was chunk the form into two equal divs so that the right column would wrap below the left column on a narrow display. Not rocket science--but it was a place where it made sense.

All you designers: be open to liquid displays. It doesn't challenge the integrity of your design; it challenges the integrity of your design ability.