Fluid Designs

[Bec]

I've just started using the fluid design templates for blogging, and gotta say, I'm loving how they expand out and keep you from seeing huge areas of background on the left and right sides when viewing say an 800x site with a higher screen setting.

Part of me is wondering if this concept couldn't also work when creating tours and member areas?

Anyone seeing this in play already?

[Lee]

Do you have an example so we can see what you mean Bec?

Regards,

Lee

[Bec]

Sure -- I just did a fluid design for these guys: www.rockaroundthecock.com/blog/

play with your screen size and you'll see how the page opens or closes to fit your choice. Sides are permanent with set pixels for width, center is based on a % and opens or closes up to fill the screen.

[Bec]

kinda said that wrong - the sidebars are set size - the content area is fluid - the header is a background image that is actually 1600 pixels wide, so how much or how little you see of it varies to right side as screen size increases.

[gaystoryman]

Sure -- I just did a fluid design for these guys: www.rockaroundthecock.com/blog/

play with your screen size and you'll see how the page opens or closes to fit your choice. Sides are permanent with set pixels for width, center is based on a % and opens or closes up to fill the screen.

Yep, using CSS you can set certain divs as fluid, so they will automatically expand, which is what these blog templates do. Depending on how many 'columns' you want to move, or not. Dynamicdrive CSS section has several fluid desing templates to play with where the header is ficed, right or left or center or any combination thereof.

[dr dick]

that sure is purty, darlin'! i need to get me something like this for http://www.drdicksexadvice.com/ thanks for sharing.

dd

[Lee]

Ah okay, well i have to say, im not a big fan of fluid designs based on the fact that, as a site owner, im never going to know exactly what the site looks like to the surfer.

I much prefer doing fixed width designs, that have been centered, that way im at least going to know how each and every page looks to my surfers, even if their browser resolution is larger than, or smaller than the size of the actual page layout itself.

Regards,

Lee

[IdolKnights]

if done right, fluid works BUT you still need nested tables with a fixed width for your main content if you plan to have images accompany the text. Else it looks like shit, to be frank.

[Xstr8guy]

I never liked these types of designs either. They look awful on my 22" monitor and not so good on my 19". Even when nested tables are used, I don't want to see other things spread out on a wide monitor.

What would be nice is something that could scale-up the size of the font and images in proportion.... similar to hitting 'ctrl+' in IE7. Of course images and fonts would need to retain their quality, which isn't currently possible.

[Lee]

Jim,

Have you checked out some of the Zoom layout tutorials out there?

Ive actually been doing a lot of research on Web 2.0 functionality over the past few weeks and there are a heap of them available.

This is a pretty good one i found a few days ago...

http://juicystudio.com/article/zoom-low-vision.php

Regards,

Lee

[Xstr8guy]

Thanks Lee. I'll take a look at it when I have some spare time.

[Fister]

I like to use fluid design. It seems to work best when the bulk of the page content is text, rather than images.