Redesign for Wider Screens and Screen Resolutions - Web Marketing Resources LLC Articles Aug 29, 2008

home> articles > redesign for wider screens

Redesign for wider screens

By Todd Follansbee Aug 29, 2008

Abstract -Todd Follansbee explains that wider webpages are appropriate now that most visitors use wider screens. But there are some warnings. Read below.

first appeared inWeb Marketing Today in slightly different format.
http://www.wilsonweb.com/design/follansbee-screen-resolution.htm

We've been testing users for 10 years now and they don't like to scroll any more today then when we started. When searching, they typically arrive on a home page, and far more often then you might suspect, they just don't bother to scroll down. Several of our user experience guidelines (See our free Dudley Site evaluation tool to measure how persuasive your site is) address this behavior. The prime one is to insure that primary or critical page elements are above the "visual fold". Simply put, if it is important, it better be visible at first glance on a normal monitor.

The good news is that we are now recommending a new screen size for web page design. The traditional 800 X 600 screen width is now used by such a small percentage of viewers that we can safely design to a new standard 1024 X 768. That translates to an actual new width of 965 pixels to account for browser scroll bars and framework, up from 770.

Here is an example of how much space you will gain.

Designers gain nearly 200 pixels, over 20%, across the screen to include critical page elements, expand navigation, improve branding and messaging in the header and redesign page elements.

How do we know that we aren't excluding customers who still use the old standards? Sites regularly monitor these trends and one, http://www.onestat.com/html/aboutus_pressbox43-screen-resolutions.html

Reports these statistics for July of this year.

USA Screen Widths July 2008
	Screen Width	% of total viewers
1	1024 x 768	52.22%
2	1280 x 1024	13.81%
3	1280 x 800	5.05%
4	1152 x 864	3.63%
5	800 x 600	16.91%
	total	91.62%
	total minus 800X600	74.71%

Your traffic reports will deliver browser resolution statistics as well. Mine, at the time of this report showed only 2% of my viewers using 800 X 600 so the "macro" numbers reported above are likely to be very worst case scenarios. Check yours.

Users dislike horizontal scrolling even more then vertical scrolling so we do not recommend designing beyond these resolutions unless you are designing for a fixed and known market such as an intranet.

What are the risks?

You cannot control how people open their browsers so if, like some, they keep their internet windows minimized to less then 960, horizontal scrolling will be necessary. There are no statistics to substantiate or refute this behavior however. Our gut says this is not much of a risk.
Text width on a page appears to have the best readership around 55 characters per line. Avoid the temptation to build lengthy packed text on your wider site.
Overcrowded and cluttered pages with too many distracting elements are likely to see a drop in conversions. More is not always better. If you have a page which performs well currently, use the space to bring even more attention to important elements.
Three columns on a page seem to perform the same or less effectively then two columns. If your two column page performs well, resist the temptation to add another column. Use the space to improve navigation, add some branding impact and some whitespace to lessen the visual assault that a "packed" page delivers.

What are the benefits?

Reduce headlines from three lines to two. They will be much better read.
Use more text emphasis such as bolding and bullets, to allow readers to scan more effectively.
Very importantly - raise your calls to action from the bottom to insure they are visible at first glance. To minimize any possible impact on people who keep screens less then full size, avoid using the far right side of the screen for these calls to action.
You may be able to add an additional call to action such as a newsletter signup form or third party advertisement (ugh).
Trust icons may find a place.
Photos which were scaled too small at 760 to be beneficial may now make sense.
Branding elements may be made more visible to increase their impact.

If you focus on only one thing however, focus on improving the clarity of your company value proposition. Viewers need to know what business you are in and why they should buy from you at the very first glance. If you fail to deliver that information, you have little chance of success.

As always, test your new page treatments directly with users as well as by monitoring traffic reports and Google Optimizer.

If your site is still at the old screen width, enjoy the new freedom and opportunity this presents but don't perpetuate bad design practices. Feel free to test your site's effectiveness with our free tool "The Dudley" and get on the path to being more successful.

This article is free for reprint however you choose as long as you request permission, provide a link to this site and acknowledge ownership. If you need more information or wish to discuss any aspect of this policy or the article please feel free to email me. - Thanks, Todd