|
References:
Kalbach, J., The
myth of 800x600, March, 2001 (thanks to Terrence deGiere at HFI for
finding the article)
Adrian
Roselli (Aardvark) – note that this study reports slightly more
users for the 1024x768 resolution
Resolution Studies
A – dreamink.com,
March, 2001;
B – statmarket.com,
February, 2001 (click on Systems tab – requires a subscription –
the information for February is in Kalbach, 2001)
C – thecounter.com;
January, 2001
D – websnapshot
|
What What screen resolution are you designing for? When is it time to
change?
A website is best when it is designed for a monitor resolution that matches
the monitor resolution of the majority of your users. This provides a
full-screen layout for those who desire to use the full width of their
monitor for web pages.
For the past couple of years, most users have had their monitors set
to handle 800x600 pixel resolution. However, based on the studies that
are currently available to us, we may be approaching the point (in the
next few months) where 800x600 will no longer be the most common resolution.
The relative percent of users using each resolution could change fairly
rapidly because some major computer manufacturers are now delivering their
new monitors set at 1024x768.
Also, there are some smaller studies reporting that the majority of users
are already using 1024x768 (seir.sei.cmu.edu
- January, 2001; themes.org; September, 2000). I found these studies about
two months ago. Unfortunately, when I returned to the websites to double-check
the numbers, I could not find the reports on resolution again. I will
leave in the references - you may have better luck finding the statistics.
There are currently at least four (ongoing) studies reporting on monitor
resolution:
|
|
Study A
|
Study B
|
Study C
|
Study D
|
|
640x480
|
13%
|
7%
|
8%
|
6%
|
|
800x600
|
54%
|
53%
|
55%
|
50%
|
|
1024x768
|
26%
|
31%
|
38%
|
29%
|
|
Other
|
7%
|
9%
|
9%
|
15%
|
Designers should have a threshold ("trigger") that, when met,
they would immediately start designing for higher resolution monitors.
A reasonable rule might be: "When demographic studies show that the
majority of people are using a resolution of 1024x768 pixels, we will
immediately begin to design for the higher resolution."
Most designers would benefit by having a quick and easy way to view their
pages in the different resolutions. Monitor resolution testers can be
found at dreamink.com
and applythis.com.
These two products offer fast ways to see what your website looks like
at the three most popular resolutions (640x480, 800x600, and 1024x768).
Because many designers are still using fixed width pages, they must make
the "resolution" decision. Hopefully, this decision will be
made using the study results shown above. If a fixed width is used, designers
then must make a second decision. When the page is viewed by users with
higher resolutions,
- should the page move all the way to the left and leave white space
on the right, or
- be placed in the middle with an equal amount of white space on the
left and right?
There is no research to support using either the "left" or
"centered" decision, but I suspect that having the image centered
may be best. The eBay website
offers good examples of being in the center (the eBay "home"
page), or on the left (click on "my eBay" at the top of the
home page). Note that these pages are still using the older 640x480 resolution,
even though only a small percentage of users have their monitors set at
this resolution.
There are at least two ways to have the page size adjust to the resolution
of the user's monitor. First, design pages at both of the most common
resolutions (800x600 and 1024x768), have your website determine the user’s
resolution, and then show the pages to that user that matches their resolution
settings. A second way is to simply stretch pages to fit the higher screen
resolutions used by many people (flexible pages). Unfortunately, "flexible
pages" may degrade the readability and/or overall appearance of certain
pages (Kalbach, 2001). Again, ebay.com provides a good example of pages
that adjust to the full screen (click on "site map" at the top
of the home page).
Providing the ideal monitor resolution for users will continue to be
a challenge for designers. To make it even more difficult, any serious
discussion of monitor resolution also should include a discussion of monitor
size. Kalbach (2001) references an article written by Adrian Roselli ("aardvark"
) that seems to suggest that as monitors size get larger, offering larger
viewable browsing areas, users tend to concurrently open more pages (the
aardvark reference is shown below). We must consider how many users are
opening websites full-screen, versus having two or more browser windows
open at the same time. There is very little good research to help us answer
these important questions.
|
|
Eric Schaffer, Ph.D., CPE,
Founder and CEO of HFI
|
What screen resolution should you design for? Like most ergonomic issues,
this one involves tradeoffs.
On the one hand, classical usability work tries to accommodate not 50%
but 95% of users. (Why? Imagine a door so short that only half the population
could get through.) The 95% criterion would restrict you to designing
for 640x480 pixels, judging by most of the studies cited by Dr. Bailey.
On the other hand, business and functional considerations often demand
higher resolutions. You need them if, for example, your design has a lot
of content and complexity, and the user needs to see the big picture to
retain context.
The compromise we use for most public Web applications is 800x600 pixels.
This resolution excludes only the 3-13% of users still stuck with 640x480
screens. However, as Dr. Bailey points out, the target is moving. As people
upgrade their monitors, the most reasonable compromise may change to 1024x786.
No matter what the prevailing resolution becomes, you will always need
to think through each project individually. As designers we must continually
weigh the business and ergonomic imperatives that lead us to the right
tradeoff.
|
