Breaking the myth of the crammed Web site

My first real introduction to technology – at least in terms of something I was to interact with – was at the age of 9 when I used an Apple IIC to play Oregon Trail. And while I may have died a virtual death of cholera due to my lack of hunting skills (Hey, who hunts deer by walking in straight lines anyway?), leaving my wife, two children and a set of oxen to fend for themselves in the hostile American West, my “real” self loved this new world filled with pixels and floppy discs.

My first experience with the Internet, aside from being told that it was a series of inter-connected tubes, was late in college when I logged on to AOL; I indeed “had mail.” What a world. One interesting fact about the early years of the internet was the lack of page scrolling. AOL, for example, wouldn’t allow users to do any vertical scrolling, instead relying upon text fields and list boxes to display information (not to mention splash pages – yikes!). This new technology was limiting and, for me, a bit cumbersome.

The same can’t be said for my son whose first foray into technology - specifically that of the Internet - was at the ripe old age of 2. He could log onto the Web, open up his “favorites” folder and peruse a variety of Web links (Wiggles, Barney, Disney, et al). The amazing thing (and what is the most pertinent in terms of this article) was his natural inclination to scroll down the page. Inherent in his and each of our Web experiences is that we will and most definitely do scroll. By embracing this knowledge, FindLaw’s talented Web development teams don’t have to worry about cramming as much information and imagery at the top of a Web page as we first believed or were led to believe. We can now design open and user-friendly designs.

In the beginning (right around Al Gore’s creation of the Web) Web designers and developers looked at the Internet much the same way a newspaper editor looked at a newspaper. Most newspapers were (are) displayed to potential customers folded in half; meaning that only the top half of the front page is visible. Editors knew that this space, which they called “above the fold,” could convince a reader to buy the paper as it would be the first information viewed by their readers.

As time passed and research became made available to them, Web designers began to see that users may not necessarily come to the home page (think SEM and the value of targeted content) upon first visit to a Web site, instead coming to a more specific search-related page on a site. Also, users expected that whatever page they were to land on or visit, they would have to scroll. After scrolling became a consistent implementation on all Web sites, Web browsers alleviated the concern that users won’t scroll.

Famed Web expert Jakob Nielsen touched on this topic 3+ years ago when he said, “On the Web, users expect vertical scrolling. As with all standard design elements, it’s better to meet user expectations than to deviate.”

Nielsen also wrote that users will stick with a site as long as they feel that they are getting closer to their goal of finding the information they want. This search is referred to as the “search for sent.” Draw the user in with compelling imagery and pertinent text and they will continue to move through your site; this is where we come in.

When designers at FindLaw are asked by others (clients, the field, et al) to place as many elements above the fold as possible, the answer indubitably should be: “Where is the fold?” With viewing screens coming in all different sizes and resolutions – from iPhones, PDAs and Blackberrys to widescreen LCD monitors - where then is the fold? Unlike the aforementioned newspaper, the fold of a Web page has no fixed location. Most data shows that the largest majority of page “folds” can hover anywhere from 600 to 610 pixels – and this accounts for only 10% of the folds! If you add in the next few largest fold distributions (570 and 630 pixels), together they account for only 26% of fold locations. Basically, the fold is everywhere! How would you account for where the fold is since we don’t know what each user’s default font size, window size, or screen resolution is? If we design for one, we lose the rest. Braced with this knowledge and the current shift to Web 2.0’s cleaner and less cluttered sites, designers are more in tune with users as well as the presentation of information.

That said, FindLaw’s Web Designers do place great emphasis on what goes atop a Web page, but not at the sacrifice of the entire site - much less the user. The top of a FindLaw-created home page should, in most cases, answer these questions:

1. Who is the firm?
    • Name, location, practice area(s) focus
2. How can I contact them?
    • When and how (phone, email, what hours, etc).
3. Why choose this firm over the competitor?
    • Market differentiator

Answering these questions in a graphically powerful (and hopefully unique) way helps the user make a decision in a timely and non-frustrating way. With abundant data showing that the majority of Web users scroll and that most sites have a scroll-bar, we can better design sites, placing data and imagery throughout the site/page to improve the overall user-experience. Some liken this to the analogy of an attractive person who has no personality: If a site crams as much info as possible at the top of the page and leaves the rest of the site “empty,” the designer has failed. If a designer has a site that is well thought out and designed top-to-bottom, the site has a better chance to be successful — good-looking AND smart!

While the Web is littered with valuable data supporting that there is indeed no fold, here are a few very supportive metrics based off a 2006 (and a subsequent follow up in 2007) ClickTale* study of over 120,000 page-views:

• 91% of all pages viewed had a scroll-bar
• 76% of all pages viewed that had a scroll-bar were scrolled to some extent
• 22% of all pages viewed that had a scroll-bar were scrolled all the way to the bottom

Are users less likely to scroll to the bottom of a page? No. Visitors are equally likely to scan the entire page, no matter the length. As my 2-year old son proved (and seemingly anyone who uses the Web), people scroll until they find what they are looking for. Scrolling is also associated with Web 2.0 design because big, clear text and spacious, clean content implies longer Web pages.

What recommendations do the designers at FindLaw have for their clients (and the field)? Because users are more inclined to scan Web sites for data instead of reading a site line-by-line:

• Divide your layout into sections with graphics to draw the user in.
• Let your designers create a visually compelling header area to draw users in and make them want to scroll. (Click data research from CrazyEgg shows that even though a tag line may not be a link, users are clicking on it as they expect it to bring them someplace. Use this as an opportunity to sell your firm’s overall message and get users to delve deeper into the site.)
• Think of your firm in comparison to your competition. Why choose you? It’s not simply a matter of “we return phone calls promptly” (all firms do and should), but think larger — “We get results prior to court. We are former police officers. I am a former judge.”
• As users visually scroll, minimize written text (maintain the content minimum as to not affect the search engines’ ability to find your site) and maximize images. Entice users visually to stay on your site.
• Make the search box prominent as users find these mandatory in their search for answers or help.

In the end, trust your designer and the designer’s experience and expertise in creating sites that not only attract users, but engage them. Let your designer open up your site to give the user more visual breathing room and don’t fret that a user won’t know what to do; they are more savvy than we give them credit for.
...

Besides, you've been scrolling through this entire entry ;-)

*Data provided by ClickTale who collected a subset of roughly 120,000 page-views, as well as the research done by Jakob Nielsen.

Collin Hummel