Jakob Nielsen's Alertbox, May 7, 2012  

Computer Screens Getting Bigger

Summary:
Reasonably big monitors have finally become the most common class of desktop computer screen, dethroning the 1024×768 resolution that was long the target for web design.

The 1024×768 became the leading monitor size in 2004 and has only just been dethroned by a (slightly) larger screen resolution of 1366×768, according to StatCounter.

The change over from 1024×768 to bigger screens actually occurred in 2009, but there were so many different larger-resolution sizes — including many widescreen monitors — that 1024×768 held its position as the single-most popular resolution until this year.

The following chart shows the evolution in computer screen sizes from 1999 to 2012 averaged across as many sources as I could find for each year. (Averaging reduces the influence of bad data in any one statistic.) This is for desktop and laptop computers; not mobile devices.

Implications of Bigger Monitors

The chart makes several things clear:

• Changes in screen sizes happen very slowly. Once people own a monitor, they don't upgrade it for years, even if they do get a new PC. This is particularly true in corporate settings, despite the productivity benefits from giving all high-paid staff members a 30-inch monitor (or bigger, if available).
• Small screens are finally so rare for desktop computers that we don't have to design for them. But now even smaller mobile screens have become popular enough that we have to consider small screens anyway :-(
• Big screens are now the most common class of desktop monitor (1280–1600 pixels wide). I call these screens "big" only in comparison with those that went before; in reality, even the size labeled "huge" in the chart is still too small for maximum knowledge worker productivity.
• In usability studies, the cardinal rule is always to test on the equipment used by the most customers. So, you should now run most of your studies with "big" monitors. You should also run a few sessions on "medium" and "huge" monitors to make sure that your design remains usable for people with different screen sizes. (For more info, see our full-day training class on User Testing.)
• For web design, I've always recommended avoiding "frozen" designs and instead ensuring that your design can scale across a range of screen resolutions (especially since the really important number is the browser canvas resolution, which is often smaller than full screen, particularly on huge monitors).
• Still, you must target something as the best case, where the design looks its finest (while still working on bigger and smaller screens). Since 2010, the core design target has been the big screen. For a few years, it will be safest to target screens in the lower range of the "big" category.

The old recommendation was to make your website look its best at 1024×768. The new guideline is to optimize for widescreen monitors around 1440 pixels wide.

Both old and new guidelines come with an important caveat: make sure that the design works almost as well at several sizes up and down from the core target. Thus, the term "optimize for" should definitely not be interpreted as "only working at."

Supporting Big Widescreen Monitors

Over the next decade, it's safe to assume that the trends from 1999–2012 will continue:

• The share of various smaller monitor sizes in the installed base will gradually decline. This will happen slowly, but it will happen.
• The screens labeled "big" on my chart will soon start dropping off.
• The screens I call "huge" will start taking over.
• Even bigger sizes will emerge ("super huge"?)

One more trend doesn't show in the chart: the change from fairly square screens (4:3 aspect ratio) to widescreen displays, which often have the 16:9 aspect ratio of HD TV.

Screens that are very wide but not particularly tall are well matched with the human visual system. However, they don't fit the way we currently design web pages: most web layouts are fairly narrow and very long.

Designers should start experimenting with ways to utilize horizontal screen space and create web pages that enhance usability for people with big monitors and widescreen monitors. (They should also use methods such as responsive design to continue supporting those smaller screens, which will be with us until decade's end.) 

Learn More

Full-day training course on Web Page Design: The Anatomy of High-Performing Web Pages at the annual Usability Week conference.

And more on human vision and perception in the training course on The Human Mind.