Slashdot Mirror
Today's Average Screen Resolution?
ShadowDawn asks: "I'm looking to develop a website for average computer illiterate users and I'm just curious what the average users screen resolution is, now a days? I know 800x600 used to be the main size to develop for, but last I had seen 1024x768 was taking over. I was just wondering if anyone out there ran a 'normal' site that 'normal' people visit and would have some insight."
The funny thing is, resolution shouldn't matter much anymore. If you switch to a higher resolution, things shouldn't suddenly look a lot smaller, they should look sharper!
I suffer from attention surplus disorder.
We have about 50% at 1024x768 and about 20% at 800x600. The rest is a wide mix with the common ones being 1280x1024 and 640x480.
Please don't force me to maximize my browser window just to noodle around your site(s). Do your HTML/CSS so that your web pages adjust with the size of the browser window. Please don't hard code table sizes in pixels and other such idiocies.
Why not just try to make the site work on a wide range of resolutions, as that way you will not be alienating that many people. It is not impossible to make a website that will stretch to large resolutions, and shrink to fit the smaller ones.
Personally I think 1024x768 and 1280x1024 are the two important ones to make sure the site works properly at, as 1024x768 seems to be very popular, however 1280x1024 is the native resolution of a large number of TFT screens.
I used to have 1600x1200 on everything, but none of my flat screens go that high - so the screen resolutions that people use have dropped a little from a couple of years ago when everyone was buying desktops with CRTs. I know a lot of people are even foregoing the desktop and just using a laptop instead, that's shrunk down the resolution as well.....
Some of your users will have huge 1600x1200 LCDs. Others will be running old hand-me-down 640x480 VGA monitors, or nice monitors with that stupid default resolution of Win95/98.
/any/ attention to "resolution".
But it doesn't matter. What you do is design your site in standards-compliant XHTML, using CSS for formatting (not tables), and let the user's browser render it however is best for that particular platform.
Web designers (and I am one) should not be paying
--
Twoflower
Don't design for a resolution, thats just as bad as designing for ie. Make a webpage, *TEST IT* in 800x600, 1024x768, 1600x1200, whatever, but don't design it for something. It should work fine in all resolutions, not having half the page wasted on blank space, or text overlapping, or any other problem that comes from bad web developers saying "thats okay, it works in what I designed it for"
Pain lasts, kid. Its how you know you're alive. Sometimes I think this growing up thing is just pain management-TheMaxx
I think your target audience should be a big factor. Do you see there being a good chance that elderly people with bad eye sight could be visiting it often? There are still a lot of people out there with 800x600 resolutions. If you develop at a higher screen res then you will look like you don't really know what you are doing in the eyes of those people and it is so easy to hit back and look through other google results that have a design more suited to them.
On the other hand if you are developing something that primarily kids/teens/young adults will be visiting then you could probably safely bump it up to 1024x768 or maybe even higher, but that might be pushing it.
:wq
Stop.
Please.
You are the bane of the web browser.
Sites should be usable and viewable with any resolution with any web browser.
We do not want an art exhibit, we want a web page. With stuff on it. Knowledge.
I for example, frequently browse at 320 pixels across. I don't visit sites that don't work at that resolution. My employer uses his Treo frequently and has even worse to say on that.
But my resolution? Well above 2000 pixels across.
See, just because some web browsers (the users, not the programs) browse at full screen doesn't mean everyone does it.
Web pages are not canvases- they do not have a size, and by artificially attempting to create one, you are doing the web a disservice.
On the other hand, by treating them as such, chances are you have so little to say that it isn't useful at all in which case myself, and other web browsers simply won't visit your site.
You will of course think it has something to do with the modernness of your design and make it even less usable.
The cycle will continue.
And nobody will notice.
W3 Schools doesn't just include browser stats. They also track metrics regarding screen resolutions currently in use.
a sp
http://www.w3schools.com/browsers/browsers_stats.
MTW
Why do you want to know the screen resolution? That isn't going to tell you what the viewport size is. Non-maximised browsers, browsers with sidebars open, larger than default scrollbars... there's huge amounts of ways in which the viewport size can differ from the screen resolution.
More importantly though, it sounds like you are trying to design a website with a fixed width. That's not necessary. Use percentages, and your layout will expand and contract to fit a wide range of viewports, without leaving an ugly and wasteful gap down the side in larger viewports and without forcing horizontal scrolling for smaller viewports.
I'd like to pre-empt the people complaining that longer line-lengths are harder to read by pointing out that there's evidence to suggest that those studies, while perfectly fine for print, don't apply to computer displays, and in any case can be mitigated by using max-width in ems on <p> elements in a user or author stylesheet.
I'd also like to pre-empt the people who say "but average users don't change the defaults!" by pointing out that, if true, would mean that the average user would be using a non-maximised browser window, as per Internet Explorer and Safari defaults.
Bogtha Bogtha Bogtha
If your intended audience is the average computer illiterate, you should probably expect plenty of people still operating at 800x600. I know a lot of people who are perfectly happy with their old K6-2 and crappy 15" monitor, and have no plans to upgrade while it still functions. It sounds like those people are your target demographic.
That said, here is my opinion on the metatopic of which this is a part: If you don't clutter up your site with a bunch of unnecessary formatting crap, flash nonsense, menus, table, frames, etc., it won't matter what resolution your users are running at. HTML reformats itself to fit the display quite nicely as long as you web developers allow it to function as it was meant to.
The vast majority of the time, "good design" means less stuff, not more.
Under capitalism man exploits man. Under communism it's the other way around.
You're going to use a bunch of tables for presentation as well, aren't you?
What Would Google Do?
Seriously look at a website designed for your type of people. AO Lusers.
You should expect whatever the computer came with (probably 800x600) with EVERY TOOLBAR EVER INVENTED. Plus a search side bar taking up about 1/3 of the left side. Oddly enough, those people hate surfing the net.
When sites are designed using a fixed width such as 800x600, the layout aften depends on assuming a small font size so that elements align properly. My banking site is one such web site. When the font size is increased, elements can overlap to shift to the next line, losing some of the contextual imformation of their placement. At worst the elements may be overlapped by other elements thereby obscuring whatever it is that you needed to see. I see this happen often with navigation items.
My recommendation is that while you are designing your site, use the keyboard shortcuts for font increase and decrease in Firefox to test and make sure that the page looks as expected. Another option would be to create another Firefox profile with the font set to 20 points and the minimum font size set to 14. This is what I use in my Firefox settings. I have a small laptop screen with a resolution of 1400x1050 which, when combined with my poor eyesight, has made a font size like this required for easy reading.
I also want to stress that if the layout of the page breaks a bit, that is fine. Most users that browse with a large minimum font size are used to seeing the page mess up a bit. There are sites such as Slashdot and Wikipedia that continue to look fine at any font size. Others might be using absolute positioning for DIVs and may have navigational and other elements obscured when the font is large. The important thing is to make sure that the elements on your page that make it functional still work. If something isn't aligned correctly but it's not a big deal, don't worry about it. If the navigation is only partially visible because of the larger font size, then you should fix that. For example, last.fm has some display problems when a larger font size is used, but nothing that impeeds navigation or general usability.
Finally, let me stress that you should avoid specifying your font sizes using a fixed method such as pixels or points. Instead, please use a relative font size such as "x-small", ems, or a percentage. There are still many users that use IE. IE will not resize fonts that use a fixed specification such as pixels and points, even when the font size option in the browser is changed from the default.
Slashdot: Failed Car Analogies. Amateur Lawyering. Anecdote Battles.
Looking at google analytics for vadiumgroup.com I can see the following
58% 1024*768
17% 1280*1024
14% 800*600
1% below 800*600
10% above 1280*1024.
So, looks like if you built for 1024 you'd safe for 85% of the market, not bad.
Now this is no excuse to make a site that's unuseable at 800*600. You can use percentages almost everywhere and have your design scale for all resolutions.
Do not meddle in the affairs of sysadmins, for they are subtle, and quick to anger.
2560x1024. Please make pages wider.
Dear fixed-width naysayers:
if you've ever done real-world web design that requires graphics, you'll realize this is a very important concern. If possible of course you'll want to make your website as scalable as possble. But just as different browsers behave differently (not just IE) and you have to sometimes find a good median solution, you need to do that with screen size, as well. And when you include graphics suddenly percentages go out the window, since many browsers won't resize images very nicely. Bicubic interpolation is nice, but not widely instantiated. Plus do you want to serve huge images that will get scaled down and increase load time like crazy? Or serve small files that when scaled up look crappy? The web is currently a nest of compromises and this concern is just another one. But it's a valid concern to be aware of, and to work into the design if you're at all concerned about "standard" view for a majority of viewers.
Seriously. I do most of my browsing via Links 0.99 on a 21" monitor in text mode.
I tend to use either 1600x1200 or 1280x1024 on GUIs, but that also varies (some of my older 17" monitors are limited to 1024x768).
Mainframe/UNIX Bit Twiddler and long time Windows/Linux Hobbyist.
The Theorem Theorem: If If, Then Then.
I see a lot of "if you're a good web designer, you won't care about resolution, and you'll be smart enough to make your sites resolution-independent" kind of comments in this mix here. Yeah, there's something to that. The web isn't the same as the printed page, after all.
But you'll notice that many--not most, but I'd honestly say the majority--of professionally-designed web sites that are text-heavy do use a fixed width for text blocks. Despite what some people here seem to think, sites that do that are not designed by ignorant graphic designers too stupid to use good design principles. They're designed by graphic designers smart enough to know that "the web isn't the same as the printed page" doesn't mean that everything we've learned in centuries of typography and layout is merrily tossed out.
One of the basic rules of typography is that line length affects readability. You can play around with the length for various effects, but a block of text that's wider than about 39 ems and longer than a paragraph or two is going to be harder to read. This still applies on the screen.
There's an implicit attitude among a lot of hardcore tech types that graphic design doesn't involve actual work -- we're just sitting around stapling Dreamweaver templates over your glorious PHP, and that any design decisions we make that aren't The Way Engineers Would Do It are proof that we're clueless. I'm sorry you guys resent any use of the web that couldn't have been done in HTML 2.0, but it's time to take your hands off the VAX keyboard and back away slowly.
I agree that when you're designing a web page, you shouldn't be thinking too much about the user's screen resolution, but the reality is that I'm probably not going to be designing my page so it will fill up your 2048x1536 display; I'm going to be designing my page so it's going to be readable on your 2048x1536 display. And that may just mean designing for a specific width. Get over it.
You're right -- it's hard to do bad design with CSS. What's your point?
I said nothing of the sort, and that's factually ridiculous, but let's move on the the real crux of the matter:
I'll presume that you're talking about layout columns, similar to those slashboxes next to the comment you're reading now. And in that case, you still don't have a reason to use tables: five-year old CSS can put out a clean-looking layout just fine with DIV tags.
Yes, I'm talking about layout columns, similar to what slashdot uses, but you're missing the point. _Stylistically_, they don't operate the same as a table cell; the bottom edge of the div ends when the content ends, and thus doesn't line up with the bottom edge of divs next to it, so while you can layout content somewhat similarly horizontally, vertically, you cannot, say, place something at the bottom of a div and have it be at the same level vertically as something at the bottom of a div next to it, if they have different amounts of content. You also cannot STYLE them similarly, and have borders and such line up, because of the same issue. And if you have a border between them, it'll stop when the content stops, thus producing the need for all sorts of column-related hacks that you'll find at various CSS design sites. This is a hot topic in the CSS design world, so I'm going to assume you're not a professional here, or you'd know what I was talking before this. Just trust me here - divs do not act like table cells, though they have some traits in common.
The worst part of this is that this isn't a CSS implementation problem on the part of browsers - this is an intentional design aspect of CSS which is pretty ridiculous. Until CSS can truly let us do the same things table layout does, _some_ designs (not all) will require table layout unless you resort to hacks (which I won't do).
Like that? Here's some more image-related problems.
So do you have some tips for designing a site's top bar so that it will look good both in a 1600 pixel wide window and in a 320 pixel wide window?
It's kind of interesting; sites whose original, or primary focus was the web tend to get it right. Slashdot, Yahoo, The Register, Wired. Big media companys, OTOH, have absolutely no concept of sizeable web sites. Look at CNN, ABC, NBC, CBS, for good examples on how NOT to do it.
It is amazing what you can accomplish if you do not care who gets the credit. -- Harry Truman
- C.
I host a mix of special interest sites, personal webpages, and a commercial site on my server. Mostly non-geek stuff. According to our webcounter, these are our users' resolutions and color depths for the last three months:
39.3% 1024x768 @ 32bit
11.9% 1280x1024 @ 32bit
10.6% 800x600 @ 32bit
9.7% 1024x768 @ 16bit
6.3% unknown (javascript disabled)
3.6% 800x600 @ 16bit
3.5% 1152x864 @ 32bit
3.4% 1280x800 @ 32bit
1.6% 800x600 @ 24bit
1.5% 1600x1200 @ 32bit
1.5% 1024x768 @ 24bit
1.3% 1280x1024 @ 16bit
0.9% 1440x900 @ 32bit
4.9% misc other (not going to bother transcribing)
-- TTK
From a site that I maintain, a model railroad hobby site:
1024x768 44.95%
800x600 36.05%
1280x1024 8.96%
1152x864 4.53%
Other 2.59%
640x480 1.64%
1600x1200 1.24%
And, just for the halibut, from the same site:
Netscape 17.38% - MSIE 82.07% - Other 0.49%
Windows 91.84% - Mac 4.06% - Unix 0.78% - Other 3.30%
---
"I can't complain, but sometimes still do..." Joe Walsh