How wide should your site be?

This is an age old debate, trying to strike a balance of usability between the users with older setups and smaller screen resolutions and those with modern wide-screen (or just plain hi-res) displays.

I have followed this debate for many years and the argument seems to always cater for “what the site looks like full-screen”. I don’t know how you work, but personally I have lots of things happening on my desktop and many windows open. I cannot remember the last time I opened a browser window full-screen.

That said, if I was running in 1024 x 768 resolution then maybe I would work differently, I don’t know because I have not used that resolution in 10 years.

The thing I love about hi-res displays is they allow me to have a browser windop open, still see parts of my desktop, have email visible (albeit not the whole window), but running full-screen just feels claustrophobic to me.

That said, I am less bothered about the upper end of the scale, they don’t HAVE to run full-screen, and providing the site isn’t too narrow then I’m sure they will manage.

This leads us to the question of “how narrow do we have to go?”. I am seeing more and more sites with quite large widths. A few years back 750px used to be the norm, then 850px. Nowadays a lot of sites are over 1000px wide. Is this too wide?

There is no answer to this, hence it has been an ongoing debate for years. How wide is too wide?

The other question to bear in mind is whether the content on the right makes a difference to how wide you are willing to go. If everything to the right of the 850px mark is adverts for example, does that mean that the fact that the users on lower resolutions (the minority) can see the navigation and the main body content make it an acceptable width?

My gut feeling was crossing the 1000px mark was a little bit much, but with a little bit of investigation I have found that some of the most widely used blog templates actually cross this boundary.

Has the width-creep occurred while I have been asleep?

In my mind these themes look fine. I even opened them on my secondary monitor (1280×1024) and it looks fine. I can’t say I would want it to be any wider, but still it looks fine to me.

What do you think? How wide is too wide?

7 replies
  1. Lyndi
    Lyndi says:

    I was also one of those who felt that there should be no horizontal scrollbars in 800 X 600. This has changed now. There are very few users using this small resolution. Today I design to make sure I do not get a horizontal scrollbar in 1024 X 768. Most of my fixed width designs these days are between 850px and 950px wide.

    Your description of how you use windows is also the very reason why I dislike fluid designs. I tend to stick to fixed width and make sure the full width can be viewed in 1024 X 768. This way the guys with the big resolutions can still see a substantial part of the page without having to maximize. I suppose that with time this will move up to the next resolution.

    Reply
  2. Rarst
    Rarst says:

    I have more specifi gripe with widths – how they scale while zoomed. I like my browser full-screen (that’s 1400×900 and mostly content area with Opera interface tweaked for minimalism) and I like to zoom so page is large and well-readable.

    Some sites (like blogs) scale well but some of those popular-mainstream-outlets have terrible layout while zoomed and sometimes pagination of article on top.

    I just hope that with resolutions increasing (and mobile web rising) more web-designers start to pay attention how their sites scale up to large and down to small displays.

    Reply
  3. Paul
    Paul says:

    I decide widths based on what resolutions Google Analytics says have been viewing the site. Usually, less than 1% have used a smaller resolution than 1000px wide, so I figure 950px is a pretty safe amount. I don’t think horizontal scrollbars are good for 1024×768.

    I think deciding your ideal width depends a lot on who is going to use the site. If it’s likely to be technically-capable people, then you can probably expect larger resolutions and design with that in mind. If your audience is more of typical computer users, you should probably go a bit narrower.

    Reply
  4. Jim
    Jim says:

    @Paul: Good point, and most of the sites I see that are wide are in the technical arena and so are likely to have higher resolutions.

    Reply
  5. PapaGeek
    PapaGeek says:

    Many designers already use a link to a print CSS file to redesign their pages to fit on a printed page.

    W3C is already working on an enhancement for “media queries” that will activate a CSS file based on screen width, but I can’t seem to find the specifics on how this will work exactly.

    I’m working on a javascript to do the same thing and will publish it freeware later this year.

    Reply

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *