How wide should you design for?
Monday April 16, 2007
A very popular question I get is "how wide should I design my Web pages?" While the best (if annoying) answer is "it depends", it is possible to look at statistics
to determine how wide you should design your pages. But before you run out to a stats site, you need to keep something in mind. Statistics measure the monitor resolution for the visiting browsers, not the actual browser width. And if you're designing too wide, your readers could still be scrolling horizontally. And that's just annoying.
Comments
Small monitors (800×600 and smaller) tend to run maximized, while the larger they are the less likely it is.
In the article on justaddwater.dk I do not really see figures to support this besides ‘rarely maximized’ and other vague terms. I just can’t imagine a lot of people do not maximize their browser windows. I almost always do (of course, not on 2 screens when running dual monitor) and I see most of my colleagues do the same…
Hi Frank, The problem is, there is no way to get those statistics across the wider browser audience. All any of us have is anecdotal evidence. For every 3 examples you have of people maximizing at larger resolutions, there will be 3 people who say they never maximize.
Frankly, even 10+ years ago when Windows 95 came out, I didn’t maximize my NetCruiser windows - it never occurred to me (I’m dumb, I suppose). And once I got a monitor larger than 800×600 (about 7 or 8 years ago) I almost never maximize any windows.
We can’t assume that people do maximize just because we do - or don’t maximize just because we don’t. That’s what makes Web design so interesting, right?
Hi (gh?) Frank,
Leaping Lame Logic, Batman !!! What is he thinking ???
If our job is to get the best from the visitors, who we ‘no’ ain’t real real real smmart like us guys; why would we pretend that they operate like us? Duh !!!
At the risk of being rational, maybe it would be better if we surveyed actual visitors.
Patrick
Funny comments. If the window is too small to fit the content so you need to scroll… then I thing you will go to the maximize button. You will not scroll the small window don’t you? I think biggest impact on the difference between screen resolution and area for web site rendering are toolbars and history/bookmarks panels. Most often you lose in height as people tend to keep horizontal toolbars visible all the time
We can’t assume that people do maximize just because we do - or don’t maximize just because we don’t. That’s what makes Web design so interesting, right?
That was exactly my point I guess
. Since you just can’t know you shouldn’t draw conclusions, only mention it.
It should be measerable with javascript though by comparing window size to screen resolution.
VB: personally (and I’m speaking only for myself not for any “mass” of people) if the window is too small that I have to scroll horizontally, I tend to hit Alt-left arrow (aka “Back”) and search for another site that answers my question. I don’t have the maximize keyboard shortcut ingrained in my hands, but back most definitely is.
Why not just make the site dynamic? for example design for 800×600 but if they have a larger res. or browser size have the page adjust on its own? It’s not too difficult to do. To do well is another story.
The fact is that most people DO browse with their windows maximized. Try to recall when you were a novice at surfing and you cruised on to a site that required horizontal scrolling. What did you do? You maximized your window to see all the content. You were trained to keep it that way or else published information was omitted or you had to scroll. Designers didn’t and don’t cater to resized browser windows. That’s entirely too much to consider!
Why is this a hard concept to grasp? The focus should be on resolution, not window size.
I teach business classes at a technical school and many of the students are not very proficient at using computers when they arrive. Half of them wouldn’t even know what we mean when we say “maximize your browser window.” Of course, this is not because they aren’t smart, it just has to do with experience.
What I see is that they generally leave the browser window in whatever state it is in when they open it. But as Jennifer said, this is just anecdotal evidence.
As a web designer, I realize this doesn’t really resolve the issue of a target width to design for, but it does reinforce the idea that we cannot assume very much about the state of the end users browser.
One of the things that I try to drill into the heads of my students when teaching business communication is how important it is to know your audience. So, like Patrick said, ask real members of your target audience.
The frustration exists in never knowing what is the right specification. So whenever I or any of my colleagues design, we focus on what we know (or are able to learn) of the client’s primary audience, and then perhaps make a slightly more conservative recommendation. After all, it’s our challenge to make the content work within the specification, and prevent those users from hitting the back button. Can our work be considered successful if it repels the very audience it’s intended to engage?
Anecdotally, I don’t maximize for a couple of reasons. There’s hardly any reason to, since almost every site is meant to be viewed in much smaller space. And I usually don’t wish to fill my screen with only 1 application.
I have a slightly different but closely related question to this. How do you test for different screen sizes?
In my case, I have a 20-inch wide screen monitor. Now I know most people are not going to have that. Even if I design a liquid layout, with my monitor, how can I tell what it is going to look like on a 1024×768 regular monitor?
Thanks.
I need to clarify. I know you need to use a script to test for screen size. What my question is, when your testing your page how can you tell what it looks like on different screen sizes.
Thanks.