homepage Welcome to WebmasterWorld Guest from 54.198.224.121
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Accredited PayPal World Seller

Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

This 84 message thread spans 3 pages: 84 ( [1] 2 3 > >     
Liquid layout vs Fixed layout
What do you prefer - and why?
Nick_W




msg:564769
 7:39 am on Oct 4, 2002 (gmt 0)

Hi everyone,

I'm a big beleiver in the concept of liquid design but, I know many of you prefer to code to fixed width/font criteria.

I prefer the liquid approach because I think it allows your pages to adapt to whatever the user is using. That may be a 1024x768 high rez monitor on a PC or it maybe 800x600 with a whole bunch of toolbars further diminishing screen real estate.

Whatever the case, a liquid layout will adapt to it.

I'm sure some of you disagree, let's here your thoughts...

Nick

 

DaveN




msg:564770
 7:47 am on Oct 4, 2002 (gmt 0)

Not only that Nick but from an seo point of view you can place text in the the way you want it be spidered unlike tables and frames (without spamming) .

DaveN

4eyes




msg:564771
 7:57 am on Oct 4, 2002 (gmt 0)

Ever since I got my 19" monitor I started to prefer liquid layout.

Before that I took what I now consider to be the lazy approach - fix it for 800*600 and hang the others

ken_b




msg:564772
 8:10 am on Oct 4, 2002 (gmt 0)

I've seen some liquid layouts that I really liked, and I wish I had the skills to build like those sites.

But most I've seen are not all that good. Stuff out of position, stuff jumping all over the screen while the page figures out where it's supposed to be and what size. I don't know why it does that, but I know I don't much care for it.

So unless I learn to do liquid right, I'll have to stick with fixed.

Course one could argue that I don't know how to do fixed all that well, but.......

Woz




msg:564773
 8:13 am on Oct 4, 2002 (gmt 0)

Depends on the project, sometime I will do liquid, sometime fixed. I must say however that when I do "fix it for 800*600" I (almost) always centre it, just seems to look beter floating in the centre rather than scrunched up to the left with all this white space on the right.

Onya
Woz

digitalghost




msg:564774
 8:24 am on Oct 4, 2002 (gmt 0)

I really like liquid layouts. I don't design websites though so my admiration comes from how well they fill up my 21 inch screen. :) In reality though, I don't care if there's dead real estate, I just want quick access to the information I'm looking for.

My first exposure to liquid layout was Evolt and since then I've liked the concept. In fact, when I actually get around to having my site designed it will probably be liquid utilising CF.

Aside from the aesthetic value, does a liquid layout help functionality? I find that with larger monitors my eye strain lessens but wrist cramps set in.:)

As far as SEO goes, give me layers any day though.

dingman




msg:564775
 8:29 am on Oct 4, 2002 (gmt 0)

Liquid all the way. I almost always run at a higher resolution than most people do at any given time. Right now, I'm running 1280x1024. At work, it's even higher than that (1600x1280?) My wife takes whatever the default setting is and changing it would never occurr to her, but her machine is several years old (P233). My mother only recent and relictantly upgraded from a 386, which did indeed have a graphical web browser.

Find a fixed layout that is even *useable* to everyone from 640x480 up to 1600x1280, and I'll think about using it. If I used a fixed layout on one of the sites my wife an I both use several times a day, I would either have to waste a third of my screen real estate or make her side-scroll. Side-scrolling is the greater evil, but they both stink. With a fluid layout, the page looks about the same on her screen as on mine.

chris_f




msg:564776
 9:07 am on Oct 4, 2002 (gmt 0)

Depends on the project, sometime I will do liquid, sometime fixed. I must say however that when I do "fix it for 800*600" I (almost) always centre it, just seems to look beter floating in the centre rather than scrunched up to the left with all this white space on the right.

Onya
Woz

Same here, however, I do sometimes align it to the left and put a skyscraper on the right. That way if you view in 800x600 you see the site. If you view in 1024x768 you see the site plus a skyscraper add which must look good and fit with my site design/colour scheme.

Chris.

Nick_W




msg:564777
 9:23 am on Oct 4, 2002 (gmt 0)

Regarding liquid layout and SEO.

Only with CSS layout of course, which I'm a huge fan of. I like to shunt some well optimized but unessential copy off the the right of the screen but have it appear first in the html flow... works like a dream ;)

Nick

shanz




msg:564778
 11:20 am on Oct 4, 2002 (gmt 0)

I often have to use a weird hybrid of both styles. My boss is in the publishing business so demands that he get layouts exactly as he wants them. Text wrapping round an image is like the end of the world to him!(He has marginally escaped death on a number of occasions for this!)

As a result I usually have the fancydan stuff expanding to fill the white space with any content a fixed width.(He ignores the 640X480 issue) What a pain.

I have a feeling CSS should provide a better solution for this perhaps but I am too busy to research this at the moment. Any ideas?

Shanz

Nick_W




msg:564779
 12:13 pm on Oct 4, 2002 (gmt 0)

Well, if you don't have time to study it there probably isn't much you can do?

Nick

Mark_A




msg:564780
 12:16 pm on Oct 4, 2002 (gmt 0)

Hi Nick, interesting topic this one..
I tend to do both / either depending on the site.

I think fixed width with fixed text size is by far the easiest to make to look attractive in 800x600 & 1024x768 - its often I think therefore cheaper for clients taking less time per site.

The issue I find about fluid layouts is that its ok to have text reflow and allow users to resize etc but this does not resize images at the same time so the page flow is changed ...

Plus #1 you need to test it in more screen sizes which increases time to site completion.

Plus #2 for me the big issue .... larger screen sizes are more like an A4 page laid on its side (landscape), if you let the page fluidly fill the screen in 1600 wide screens yet also resize back to print filling a European A4 sheet I recon you often end up with long long lines of text which are harder to read / scan ..

Of course using css print stylesheets would solve lots of these issues and they are on my list of next things to suss out. :-)

shanz




msg:564781
 1:28 pm on Oct 4, 2002 (gmt 0)

>>>Well, if you don't have time to study it there probably isn't much you can do?

True...

Pointers in the right directon would be useful though. Off to look at Mark_A's print stylesheets idea.

Shanz

Nick_W




msg:564782
 2:04 pm on Oct 4, 2002 (gmt 0)

Well, I learnt CSS at Westciv [westciv.com] which has some great CSS tutorials and courses for free.

But alot of people really like W3 Schools [w3schools.com]

Nick

shanz




msg:564783
 2:11 pm on Oct 4, 2002 (gmt 0)

Cheers.
<mischief>he,he, needed to say something to become a full member</mischief>

Off to my studies

Shanz

ergophobe




msg:564784
 4:57 pm on Oct 4, 2002 (gmt 0)

A lot of pre liquid people and I am definitely one of them. I avoid static design as much as possible. Howerver, I do have a few reservation. The big problem is that sometimes things can get stretched too far. Readability decreases dramaitically if line length goes beyond a certain number of characters (for example, people have trouble tracking when they return to the left margin to start reading the next line). There's a rule of thumb for this but I forget - maybe some typography person knows offhand. Anyway, it is possible that when someone views a liquid design on a large monitor, it will become difficult to read.

So though I've committed to liquid design, I would really like to see the max-width and min-width settings work so you could go fluid to a point, and then have some static limits.

One possibility, and I don't know whether or not this is even on the horizon, is to be able to set a max width for text boxes in terms of number of characters so beyond a certain width the default would be to size up the font and keep the same number of larger characters in the box, rather than to fit more characters of the same size in the box.

Tom

Nick_W




msg:564785
 5:08 pm on Oct 4, 2002 (gmt 0)

it is possible that when someone views a liquid design on a large monitor, it will become difficult to read.

Not only possilble, completly true! However, people with very high rez monitors normally resize the window to a more 800x600 looking size.

I don't have any hard data to back this up but I've heard it from many reliable sources over the last couple of years and have seen it first hand on more than one occasion.

People with very high rez usually have it for some reason other that "because I can" and are fairly computer savvy. They know that there monitor is not the norm and adjust for it.

Those that are not so savvy will soon learn ;)

Nick

ergophobe




msg:564786
 8:42 pm on Oct 4, 2002 (gmt 0)

I guess that's true. I still think it would be nice if the max-width, min-width stuff worked better.

SethCall




msg:564787
 8:48 pm on Oct 4, 2002 (gmt 0)

no joke ergo: there is too much difference between browsers in these attributes...

marek




msg:564788
 9:21 pm on Oct 4, 2002 (gmt 0)

I would really like to see the max-width and min-width settings work so you could go fluid to a point, and then have some static limits.

The max-width and min-width work in Mozilla and in IE can be achieved via JavaScript and DOM. Such a solution already exists. Just link the script to the document and those properties start work.

One possibility, and I don't know whether or not this is even on the horizon, is to be able to set a max width for text boxes in terms of number of characters

Setting width in em is very suitable for that.

copongcopong




msg:564789
 3:11 am on Oct 5, 2002 (gmt 0)

from my own view, most of people using larger monitor and higher screen area would prefer to adjust their browser size when browsing.

I prefer to layout my site readable for 800 x 600 resolution and which is center-aligned. Some would put "more-needed" information viewable within the 640x480.

I find it hard reading a very very long line of sentence when a liquid design tries to adjust itself with the width of the browser when using a larger monitor and a higher resolution. Its seems that you would need to move your head just to read. Anyway, I find it also difficult reading a very long line of sentence on a very big book, don't you?

anyway, its up to the coder/designer so that the layout would be beatiful for a vey very high resolution setup and not to forget the content to be very easy to read.

Just remember, they could easily adjust the browser size for people who use a higher resoultion and a biger monitor. And maybe that is why some site has a fixed left-align content and has a fixed width too.

peace. :)

BTW: people who use large monitor at work and is prohibited to browse the web while working would prefer adjusting the browser size. (make it hideable.) Anyone do this at work too? ;)

Nick_W




msg:564790
 10:23 am on Oct 5, 2002 (gmt 0)

How would resizing make it hideable?

Re: max-width etc..

I too lookforward to when we can use that feature ;) At the moment, if you really want to control width, as someone said earlier em's are the way forward...

Nick

brotherhood of LAN




msg:564791
 10:35 am on Oct 5, 2002 (gmt 0)

I'd hope to move completely to liquid designs, once I know the pro's and cons a bit better!

right of the screen but have it appear first in the html flow

See, this sort of stuff doesn't seem to be too technical with CSS...its the top down stuff after you turn it into liquid.

Can't seem to get solutions for a "bottom" div and the top-down hierarchy of divs sort of thing......though hopefully CSS does have the answer somewhere in its code without having to sacrifice its beauty for a table to nest everything in :)

Nick_W




msg:564792
 10:41 am on Oct 5, 2002 (gmt 0)

.its the top down stuff after you turn it into liquid.

What do you mean BOL?

Nick

brotherhood of LAN




msg:564793
 10:48 am on Oct 5, 2002 (gmt 0)

Well, say, an absolute div, say 20% absolutely positioned on the left for your navigation, conveniently positioned elsewhere in your HTML order of things ;)

The div may contain a few links, where it will not span across the "fold" of the page. However, the same div on another page may span across the fold.

But what if I want to add another div positioned below this....possible with CSS and a fluid layout?

Otherwise I'd be sitting a table in the div and chopping it into td's to make it *look* like different cells.

I'd much prefer just to declare divs that sit nicely on top of each other.

Nick_W




msg:564794
 10:53 am on Oct 5, 2002 (gmt 0)

Best solution for that would be to nest a div inside it.

With absolute positioning the question of a footer div always comes up as the main problem. There are 2 things you can do:

  • Mess with JS to get this effect (don't know how but it's supposed to be possible)
  • Live with the fact that it can't be done and place your footer inside the main content div.

I always do the latter and use just a <p id="footer"> with plenty of top margin on the #footer so that pages without much body content don't get the footer showing up half way up the page...

Nick

brotherhood of LAN




msg:564795
 11:10 am on Oct 5, 2002 (gmt 0)

Cheers Nick,

I'm gonna miss those footers :( Thanks for the sticky for the alternative....it seems to work for your site but I don't know if that's a one size fits all solution.

If only everyone had the same resolution/browser/browser add ons stealing space....then I could just declare their positions without a prob. Otherwise it would seem this "browser sniffing" and a whole other mess of code would be needed to get the desired and exact effect.

my view : liquid for sure...good for the spiders, good for text->voice software (so i hear)....not good for footers! I'll go with the idea of liquid over fixed for the future though

SuzyUK




msg:564796
 4:41 pm on Oct 5, 2002 (gmt 0)

Just wondering, why the question of a footer div, is so difficult?

Is it just if your footer is very narrow (height-wise).

I am designing a site at the minute which uses a footer div, and it is purely CSS, and I haven't had a problem with the div appearing where it shouldn't.

the min-height (CSS2) attribute is recognised by NS6 and Opera, so I have incorporated it into my main content div, as it doesn't affect viewing in IE.

Or am I missing something (which is possible ;))

Suzy

Nick_W




msg:564797
 4:45 pm on Oct 5, 2002 (gmt 0)

Are the proceeding div's positioned absolutely?

Or are they floated?

Nick

SethCall




msg:564798
 5:25 pm on Oct 5, 2002 (gmt 0)

Hey guys: i also dont udnerstand why footers aren't possible...

Could you give me youir exact definition of a footer, and what you expect from one?

Because for the page I am working on now, according to my own definition of a footer, i have *exactly* what I want...

So enlighten me ;)

sorry i am n00b to may aspects of your lingo :)

This 84 message thread spans 3 pages: 84 ( [1] 2 3 > >
Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved