Fifer’s Web site — on the Web since 1995!

How to Use Screen Real Estate

Janis E. Kenderdine © 2005

Research/Reflection Paper

Efficient use of screen real estate is something that has become somewhat of an art-form in the Internet age. With the key component of the Internet being information, how does one present it in an organized, useable, and attractive package? Oftentimes while designing a Web site, people will discuss making things “bigger and flashier” to stand out above and beyond all the important big and flashy items that also need to be seen at first click. It is up to the designer to decide when to take into consideration what is suggested, and when to ignore the multitudes of well-intended ideas and suggestions. You can't please everyone, but you can give it your best shot. Sometimes you have to go with your gut rather than what people tell you, because if one gave in to their every whim, it would make it an aesthetically ugly page that is hard to navigate. I honestly believe it is possible to present all the important info as such, but without upsetting the balance of the page, or giving the user vertigo.

A common problem is “how much is too much?” Should we place links to fewer places and let people “drill down” in the site, causing many screen-clicks to find the desired information? Or should we have everything on every page, and let the user sort through tons of data to find the one they want? I’ve found as both a user and a designer, one way to bypass that headache is to put major topics in a navigation bar, but make a prominent search-capability. If someone came to your site with a specific purpose, a search tool may be much more helpful than a ton of buttons or mucking through page after page looking for certain information.

Another navigation approach is the tab-approach, currently used by high-traffic sites such as Amazon, Yahoo, CNN, and AOL. Personally, I have also tried this approach at http://www.feadanor.org and a less-literal tab-format by listing sub-pages within sections of my home page at http://www.fifegeek.org/index.shtml. According to some sources, these go against the traditional theory of Web and hypertext design, but most successful Web sites almost always break these rules.1

One of the most important things to keep in mind when designing a Web page layout is to keep things “above-the-fold.” That is, the part of the page that is visible on first load, without scrolling. Users are more likely to spend time viewing this part of the page while they wait for the rest of the page to load. Oftentimes, users don’t even get to the stuff below the scroll-line, before moving on.2

Effective use of “white space” can also be used on a Web page to develop continuity, balance and organization among elements. It can make a page more relaxing and open in appearance, instead of an overwhelming jumble of information.3 Like artwork, the eye should follow a path, absorbing the entire work, instead of a single focal point or element. Balanced with other requirements, aesthetics are as much a requirement to a good page layout and usability as the information contained within.4

When utilized properly, the flow of the page will communicate more data and promote “stickiness,” enticing the user to stay and read for a while. The Web is abundant with choices, so without a proper “first impression,” users are likely to go elsewhere for what they are seeking. Yet even though this may sound like common sense, many businesses will still have a home page that is cluttered with advertisements and banners, and generic “business” graphics that have little or no value to promoting the business’ function or sales.5

When looking at the big picture of screen real-estate and Web page design, we must keep in mind what it is that we’re trying to offer the user, and why they shouldn’t go somewhere else. Navigation, although an integral part of any Web site, is not why the user came to your site, and as such, should be simple and easy to figure out. A Web site may have extremely valuable information, but if it is full of animated gifs, poor contrast, and poor layout, it will lose people immediately because it is perceived as an eyesore – even if the information is good.

Also, information may be present, but if it is buried amidst a mass of banners, advertisements, and other such unrelated things, a user won’t bother staying to sort through the muck. Advertising rarely serves a useful function on any Web page, and oftentimes contrasts so greatly with the rest of the scheme, that one is often better off leaving it out altogether. Advertisements should fit in with the flow of the rest of the site, and draw attention to themselves in an unobtrusive way. Big, flashy logos with no relevance shouldn't take precedence over the rest of the content.

These four basic elements (content, navigation, advertising and negative/white space) are what make up most pages on the Internet, and are probably the most important things to consider when designing an efficient, friendly, and easy to use Web site.6 Users want the designer to create a well-balanced, aesthetically comfortable and easy to navigate space for useful information. And always remember the old adage: less is more.

Footnotes: