WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: define "liquid design"

for

From: Christian Heilmann
Date: May 3, 2005 4:44PM

>Thanx. I have been given a design that's being defined as liquid.
>> However, it starts at a fixed width for an 800x600 screen, then becomes
>> larger when you increase the font size, not when viewed with a larger
>> resolution screen. I was trying to find something that supported my
>> assertion that that's not really liquid design.
>>
>> Any and all suggestions, comments, etc. are appreciated.


Well it is a mixture of everything.
There are several "standards"

Fixed Layout - doesn't resize at all.
Liquid Layout - resizes with the viewport
Constrained Liquid Layout - resizes with the viewport but has a
minimum and maximum width.
Flexible Layout - defined by EMs, to allow it to grow with the font size

So yours is a flexible layout with a pixel defined width... Tricky.

The benefits and caveats:
Fixed Layout - The designer has full control over the layout. Resizing
the font might completely break it though, and small screens will
force the user to scroll in both directions.
Liquid Layout - On large viewports, line length is getting too long to
read easily. On very small resolutions elements might overlap,
especially when the font is big.
Constrained Liquid Layout - defines a "perfect" length and prevents overlap
Flexible Layout - keeps a consistent aspect ratio, but might also
force the user to scroll.

What is the best? The classic "Depends on your users". :-)

-- Chris Heilmann Blog: http://www.wait-till-i.com Writing: http://icant.co.uk/ Binaries: http://www.onlinetools.org/