fluid vs fixed width?

Discussion in 'Web Design and Development' started by arn, Mar 9, 2006.

  1. arn macrumors god

    arn

    Staff Member

    Joined:
    Apr 9, 2001
    #1
    What's people's opinions on Fluid vs Fixed design of websites.

    I've always been a Fluid proponent, and macrumors is setup to be fluid. But more and more sites are fixed width and frankly, it's easier to setup and what not, not having to worry about extremes of size.

    thoughts?

    arn
     
  2. neocell macrumors 65816

    neocell

    Joined:
    May 23, 2005
    Location:
    Great White North
    #2
    I personally like fluid, though I've never made a real website so I have no idea of the trials and tribulation associated with its implementation. Since I use (and I image most Mac users do too) many open windows, like to be able to fully read more than one open window at a time, and not have to constantly scroll side to side, I'm a supporter of the fluid setup.

    Thanks for all your work making this site a pleasure to use :)
     
  3. ChrisWB macrumors 6502

    Joined:
    Dec 28, 2004
    Location:
    Chicago
    #3
    In general, I feel fluid sites are better with text, but fixed width are better with images or a mix of text and images. I have mixed feelings on forums. For my own forum, I use fixed width because I think it's easier to read on a large screen. The text isn't stretched out across 20 or more inches.

    PS: Arn, this is the first time I've seen you actually on the forums. It's nice to "meet" you. :)
     
  4. rendezvouscp macrumors 68000

    Joined:
    Aug 20, 2003
    Location:
    Long Beach, California
    #4
    I think they have their own places, but I personally prefer fixed + max/min-width + elasticity.

    I like this combination because I feel like it gives the benefits of everything. The "fixed" width is a general guide that most people will have, while the max/min-width of it all makes it a little bit flexible.

    The "elasticity" just makes it nicer for those of us who want the font size to be a little bit bigger or smaller. I'm talking about a website that has a set size, but if you increase or decrease the text size in your browser, everything gets larger as well (save images). I can't wait for SVG when we'll have elastic images as well!
    -Chasen
     
  5. Heb1228 macrumors 68020

    Heb1228

    Joined:
    Feb 3, 2004
    Location:
    Virginia Beach, VA
    #5
    I think I agree with this statement. Its the best of both worlds. Completely fixed width sites get on my nerves.
     
  6. theappleguy macrumors 6502

    Joined:
    Apr 19, 2005
    #6
    Fluid. Most fixed sites are designed for 1024 x 768 screens so don't look so good on higher res 20-inch + monitors. :)
     
  7. BakedBeans macrumors 68040

    BakedBeans

    Joined:
    May 6, 2004
    Location:
    What's Your Favorite Posish
    #7
    I disagree (in a friendly mannor ;) ). My site is designed, begrudgingly for a 1024x768 but looks a lot better on high res monitors.

    Not applicable in everycase i suppose
     
  8. arn thread starter macrumors god

    arn

    Staff Member

    Joined:
    Apr 9, 2001
    #8
    Is this actually attainable? My experience is that it is not, but I'm not that experienced with it.

    Sometimes I crawl out from under my rock. :)

    arn
     
  9. Heb1228 macrumors 68020

    Heb1228

    Joined:
    Feb 3, 2004
    Location:
    Virginia Beach, VA
    #9
    The forums already do this... they will shrink down to a certain width but then they stop and you get the scroll bar at the bottom. I'm not sure if its possibly to set a maximum width, but it seems like I've been to sites that do it somehow.
     
  10. arn thread starter macrumors god

    arn

    Staff Member

    Joined:
    Apr 9, 2001
    #10
    nay, the scroll bar appears when there are elements that can't be shrunk (banners or images), but the remainder of the site shrinks down (the posts, for example) as you shrink down the screen. There is no minimum width enforced.

    arn
     
  11. Heb1228 macrumors 68020

    Heb1228

    Joined:
    Feb 3, 2004
    Location:
    Virginia Beach, VA
    #11
    Yeah I see what you mean... I looked through some of my bookmarks to see if I could find a site that really did that kind of thing and couldn't find one.

    In that case I definitely vote for fluid.

    EDIT: http://www.dashboardwidgets.com/ kind of does it, but like you said, I think thats because its being limited by the banner, but the banner somehow has a minimum width and can get larger.
     
  12. rendezvouscp macrumors 68000

    Joined:
    Aug 20, 2003
    Location:
    Long Beach, California
    #12
    While I haven't applied a min-width on this unfinished project (simply because, often enough, you don't really need a min-width if you have an image that will always make a scroll bar at an unreasonably small size), you can see that everything under the header image is resized with the text size.

    If you bring your window in on the sides, and then "push" further in so that the background no longer shows, it'll get smaller as well. On the flip side, if you make the text so big that it takes up all the space on the page, it'll just stop expanding horizontally to prevent a scroll bar.

    This is how I prefer blog-type pages; I believe that sites such as ma.gnolia are better served fluid. I used to browse the web with a maximized window on my Cinema Display, but then I realized that it was really straining my eyes and I usually have the window as wide as I really want it for fluid sites.
    -Chasen
     
  13. arn thread starter macrumors god

    arn

    Staff Member

    Joined:
    Apr 9, 2001
    #13
    ya, it does seem to do it - on the Mac. I'll have to try it on Win/IE

    arn
     
  14. iGav macrumors G3

    Joined:
    Mar 9, 2002
    #14
    Fluid layout design, but fixed width content columns, that way you have a degree of control of line lengths.

    Excessive line lengths exceeding 11+ words (40-60 characters) makes for poor readability and legibility.

    Obviously you have to consider the default text size, but you can still offer up a degree of flexibilty with a design to compensate for reasonable adjustments in browser text settings, whilst still maintaining a high degree of legibility.
     
  15. dpaanlka macrumors 601

    dpaanlka

    Joined:
    Nov 16, 2004
    Location:
    Illinois
    #15
    I'd say fixed width.

    All of the sites I design are fixed width, generally designed for 1024 x 768.

    On 30" displays, it's a LOT of wite space. Most people don't have 30" dipslays, and any site stretching out to cover 30" of space will look terrible and be difficult to read. It really isn't that big of a deal on 19" or 17" displays with higher resolutions than 1024 x 768. People need to stop using that maximize button. What a waste of space that is.

    If you put a magazine on a table, it doesn't stretch out to the width and height of the table.
     
  16. dornoforpyros macrumors 68040

    dornoforpyros

    Joined:
    Oct 19, 2004
    Location:
    Calgary, AB
    #16
    I pretty much always build fixed...however having said that I rather like the way MR is set up in it's current fluid format.
     
  17. Josh macrumors 68000

    Josh

    Joined:
    Mar 4, 2004
    Location:
    State College, PA
    #17
    Fluid.

    If font and imaging is done right in CSS, it will be presentable on many more resolutions than a fixed-width layout.

    Working for Michigan.gov, one of my biggest issues with our site (besides the terrible Vignette CMS) is the horrible fixed-width layout.

    It's 2006, no need to design sites that fill a tiny portion of the screen for anything larger than 800x600.
     
  18. yippy macrumors 68020

    yippy

    Joined:
    Mar 14, 2004
    Location:
    Chicago, IL
    #18
    Fluid.

    I like to view MR taking up the full screen of my PowerBook so I can see as much as possible at once. On occasion though I like to have 2 articles open at the same time next to each other and in that case I have to shrink the page but I don't want to have to scroll sideways.
     
  19. arn thread starter macrumors god

    arn

    Staff Member

    Joined:
    Apr 9, 2001
    #19
    for what its worth, DashboardWidgets doesn't work on Windows IE the same way. no min width. Also the top area layout is broken.

    arn
     
  20. UKnjb macrumors 6502a

    UKnjb

    Joined:
    May 23, 2005
    Location:
    London, UK
    #20
    Fixed width with elasticity for me.
    I started with fluid (from ignorance), but then thought that if the text and images were all laid out for 'good' resolution, 1024 x 768, then proportions could be established that would make re-sizing unnecessary. I agree with dpaanlka's quote above "If you put a magazine on a table, it doesn't stretch out to the width and height of the table." For what it is worth, I read these forum pages in default size and have only just played with seeing what happens when I re-size them. They're just fine on default size.
     
  21. Salasm macrumors regular

    Salasm

    Joined:
    Feb 1, 2006
    Location:
    surrounded by mods
    #21
    Keep MR fluid please. If I wanted fixed width pages, I would have resized my browser window.

    ps. Safari and Firefox support min/max width lengths in CSS, but Win/IE does not, so that's why you don't see it used often. Shame on Microsoft.
     
  22. Heb1228 macrumors 68020

    Heb1228

    Joined:
    Feb 3, 2004
    Location:
    Virginia Beach, VA
    #22
    Ah I see... I guess with it being a dashboard related site they don't worry too much about IE for Windows.

    At any rate, I think the fluid layout of MR is great.
     
  23. ChicoWeb macrumors 65816

    ChicoWeb

    Joined:
    Aug 16, 2004
    Location:
    California
    #23
    Why not both.

    It is possible to use the positive attirubtes from each to put together a well laid out site (ie. www.usc.edu). Personally, I would never design a fluid site for a client unless they SPECIFICALLY asked for it and we went through the positives and negatives of each. Fluid has much room for variation between resolution sizes and I view that as a negative. If I can not control where my content and images are, I become frustrated.

    I'm actually quite shocked at the fluid answers. You'll notice that 90% of the web is fixed and built for 8x6, which is my standard. Anywho, just thought I'd tip in my 2 cents. :)
     
  24. Rower_CPU Moderator emeritus

    Rower_CPU

    Joined:
    Oct 5, 2001
    Location:
    San Diego, CA
    #24
    Hybrid layouts are starting to come into vogue now - as others have noted fluid designs with a minimum/maximum width. As you can see from the Dashboard site, IE/Win doesn't support min/max-width properly, which ties your hands a bit.

    As a designer I go back and forth - fluid is nice and simple, but fixed gives you more control to make sure your layout is viewed exactly as you want it.
     
  25. MrSugar macrumors 6502a

    MrSugar

    Joined:
    Jul 28, 2003
    #25
    ah Fluid vs. Fixed... an interesting question.

    My opinion is that elastic websites are the ideal setup. A fluid view with a min and max setup. However, Arn pointed out that this won't work in IE. Luckily there is fairly manageable Javascript to handle the problem. Or you can do it with CSS but it will create non-valid code.

    My site, www.fluidvisiondesign.com uses a width based on EMs that has a max / min width. It works in IE thanks to the script I mentioned above, (http://fluidvisiondesign.com/script/minmax.js). This I believe is ideal. Although I am not completely turned off to fixed width's as I think if done right they can accomplish a lot. For instance, subtraction.com is a really nice fixed width layout.
     

Share This Page