It all depends on the target market - for example if you are making a site for gamers, you should look at the Steam HW survey, where 1920x1080 is used by 25% of people. 1366x768 is a distant second with 15%. Source: http://store.steampowered.com/hwsurvey
But these numbers shouldn't be used to determine what size to make a website. I'd guess most people with 1920x1080 monitors don't maximize their browser.
Many web sites are not designed for people who retain older technology for financial (or other) reasons. Every web developer should befriend someone over the age of 60 and watch their surfing habits.
While this site is sort of useful for looking at screen size, it gives the false impression that users don't scroll. They do. Don't ever show this to anyone that isn't fully aware of this, else you'll fall into the trap of trying to put everything "above the fold", a terrible prison to escape.
Above the fold design is critical from a marketing standpoint. But you're right, everything doesn't have to be above the fold.. if anything the above the fold should be designed to encourage readers to scroll below the fold.
One thing to note is that if you have a site that dynamically re-sizes according to the browser window (by for example using percentages in CSS), then you will physically have to drag your browser bigger and smaller to see how much a user with a smaller display size would see.
Really? I always maximise my browser and usually dislike not having windows full-size on my screen. It just gets fiddly otherwise. Also I like leaning back as I surf, and I need a big browser window and 120-150% page scaling for that.
Using someone else's computer with a browser that isn't fully maximised irritates me, but I generally only see that on Macs. I don't think it's very common on Windows.
Everyone is different. I know a ton of people who always browse with 80+ tabs open. I find I fall into that weird trap sometimes too. Though because I have iChat and Twitter open, my browser is usually never full screen.
I would not be so sure at that. I see plenty of people doing that.
It's mostly habit, I think. Even somewhat technically versed people do that (many of them who have been working with computers for more than 15 years).
Sad that our pixel density hasn't gone up since the 90s, really. Tv ruins people with 42" screens at only 1080p. I'm glad to see that Apple is showing people that pixel density matters more than resolution alone, and I await their high-density MacBook displays. Hopefully they'll be out this fall, but a quick survey of the 4K-rezo landscape suggests that they'll likely have to wait another year for prices to drop :/
"A survey made some years ago by Bernard Lechner, a television engineer at the former RCA Laboratories, near Princeton, New Jersey, showed that the median eye-to-screen distance in American homes was nine feet. At that distance, a 1080p HDTV set (with a screen 1,920 pixels wide and 1,080 pixels high) needs to be at least 69-inch across a diagonal if viewers are to see all the detail it offers."
When I play games on my XBox, I need to pull up a chair so I can sit about 5-6 feet from my TV. My couch is about 10' from the TV, and I simply can't make out the detail as well from that distance.
Thanks for this; I was going to bring it up if no one else did. Yes, the average human eye is sharp—acuity of just under a hundredth of a degree—but not sharp enough to need that resolution at such distance.
Not to mention that everything people watch on these TVs is compressed to into a mottled pastiche of crap. You're not even getting 720P's worth of resolution on your "1080P" set while watching your 5-mbps "HD".
Exactly, and 98% of people don't care or even notice the difference. It takes experience working with video to know what is actually higher quality and what is overcompressed, bitrate-starved crap.
I don't care so much about pixel density; it's the ratio that bothers me.
16:9 is ridiculous for anything except watching HD television. (It also now works well for gaming, but only because developers decided to cater to widescreen.)
16:10 is the widest that makes sense for any day-to-day computing tasks, yet it's getting harder and harder to find; forget reasonable 4:3 types.
Depending on my task, I may rotate the 1920x1200 screen in front of me 90° to 1200x1920. I find that much more useful for reading large amounts of text and/or code. The underlying OS supports it, the monitor arm this display is mounted on supports it, yet everyone on the job was remarking simultaneously how odd it was and how useful it seemed as they were shoulder-surfing while I picked through a large code-base. A full-screen Terminal window on this monitor in landscape mode is 270x81, which is just plain silly, but 81x270 in portrait mode is very, very useful.
I have two such rotated displays on my work desk side-by-side to get a 21" x 23.5 combined screen. The problem I get is that viewing angle on average displays is pretty week in the vertical angle (great, so nudge it up or down an angle) - but if you put it in portrait mode, this acute viewing angle really hurts - just moving your chair from one part of the desk to another can expose it.
Unless you're going with IPS displays, the portrait mode of a monitor is somewhat compromised.
I used a TN display in vertical position for a while and it sucked. If you moved the head just a little sideways the colors completely changed, and after a couple of hours I started to feel nausea. My doctor told me it was because the eyes are seeing different images (each eye saw the display at different angles, and because of the poor vertical view angles the brain received different colors and light and had to compensate - like using polarized 3D glasses). Now I use a combination of vertical + horizontal 16:10 IPS displays and it's way better. I mostly use the vertical one for web browsing and doc reading.
>A full-screen Terminal window on this monitor in landscape mode is 270x81, which is just plain silly, but 81x270 in portrait mode is very, very useful.
Except you are not going to get 81x270 characters in portrait mode unless the characters are square, as in Chinese script.
Very useful indeed. I use a similar 1680 x 1050 rotated 90º (so it's 1050 x 1680) with a browser. When I'm doing frontend work and having a browser fullscreen gives plenty of room for the viewport and web inspector or firebug. It's a real productivity improver.
I'm a fellow 4:3 fan. I understand why width is more useful to some users than height, but I feel like it's a monoculture.
Beyond that, I feel like computer buyers everywhere have been duped. In 2003, there were 15" laptops with QXGA (2048x1536) screens. by 2008, the best you could get in a 15" laptop was WUXGA (1920x1200). Now, with a few soon to disappear exceptions, it's FHD (1920x1050). Note how these are not getting wider; they're only getting shorter.
Sony made (and may still make) a clamshell PC intended to fit in a coat pocket with a 1600x768 screen. I'm not sure how they marketed that aspect ratio.
I have two 1650x1050 displays side-by-side (so, twice as a wide as "ridiculous"), and I run three 80-char width terminals or two web browsers side by side per display, using xmonad. I like it.
For what it's worth, just last night I was dicking around on Newegg looking at laptops and found that a Panasonic Toughbook appears to support 1900x1200 at 15", which is ~1.5 aspect ratio (4:3 = 1.333; 16:9 = ~1.8). The relevant term you want to search for is "WUXGA".
Ubuntu Unity. 1920 by 1080 on a no-name LCD LED monitor. Launcher on left set to 32px. Browser in right half, terminal/Gedit in left half (use the shift-alt arrow key shortcuts to semi-tile).
Might consider a second 1920 by 1080 to get to 4 million pixels on the cheap
I also keep the taskbar vertical. The important thing if you use a mouse is to have it on a side that's not next to another monitor so the cursor stops at the edge.
The monitors I work with are 20:11. Hard to find, but I enjoy them. Let's me tile two 1024 width windows side by side - good for doing cross browser comparisons. Ratio doesn't bother me on a monitor, I can always find some way to utilize it. I would appreciate a higher pixel density though.
I have one 16:10 screen, and then a few years later I want to have two 16:10 monitors... but no luck finding one for a decent price. :(
Now i Have one 16:10 and one 16:9 (I suggest not doing this because you will look at the differences every day)
Agreed. If you're going for two monitors, you should try to get the same model. Otherwise you'll spend a lot of time fiddling with color settings and still never get them to quite match.
The users don't have a choice for the most part and it's a small enough difference that most don't know about it. That doesn't mean it doesn't negatively impact people. If you want a non-16:9 laptop you have to buy Apple.
When my WUXGA-screen Dell Lattitude failed I went looking for a replacement. But Dell decided to stop offering ~15" WUXGA screen laptops; it was all "wide screen" (aka "short screen") now, which meant the loss of a row of 200 pixels.
I ended up getting a Thinkpad W500 from a Lenovo outlet.
I should probably start looking for replacement parts now because when this one goes bad I'll again have to fight against whatever the media-consuming, non-developer market is being sold.
The migration of the monitor industry to 16:9 wasn't one sided. Given the option between 4:3 and 16:9, users overwhelmingly chose 16:9. Eventually the demand was so unbalanced that 4:3 became less common.
Really the notion that manufacturers, except for brave Apple, unilaterally decided to force this on users is completely asinine.
The GP claimed that it was "ridiculous". What horse shit.
But consumers did not choose 16:9 over 16:10, because consumers cannot tell the difference. We can thank TV panels for that switch:
LENOVO: "Again, we can thank the LCD manufacturers for this change. By cutting everything in the same aspect ratio, they have less waste per large sheet of glass. Since these manufacturers make more selling TV displays than laptop displays, the PC vendors have almost zero say in this change. We simply have to adapt."http://blog.lenovo.com/perspectives/display-ratio-change-aga...
> Really the notion that manufacturers, except for brave Apple, unilaterally decided to force this on users is completely asinine.
In the case of the iPad, it's completely true. Apple decided that 4:3 screens were the best form factor for a hand-held tablet. So they made 4:3 happen, rather than settle for common and cheaper 16:9 or 16:10 screens. Guess what ratio Android tablets use.
This has nothing to do with 16:9 or 16:10. This is 16:9 over 4:3.
In the case of the iPad, it's completely true. Apple decided that 4:3 screens were the best form factor for a hand-held tablet.
I have both an Android tablet (A500 with ICS) and an iPad 3rd generation. I -- without doubt -- prefer the form factor of the A500, not just because it presents a much better experience when viewing videos. It's simply a better form factor. Apple is not all knowing, and their reasons for choosing their form factor are, as always, more nuanced than what is "right".
So they made 4:3 happen, rather than settle for common and cheaper 16:9 or 16:10 screens. Guess what ratio Android tablets use.
When Apple made the iPad pretty much the only 10.1" screen was a 4:3 1024x768 netbook screen. The claim that "Android" (and every other tablet maker) chose the cheaper screen -- one that didn't even exist -- is a bit hard to stomach.
Computer/laptop monitors didn't switch directly from 4:3 -> 16:9.
They moved from 4:3 -> 16:10 -> 16:9. And the switch to 16:9 happened because of panel cutting and cost, not because of consumer demand.
From the link in my previous post, Lenovo could not keep using 4:3 screens because they had "all but disappeared from the market."
The vast majority of netbooks released in the 2007-2010 range were widescreen, so I don't know where you're getting this idea that 4:3 screens were easier for Apple to source for the iPad.
Or the claim that non-Apple tablet makers aren't simply choosing the cheaper and more common screen format. None of the mass-produced Android tablets have the same form factor as the proven hit, 60+ million units sold iPad. Why?
They moved from 4:3 -> 16:10 -> 16:9. And the switch to 16:9 happened because of panel cutting and cost, not because of consumer demand.
I do wonder if there was some consumer demand, or at least rising consumer acquiescence, because (I'm speculating) as laptops have become less expensive and more powerful the market consisted of relatively fewer developers and business people and more folks who see their computer as an entertainment system.
Definitely agree that widescreen has become common due to customer preference. But is 16:9 over 16:10 really a selling point (or even noticeable) to the average laptop buyer?
It probably has been used as a gimmick competitive advantage ("even more widescreen than before!") but I bet the 16:10->16:9 move was predominantly due to screen supply and cost.
None of the mass-produced Android tablets have the same form factor as the proven hit, 60+ million units sold iPad. Why?
Aside from some dirty cheap Archos 4:3 tablets (which were actually 4:3, and still dirt cheap, before Apple unveiled the mighty iPad), they don't because it isn't a benefit. Again you're drawing from the notion that Apple's choice is right and everyone else's is wrong, which is a pretty questionable starting point.
Regarding the cost-cutting, it absolutely was cost-cutting to move from 16:10 to 16:9, and few complained because really is it different enough for many to care? It was not cost cutting to move from 4:3 to 16:10 beyond that users demanded a wide screen overwhelmingly, not least because playing video on our desktop became so common.
"Again you're drawing from the notion that Apple's choice is right and everyone else's is wrong, which is a pretty questionable starting point."
Like how your opinion that 16:9 is better somehow isn't a questionable starting point? Sure, you might like 16:9 more, but most people seem to prefer 4:3 to 16:9. I myself have a 4:3 Android tablet (a mongrel: the HP TouchPad) and I have to say, between using this and a Transformer, I much prefer 4:3 on a tablet. It's easy to hold portrait or landscape, whereas with a 16:9 display, holding it portrait is awkward. Not only that, but 4:3 portrait mimics a book page much better than 16:9 does and so I feel more comfortable with PDFs on 4:3 than 16:9.
I think monitors should go back 16:10 (compromise between screen real estate and widescreen appeal) and tablets stay at 4:3 (only because of the use cases for a tablet).
I think a 4:3 screen is much better than 16:9 for a tablet, especially if you're holding it in portrait mode, which is usually how I try and hold a tablet. It's like a piece of paper. 4:3 is simply a better form factor (see what I did there). To each their own.
For reference (everything else has been covered by the other poster replying to you) I was talking about the 16:10-16:9 move forced on consumers. 4:3-16:9 didn't happen directly, there was a brief stop off at 16:10.
"it presents a much better experience when viewing videos"
How? You hear this same claim all the time, never with any explanation. It's not as if you're LOSING pixels or screen size watching video on a 4:3 tablet. They're simply going unused.
Actually, 4:3 presents a BETTER viewing experience, because transport controls, captions, and data about the video can be presented above or below the image area, instead of over it.
It's not as if you're LOSING pixels or screen size watching video on a 4:3 tablet.
What? Of course you are. Have you never used Netflix on an iPad? Gigantic black bars above and below. I suppose you could grossly distort the image and vertically expand it, but no thanks.
Actually, 4:3 presents a BETTER viewing experience
Absolutely preposterous. So preposterous it merits no direct response.
If the black bars bother you then cover them with tape. You are not loosing anything because they are there - you are gaining height.
Just because the pixel exists doesn't mean you are required to use it.
Opinions like yours are apparently common, so what manufacturers do is remove those areas. You get less pixels, and like it better. Totally preposterous.
Taller screens are better - even when watching widescreen. The extra space is useful for playback controls, closed captions, etc.
You still don't say how you're LOSING pixels. If you had your way (a widescreen tablet) they'd simply chop off the extra pixels to change the aspect ratio. You gain NOTHING.
You also fail to say why putting controls, captions, and chapter indications in the empty space instead of OVER THE VIDEO IMAGE is "preposterous." How is having the video obscured with overlays BETTER?
In short: Your response fails utterly to support your claim.
I wonder how much of that is due to the fact that it cheaper to make a "15 inch" 16:9 screen than a "15 inch" 4:3 screen. The later is bigger, but your typical consumer shopping based on marketing materials won't be able to figure that out.
So glad the specs of pro development/business machines like the aforementioned Dells and ThinkPads are being influenced by the $299 laptops at BestBuy.
Pixel density isn't the real problem, it's the lack of content. Even though there have been Full HD displays for quite some time most of the HD content is only 720p, especially games on current generation consoles.
I think the problem is that laptop screens are usually marketed as "15 inches" or something, without any mention of what the pixel density is. And for older people large screens with low pixel density might be easier to use.
I'm glad to see that Apple is showing people that pixel density matters more than resolution alone
What the heck....pray tell me that this is some sort of parody or satire?
Those 42" 1080p screens were "retina" displays before Apple decided to excuse lazy graphical scaling with the title. You are so off base holding Apple as the leader that you must be playing soccer.
EDIT: Downvotes, yet the parent is making such an astonishingly revisionist claim that it should be obliterated purely for such fawning ignorance.
14" 1920x1200 here....laptop is from like 2008 (c2d Dell Latitude D830.)
I won't upgrade because the "upgrade" has 1920x1080, and being a Sysadmin, vertical pixels lost means less lines in my term and more scrolling. It's a shame that we moved from 16x10 to 16x9 to save a few bucks. Last I checked, Apple and levovo (w-series) still offer 1920x1200, but my laptop cos $280 used, and the lenovo or MBP would be close to 3 grand.
I've enjoyed 1920x1200 on my laptops since 2003, and I lament this demise, too. I can't match the resolution I had nine years ago.
I'm a hardware engineer, and the more pixels I can pack into my display, the more I can see in my waveform viewer. It makes a real difference to me.
I can't say I fully understand the trend to almost-exclusive 16x9, either. I hear enough people complain about it that I'd have thought there would be a market for a 15.4" 1920x1200, even if you had to pay a premium for it.
I can't say I fully understand the trend to almost-exclusive 16x9, either.
I've read that this is because of the influence of TVs: pretty much every LCD maker is setup to cut panels in this form factor, and there isn't enough demand to make computer makers change this.
A couple years ago I saw a Lenovo blog post about how they could consider making taller laptop screens if, say, they got $20K pre-orders, but even then it would've been very, very expensive for the clients, and I don't think the idea ever went anywhere.
Sorry for the mistake and thanks for the correction, like this I learned something. English is not my native language, I guess I took the "contra" from German "kontra".
I actually don't think it's a mistake. Contra and counter are synonymous, but one is more common (as far as I can tell with brief googling). I learned something too, no need to apologise.
One of the senior managers at a place I worked in 2001 had a 15" 1600x1200 Dell (Inspiron 8000). Now it's nearly, if not completely impossible to find that many pixels in a comparable form factor.
Glad to see the i8k mentioned. I have one, its screen is indeed an incredible thing, and it's still working in tip top condition today. I find tech kit either breaks within weeks or lasts forever.
I still use a notebook from 2002 with 1400x1050 with an IPS screen. Ten years since, I can't find any notebook with an IPS and 4:3 (only tablets, thanks to Apple) and I'd really pay for both features on the notebook with an i5 or an i7 CPU.
I hoped increased demand after iPad's success would make IPS and 4:3 reappear on notebooks .
1024x768 is still the best window-size for browsing (and most other tasks as well) in my opinion. Don't get any silly ideas of designing a web page for wider than 1024 pixels (the only thing I miss out today is in the "worst" case ads).
"Don't get any silly ideas of designing a web page for wider than 1024 pixels"
Do you think there's anything wrong with fitting the essential information within 1024 pixels, but then putting non-essential stuff to the right of that?
I agree with tjoff; just because a majority of users' screensizes are increasing, doesn't mean we have to keep "upping" the size of our webpages accordingly.
I don't think the guy that just bought a brand-sparkling new 27" cinema display really wants all the websites he visits to now start filling his entire screen -- he bought it to do multiple things at once.
Speaking from experience, I keep all my browsers at around a 1024px viewport and I get frustrated when I visit a site and need to scroll horizontally.
I think the best target size for webpages is still 1024px with 960px^ as its main content area size. The 960px grid is still very strong and useful and there's nothing wrong with it -- I would even go as far as to say that it's a "standard". (http://960.gs).
I agree. This is a use case of browsers that almost everyone misses when they design websites.
Very few sites aim for 960 as their minimum[1]. I tried side-by-side viewing on a 1920x1080 monitor and it really didn't work out in most places. Even parts of Wikipedia (such as tables) will create horizontal scroll bars on certain articles.
I did notice that a lot of websites aim for 1024 instead of 960 because I saw many pages that almost fit. Please, if you can aim for 1024, aim for 960 instead.
[1] As the parent post said, it probably isn't quite 960 when you take window borders into account.
I'm a bit skeptical, I'd probably see that there is something to the right and would have to scroll just to see whether it was non-essential or not.
If its a site I regularly visit that is not a problem though, but what is non-essential to you might be essential to me so I'd be happy if there were small duplicate links in the footer or something.
I guess it depends, but in general anything besides ads further than 1024 pixels to the right annoys me.
By the way, I'm using 11 inch mba as my main dev machine and here's how to take advantage of 16x9 displays if you're using emacs:
- you can split your emacs frame into multiple columns with C-x 3 (and balance them with C-x +), this way you can see two or even three files side by side.
- you can use emacs follow-mode which creates one virtual window split into multiple buffers, which is very useful for 768px high displays.
That's funny—I was recently trying to see if any non-emacs text editors have follow-mode or something like it. Textmate, Sublime, and a few others don't. Really aggravating for someone like me, who finds emacs overkill and as intuitive as launching a spaceshuttle.
EDIT: Oh, and I'm using a 27" iMac, so I have lots of screen real estate.
I am going to be so angry if[0] this makes web devs start designing for grids that have to be 1300px wide to work. I don't fullscreen anything (too wide for the height, and too wide for the font size!), and while the majority of webpages look just fine in a ~600px wide browser window, possibly after right-scrolling to put the content column in the window, rarely does a day go by that I don't have to tear off a tab and widen it---not to make it look good, but to make it usable at all. Like that crappy Bump page posted here earlier today: if you view it in a narrow window, even if you right-scroll the window the content is sliced at window-width, with the page absolutely unusable at anything less than my full screen width. I don't know if there's anyone out there still on an 800x600 resolution, but there's a significant portion of the web that they actually can't use in any way. It doesn't have to be that way!
[0]Realistically, I know it's "when", but I'll stick with the denial a little longer.
I love it! The Boston Globe website (boston.com) had at one point demoed a similarly responsive front page, but they seem to have switched back to their old annoying format.
I felt like sharing this info here because it matters to me more than pixel density or aspect ratio.
It turns out that GPUs like the popular Intel integrated gfx chips requires each lines of your framebuffer to be 64 bytes aligned. And yet, when using a 1366 wide resolution in 32bit per pixel mode, the visible length in bytes of a framebuffer is 5464, which is not a multiple of 64.
The operating system circumvent the problem by allocating 5504 bytes for each line of the framebuffer instead of 5464. It represent a loss of 30KB of unused memory.
Anyway, you're probably think I'm mad to care about those things instead of pixel density or aspect ratio, and 30KB is definitely meaningless compared to the memory footprint of a complete framebuffer (which is around 4-5MB). But you know these people who can't stand having the volume bar set to an odd number on their television set ? I'm exactly like them, why in hell would you not use an horizontal resolution which is not a multiple of 64 ?
I'm not sure that the data provided by StatCounter is representative of global trends. They're stat counters are installed on 3 million sites which sounds like a lot. But if you take a look at the distribution of those sites globally they're not evenly spread.
What about tablets? How does the iPad's 2048 x 1536 resolution work out in the real world? I assume web sites don't appear in a 1:1 pixel ratio, or a 960 pixel wide site would appear tiny in the browser.
I use the 960 grid from http://960.gs/ when I build a site, and I find that sites on my 1680 x 1050 monitor look great at 960 pixels wide.
I would assume that sticking with a 960 pixel wide grid is still optimal, but I'd love to hear people's points of view.
It still identifies as 1024x768 and will look just like it does on the previous iPads (albeit with sharper text). It's just like how the iPhone works the same regardless of retina.
well the 13 inch macbook pro is the most popular apple laptop and netbooks/ultrabooks seem more popular than 17 inch behemoths so I guess somewhere around 13 inches is right
Another noob article on Hacker News. Dismissing mobile screens in this count? How ignorant!
Calling it responsive design? Do your job and show the website on any device. You noobs are embarrassing. PHP blows, which is probably why you suck so bad.
the marketing wizards dictating design feel consumers want screens with a letterbox presentation, if it's square it's preceived as old, low-def and undesirable.
WTF? How did this bizarre resolution even become an accepted "standard"? It emerged with plasma TVs of five years ago or so, and was baffling then. After that, it started showing up on netbooks. Now it's the most common?
The 11" MBA is 1366 x 768, but the 13" MBA is 1440 x 900. The 15" MBP has been 1440 x 900 since 2006 but in 2010 added an upgrade option to 1680 x 1050.
As far as I know, the 11" MBA is the only Mac to ever offer that resolution.
