Fixed width vs. Flex width?

January 21st, 2009 by LJ Staff

Your rating: None Average: 3.8 (9 votes)
I greatly prefer visiting fixed width web sites.
17% (194 votes)
I greatly prefer visiting flex width web sites.
54% (615 votes)
I don't care all that much either way.
29% (323 votes)
Total votes: 1132


Special Magazine Offer -- Free Gift with Subscription
Receive a free digital copy of Linux Journal's System Administration Special Edition as well as instant online access to current and past issues. CLICK HERE for offer

Linux Journal: delivering readers the advice and inspiration they need to get the most out of their Linux systems since 1994.

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.
DarkFlib's picture

Fixed vs Liquid

On February 2nd, 2009 DarkFlib says:

Blocks of text are only comfortable to read if around the 10 words mark in length, narrower or wider and it becomes harder to read.

While the theory of liquid layouts is sound, its rare that you will find multiple liquid layouts that work well with the same window size, so you end up resizing either the text or the window to fix this.

Fixed layouts assist here, but aren't perfect themselves. A slightly better option is fixed based on ems, but even that can have drawbacks on some systems, especially those with odd resolutions.

People are suggesting that liquid solves mobile viewing issues. This is a half truth at best. You can't know the quirks the device has, only guess, so you are better to just design in a standard way and let the device reformat to suit itself. If you really must accommodate mobile users, then there is always the option of a specific stylesheet for that platform.

Alan Barclay's picture

UI Rule#1 - the user is in control

On January 28th, 2009 Alan Barclay (not verified) says:

Irrespective of screen size, fixed-width sites violate
this rule.

HTML is neither designed for, nor completely capable of
precise element placement on all viewers' screens.

The page should do its best to make itself usable at whatever
size I choose to view it, that's my $.02

CW Petersen's picture

The term 'flex' got my vote

On January 28th, 2009 CW Petersen (not verified) says:

While I long ago decided fixed was not appropriate to serve my needs, when screens started getting r-e-a-l-l-y wide, liquid didn't really work either.

I prefer a variant of elastic, where a site will shrink to a certain minimum width, depending on the audience, and grow to a width short of making the line-lengths too long for comfort, all in aid of suiting as many clients as possible without driving the writers/coders nuts.

My 2¢ worth.

David E's picture

It's "liquid" not "flex"

On January 26th, 2009 David E (not verified) says:

Can we stick to the established term 'liquid' rather than 'flex' layout, since the latter is bound to be confused with Flex (capital F).

Michael Raugh's picture

Fixed width is broken by design

On January 22nd, 2009 Michael Raugh (not verified) says:

It's not just about the widescreens, either. Think about all those 1024x600 netbooks that are selling like hotcakes these days. Not to mention the iPhones, Android phones, Nokia tablets (800x480), and similar.

Design around a fixed width and you're guaranteed to cause problems for some devices. Flex is the polite way to go, and I'd say it's more in keeping with the inclusive spirit of Linux.

<MR>

Arthur Griffith's picture

Flex, by all means

On January 22nd, 2009 Arthur Griffith (not verified) says:

This page is fixed width, so I didn't read the stuff on the right.

Marcel (Writer and Free Thinker at Large) Gagné's picture

Flex, baby, flex!

On January 22nd, 2009 Marcel (Writer and Free Thinker at Large) Gagné (not verified) says:

Hey there, shiny happy Linux Journal people!

I would suggest a new poll . . . "Who really, really, really hates fixed width sites with a passion?"
a) Me
b) That guy over there.
c) That girl right there.
d) All right thinking people do (right as in 'correct')
e) Huh? Why would you want fixed width sites?

What? You don't think I like fixed width sites? Oh, come on. Where would you get such an idea. [ insert appropriate smiley here ]

-- Marcel

Anonymous's picture

fixed width usually only works for maximized browser windows

On January 22nd, 2009 Anonymous (not verified) says:

Definitely flex width.
I don't understand why so many webdesigners seem to assume that people maximize their browser windows. I usually have several windows at once on my screen -- that's the whole point of a GUI!

Arnstadt's picture

Fixed width vs. Flex width?

On January 22nd, 2009 Arnstadt (not verified) says:

I prefer fixed layouts because of the same reasons the others, who prefer fixed websites, said. But it depends on the content of a website, weather it should be fixed or flex.

Cd-MaN's picture

Flex

On January 22nd, 2009 Cd-MaN (not verified) says:

Flexible design with max-width to make it readable on 22" screens :-)

Auckland Air Conditioning's picture

Either way, as long as it looks good all round

On January 22nd, 2009 Auckland Air Conditioning (not verified) says:

For small company websites (by that I mean small businesses of 1-25 staff) I will always go for the fixed width. I vary it between 775px and 900px in width dependent on the company's targeted market. Whichever way you go though, as long as it doesn't break when you make your browser smaller to view a selected area whilst multi-tasking then go for it.

From a usability standpoint, I would say that interactive sites with lots of forms/gadgets/gizmo/go-faster-stripe mods or whatever you can think of without saying Web 2.0 (couldn't resist saying it), are best as floating width and mainly static text content rich sites are best as fixed.

npn's picture

Generally prefer fixed

On January 21st, 2009 npn (not verified) says:

One need look no further than typesetting styles. There are very good reasons why lines of printed text are only so long. The same principles should be applied to web pages. Yes, I know web pages are not printed text. But neither are they TVs.

As much as I would rather all web pages conform to *my* preferred window size, I much prefer windows that are only as large as they need to be. The fact that I have a huge/large screen is my business. I didn't get it to let everyone else in the world bully me into seeing only *their* information; I got it to see multiple windows of data simultaneously.

Some sites can be wider, some can be narrower. But each site should be fairly consistent. And, yes, this is very hard to do, since every browser implements HTML differently, and none of them implement it all correctly.

Anonymous's picture

Very wide text lines are

On January 21st, 2009 Anonymous (not verified) says:

Very wide text lines are harder to follow.
Around 50 to 70 chars is the ideal.

Of course you can always disable the page style (View -> Page_Style -> No_Style in Firefox menu) to have the default rendering (with fonts and colors as defined in the browser preferences). There are also extensions to add buttons and/or hotkeys to toggle that.

Chris Hope's picture

min/max width

On January 21st, 2009 Chris Hope (not verified) says:

I think they're best when they use min-width and max-width. I use a 1920 wide monitor and I have to resize the browser window (which I'd prefer not to have to do) if the content area streches too wide because it's far too hard to read if left wide.

colindean's picture

Flex

On January 21st, 2009 colindean says:

Flex(ible), fluid width designs are more visually appealing and cater to users with larger screens. Fixed width designs are better for sites heavy on graphics and light on text. Fixed width designs are easier to work with, really, but fluid designs often look better when designed with larger screens in mind.

__________________________

--
Colin Dean
www.cad.cx
www.bioslevel.com
www.thinkcomputers.org

Post new comment

Please note that comments may not appear immediately, so there is no need to repost your comment.
The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <pre> <ul> <ol> <li> <dl> <dt> <dd> <i> <b>
  • Lines and paragraphs break automatically.

More information about formatting options

Newsletter

Each week Linux Journal editors will tell you what's hot in the world of Linux. You will receive late breaking news, technical tips and tricks, and links to in-depth stories featured on www.linuxjournal.com.
Sign up for our Email Newsletter

Tech Tip Videos

From the Magazine

December 2009, #188

If last month's Infrastrucuture issue was too "big" for you then try on this month's Embedded issue. Find out how to use Player for programming mobile robots, build a humidity controller for your root cellar, find out how to reduce the boot time of your embedded system, and if you're new to embedded systems find out the basics that go into one. You can also read about the Beagle Board, the Mesh Potato and a spate of other interestingly named items. And along with our regular columns don't miss our new monthly column: Economy Size Geek.







Read this issue