Web Page Width Discussion: Fixed Width vs. Expandable Width and Other Considerations

by Jim Correll, Facilitator/Business Coach of the Successful Entrepreneur Program at Independence Community College (ICC)

As part of the Small Business Web class in my Successful Entrepreneur Program at ICC, we have a discussion about how to determine the page width when creating a business web site. The following question has been asked by more than one participant so it is presented here.

Q: Why is it that we set the site width at 740 pixels? It is leaving about 2.5 inches on each side of my screen. I don't have a super big monitor either, just a standard laptop. SO, I'm just wondering if we can go a little wider.

Answer:

It’s not about the size of your screen, or someone else’s screen, but about resolution setting of their screens. If you go to Control Panel ->Display->Settings, you can change your screen resolution. "They" used to say (a couple of years ago) that many people still have their resolution set to something like 800 x 600. If you set yours to that, you won't be so much empty space in the margins of your lap top screen.

Go to www.Amazon.com (or www.onestopbuy.com)*, you'll see the important content in the middle of the page with less important content on the right side. These pages are arranged in this way so that if someone views them with a resolution of 800 x 600 or less and they will see the important content without having to scroll; they won't miss the important stuff and if they don't bother or want to mess with scrolling to see the content on the right edge of the page, it won’t matter.

I first learned this at some point after launching SEK Critter Corner (a site offering free listings for Lost and Found Animals)in 2002. I designed the pages so they filled my entire screen and looked great. One day, while visiting my mother-in-law, I viewed my pages on her monitor; they didn’t look so nice.

Everything appeared much bigger and I had to scroll back and forth horizontally to read each sentence.

Once you get Google Analytics set up (easy to set up for all your pages with the Lookinglass system, you can see what different resolutions people are using to look at your site to help you make an informed decision about how wide to make your pages. This information can be somewhat misleading if people with low resolution take one look at a wide-paged site and say "forget it, I'm not staying here”. You come along later and say "Look, all the visitors are using higher resolution."

Finally, with the Lookinglass system, you can go into the site settings and blank out the page width value. That will make the page expandable according to the visitor’s screen resolution setting. This can be an effective solution; however you will want to experiment with this expandable before taking it “live”. For example, if you have a graphic banner where the spacing looks just right at the 740 width, it won’t expand or contract based on expandable page width and may look a little lopsided when viewed at different resolutions.

Another consideration is how the page will print. Have you ever printed a web page that was so wide that it printed on two sheets of paper with an irritating strip of the right hand edge of the web page appearing on the second sheet of paper? Page widths up to 770 pixels seem to print as expected by most visitors’ printers.

So, there are many considerations in setting up the width of your web site pages. Setting the width at a static value between 720 and 770 pixels seems to be a good solution that will work for most of today’s web visitors. Using wider settings or the expandable feature may be a good solution for you depending on your targeted web audience.

You can easily switch back and forth between 740 and expandable or any other page width. While I wouldn't recommend doing much page width experimentation with a live site, you certainly test different widths on a practice site.

***

*While everyone knows about Amazon.com, you may not be familiar OneStopBuy.com. They are for electrical devices (standard switches and receptacles in addition to decorative and specialized switches and dimmers for home and commercial use) what Amazon.com is for books. OneStopBuy.com sells nearly all of the 10,000+ Leviton products, many of which you can’t find at your local electrical supplier or box store. For instance, if you want to buy Leviton Acenti products (a highly decorative, upscale line of dimmers, switches and other home devices), you’ll find them at OneStopBuy.com and not in most brick and mortar stores of Leviton distributors.

This “How To” document and others related to business web sites and other small business issues can be found at http://www.okcorrell.com/, representing Jim Correll’s “OK Correll Business Solutions”, providing tips and help for small businesses working to stay competitive in today’s tough marketplace.