educational

Which Width Works?

Cheryl Cain
Lately I've been seeing message board threads asking about the best screen size to design web pages for; a question for which there is no one "right" answer. There are several factors involved in deciding which resolution is the best choice for your particular project, but the question brings up issues far beyond this simple decision; issues that directly impact the user's experience at your website and consequently, both his satisfaction with your presentation, as well as your ability to make a sale to him or her.

One reason why the question of screen resolution comes up is that designers who have tested their creations across multiple browsers and platforms are often shocked to see the ways in which their "babies" are mangled. By building fixed-size designs with as many parameters as possible hard-coded in, designers can better control what their site's users see and thus the consistency of their message -- but only if the designer can choose the right width for his or her design.

Make the width wider than the user's screen and you commit the worst error in website design; building a page with a horizontal scroll bar. Make it too narrow, and it may get lost on a high-rez screen. Make it full-width on a high-rez screen and risk unwieldy, unattractive and hard to read text blocks; which is one of the main problems that fixed-width designs seek to solve...

Relying on "average" use statistics publicly available online to tell you which screen size is most popular may not help you target your audience. For example, webmaster resource sites target advanced users who are likely to have the latest systems and browser software, as well as broadband connectivity and high-resolution screens. These are different audience parameters than a mainstream user with a four-year-old computer and a dial-up connection; a user that very well may be more representative of your customers. Your particular user is not someone else's particular user.

So how do you decide on what's best? The best bet for selecting an appropriate target screen size is to examine your server logs for information on what your audience is using to view your site and to design accordingly. You must also ask yourself if you are willing to sacrifice users in order to make your design chores easier?

Finding that most of your users are surfing at 1024x768, with 800x600 coming in second, and very few visitors at higher (or lower) resolutions, could allow you to design for an 800x600 screen; a size that will look great on an 800x600 monitor, nice at 1024x768, and acceptable at 1280x1024, with a horizontal scroll bar for the few remaining 640x480 viewers. A suitable target width of say, 768px, being useable for several more years.

Nothing is ever fool-proof, however, so it's not uncommon to see careful designs rendered unattractive by users with browsers not "maximized" to take advantage of the full screen real estate, using over- or under-sized fonts, plus add-on toolbars limiting the height of the browser's main window, along with a whole other series of options the user may (or may not have) selected that will impact your design.

Times have changed, however, and the issue is no longer as simple as a choice between two or three possible resolutions. With rapid advancements in entertainment media allowing web pages to be viewed on mobile and gaming devices, the choices in target device resolution have skyrocketed. When looking at the variety of distribution methods available today, it should come as no surprise that "one size does not fit all" when it comes to design and layout.

It is this variety of display devices that is increasing the pressures on designers to go with standards-compliant "fluid" concepts, rather than "fixed" ones. By this, I mean that rather than designing a fixed-width web page that looks great at one screen size, or even multiple, individually optimized pages tailored for different screen sizes, that "fluid" designs that are not reliant on a fixed width or height, might make more sense. In simple terms, [CODE]width="100%"[/CODE] could be the way to go, but this also depends on your needs and audience.

As I said in the beginning, there's no one right answer to the question of "what is the best screen size to design for?" -- and it is a question that is getting harder to answer with each passing day. Hopefully, though, I've imparted some "philosophical" points that can help you make the best choice for your online operation. Remember, whatever width or design you try, test it on as many platforms and at as many screen resolutions, as possible.

More Articles

opinion

Legal Issues Pop Up When Filming Sex in Public

Lawrence G. Walters ·
trends

A Road Less Traveled: Accepting Alternative Payment Solutions

Stephen Yagielowicz ·
trends

Credit Card Processing Today: Decline or Dominance?

Stephen Yagielowicz ·
trends

Shifting Regulations: Keeping on the Straight and Narrow

Stephen Yagielowicz ·
trends

Putting Your Best Foot Forward: Billing's Best Practices

Stephen Yagielowicz ·
profile

PornDoe Premium — 35 Network Sites and Counting

Rhett Pardon ·
profile

Q&A: White Label Dating’s Steve Pammenter Expands Horizons

Alejandro Freixes ·
opinion

Facebook Ends Custom Link Preview Snippets

Lauren MacEwen ·
opinion

Dealing With the Press Can Be a Mixed Blessing

Eric Paul Leue ·
Show More