Percentage or Pixel Based Width Columns

I am developing a new design for the Faculty of Management website. The front page is a portal type design with three columns. I am trying to use elastic design in development of the page, but I am left to wonder if this is the best option for a three-column layout.

Here’s my question.

Is it better to have three columns with percentage-based widths that became very narrow as the browser window is reduced, or to have three columns with pixel-based widths that drop below each other as the browser window is reduced? Is the content more usable in narrow columns that are next to each other or in consistent width columns that are below each other?

Thoughts?

By Kim Siever

I am a copywriter and copyeditor. I blog on writing and social media tips mostly, but I sometimes throw in my thoughts about running a small business. Follow me on Twitter at @hotpepper.

4 comments

  1. heh hotpepper … can you provide some code for me / anyone else to look over
    thanks

  2. Here’s a temporary page.

    http://www.uleth.ca/man/test.cfm

    In the next month or two, the page will be deleted. We’re also undergoing some problems with our CF server, so it may not load immediately when you try to access it. If you receive a timeout error, just refresh the page.

    I’m not sure why you need some code though. I am asking a philosophical question.

  3. I just checked your test page (above, you’re right, it does require reloading) and it appears that you have not yet implemented %age based widths (unless you have used max-width or min-width properties).

    The only problem I have with %age based layouts is that header images or other decorative images must be handled properly.

    Your question seemed to deal with the text content in the columns. I personally treat 800×600 as the minimum resolution (for computer screens, handhelds can be dealt with using a separate stylesheet) so as long as the min-width is set to 760px, you should be fine with 3 columns, %ages for widths.

    I suspect that anyone using less than 800×600, ie., 640×480 is using an older computer with an older browser and you can deal with the styles and stylesheet differently.

    HTH,

    Jules

  4. Thanks for the comments, Jules.

    I am using max-width. I am going with %-based widths for now unless I get some more feedback from people saying it should be a fixed width.

Comments are closed.