How wide should a website design be?

There is no single right answer for that question. I love fluid design, with real attention given to ensuring that a site will fit virtually any screen resolution. But doing that and delivering a sexy looking graphical site is a real challenge. There are still a small percentage of people using 800×600 displays. Mostly it’s people who have poor eyesight and like the larger text that low resolution provides. So if you want to go fixed with and satisfy everyone, you are stuck with about 770 pixels to leave room for a scroll bar. But lots of sites now are opting for 1024×768 as a lowest common denominator, and thus setting the width at something like 980 pixels.

Generally, if you want to design for hand-held devices, that’s a separate set of pages and you do browser sniffing to route users to the big screen or the handheld depending on their settings.

Whenever I design a background, I make sure it is a repeating pattern, so it’ll fit any screen resolution. I’m not sure if this is what ETpro was calling “fluid design”, but if it is, it is just common sense. I’ve been to some sites where you select what resolution you have your desktop set to, and the site matches it with a properly sized background. Although, this isn’t always great, as many lay people don’t know what a screen resolution is, let alone what their resolution is set at. Honestly, I don’t really know what to tell you, other than encourage you to just pick a repeating pattern that will fit any resolution.
-Dan

@Dan_DeColumna No fluid design is design using percentage widths instead of fixed widths. Google uses a fluid design, as does Amazon.com and a number of top retailers. The idea is to get more going on above the fold. Here are a couple of stores we did that use fluid design and I think look reasonably presentable.

http://www.greatgolfdeals.com/
http://www.borderstogo.com/

My screen is 1440 and they still look pretty nice at that resolution.

@ETpro: Ahhh… That makes sense. I always just used an image where all four sides would match up seamlessly. That way, if the image wasn’t big enough for the resolution, it wouldn’t be noticeable. Thanks for showing me that.

-Dan

@Dan_DeColumna You’re welcome.

As always, it depends. On your target audience, mostly, and on personal preference. Fluid designs are nice, but since a very wide piece of text is hard to read anyway, you might as well use a fixed width and just leave some screen real estate unused in widescreens.

There was a trend the past few years to use designs of mostly 960ish px wide designs, seeing as there weren’t that many people anymore using screen resolutions of 800px wide (1024px was more common – though even less so then 1280px – and since not the full width was available for the website (due to scrollbars and the like, and that’s just when a user has his browser maximised), going for something like 960px was safest).

However, then came the “netbooks”, laptops with a small form factor that once again used screens of 800px wide, thus leading to people using smallers widths again. Then again, I think nowadays even netbooks have wider screens again.

So what’s the answer to this? Like I like using 790px but would that be to small?

As said, it really depends on your target audience and how wide their screens are. Anyway, a good guide is Google Browser Size. It includes some statistics on how many average users can see how much of the screen (i.e. the area marked 70% means 70% of the people can see until there), and allows you to overlay that on your own website to see how many people can see the most important things.

seven

can you explane it more?
I mean that google browser site, helped, ill make sure ill put the important content so people can see

@Vincentt If you do use fluid design, making sure you constrain individual blobs of text for good readability is just part of the designer’s job. It isn’t really rocket science any more, what with DIVs being floatable. You can set up a page so that on very wide displays, everything is in multiple content columns up above the fold, but on very narrow displays, there is just one column of content between left navigation and a right column.

@ETpro Very much true, I was merely trying to say that you don’t necessarily have to push for widest available layout as you don’t want your text to get too wide anyway. And of course, you might very well not want to distract the user with more content next to the content they’re focusing on :)

@Vincentt Yep. It all depends on the goals of the site. The big sites that use flexible design are generally ones where they want to get as much content as possible up above the vertical scroll line.