Bill Finch, Interactive Director

I’m sometimes asked to design for “the fold.” And I’m tempted to ask “which one?” I find this topic is a great opportunity to educate clients on the evolution of the web.

What is the Fold?

The fold is a web design term used to describe the part of a website users see before having to scroll. Below-the-fold refers to the part of the website users see when they scroll.  Think of a folded newspaper.  Anything you see when it’s folded is above-the-fold.

In the web’s earlier days, the only devices used for viewing websites were desktop computers and a few laptops. Landscape orientation and screen resolutions were consistent. The fold was in about the same place for everyone (about the first 550/600 pixels) so it was easy to design for it. More importantly, scrolling wasn’t the involuntary action it is today, so designing above-the-fold was especially vital for stickiness and usability.

Find your fold  at FindMyFold.com.

The Old Fold is Dead

The proliferation of smartphones, tablets, notebooks and so many different screen sizes and resolutions has made the fold too variable to accurately define today. Fortunately, users are now accustomed to scrolling, so we no longer need to assume they aren’t willing to scroll to read interesting content or find other information they seek.

Here is a graph showing the different screen resolutions of visitors who visited my agency’s website in the past month.

The evolution away from the fold has removed many design limitations. Thus, designers have been allowed to experiment with presenting content in different ways. Users have also established new expectations. But the freedom hasn’t made web design any easier.

The New Fold

The old fold is considered dead, but the concept still exists for both users and designers.

In early 2010, web usability evangelist Jakob Nielsen oversaw an eye-tracking study to determine how users handle the fold. While the eye-tracking test was performed at 1024 x 768 resolution, it’s safe to assume the findings would be similar for other devices and screen resolutions.

Nielsen found that while users will scroll when needed, they still spend 80% of their time viewing information above-the-fold.

Strict adherence to designing for the fold has gone by the wayside, but the top is still important.

How to Handle “The Fold” Today

The top of the page is still where the core message (branding, a clear hierarchy and important calls-to-action) needs to live no matter what the viewing scale is. Users will scroll, even to the bottom of the page, if the rest of the page and content encourages scrolling.  I’ve even seen some sites do horizontal scrolling which is still non-standard and less intuitive for most users.  Much of that depends on how you guide the audience to perform the functions you’re seeking and how much extra effort is involved before they decide to leave.

“But how many pixels is the new fold?” you may ask. There’s no set standard these days. New sizes and resolutions are released constantly with each manufacturer trying to find the “sweet spot” for the device’s intended use (i.e, business, entertainment, etc.). Designers need to take into account the overall application, audience and intended use to design effective websites that are usable across multiple resolutions and devices.

With the prevalence of mobile devices, many designers will design two versions of a website: landscape orientation and portrait orientation – landscape for the traditional applications and portrait for smartphones, tablet devices, etc.

Designers: What’s your take? How do you handle the fold these days?

With an influx of open-source site management platforms like WordPress, Drupal, Joomla and DotNetNuke available in today’s market, I’m often asked why a company should bother with a proprietary system when a free, open-source option is available. For the record, in my business, I utilize both open-source and license-based site management solutions.

Let’s get one myth out of the way before I discuss the pros and cons of each and how to determine which is best for your business.

Open-Source Doesn’t Mean “Free”

Many businesses equate open-source to free.

Apple co-founder Steve Wozniak corrects this mistaken belief best:

“A lot of people think that Open Source means ‘free.’ It was never intended to mean free and it shouldn’t mean free. People should be able to develop software and market it and have control over what they build. But when you sell a product that has a lot of software in it, being Open Source means you publish your source. And if somebody else wants to take your product and make a specialized version of it that does their few special things for their application; or does something a little different; or leaves pieces of it out; they can do that and they don’t owe you a license fee.”
Read the full interview.

Benefits of Open-Source

1. No license fee: Proprietary site management systems have one-time or annual license fees that can range from a few hundred dollars to many thousands of dollars.
2. Modular: With the popularity of open-source, there are many more programmers contributing to the open-source community than there are working on proprietary platforms. Because of this, there are many more modules/plug-ins available.
3. Not Locked In: Since there’s no contract and open-source software does not prohibit you from having any capable programmer working on the system, you don’t have to rely on a single vendor for upgrades and maintenance.

What to Watch Out For

1. Security: Open-source tends to have security flaws that are identified only after someone finds them on a live site. According to IBM Security Solutions X-Force 2009 Trend & Risk Report, there exist in the core and plug-ins of the major open-source system many security vulnerabilities. If you’re using an open-source system you must check the security profile of the core and plug-ins and make appropriate fixes.
2. Upgrade Path: Upgrades can often be complex. Since most open-source platforms depend heavily on add-ons created by the community, there can be issues with the add-ons not being compatible with the latest CMS version, therefore requiring work to improve compatibility or find a different solution.
3. Total Cost of Ownership: If the upgrades you want require complex modification of the source code or plug-ins, the total cost can often exceed the license fee of a proprietary system that already has the all the features you need without the security vulnerabilities;

Illustration: In the first quarter of this year, I had a new client request upgrades to his open-source based website that would require extensive customization and time. The client also had a wish-list of features to add in the future. The initial changes would have cost less than the license fee and development time on the proprietary Kentico CMS solution I proposed (disclosure: I am a Kentico Certified Partner), but Kentico CMS already had upgrades and wish-list features available as part of the system. For only a little more cost up-front, my client was able to save a few thousand dollars in total cost and get everything they wanted.

Which Platform Is Right for Me?

The platform that is best for you depends greatly on its intended use now and in the future. You must consider how you will use the website to achieve your business goals.

• Who is your audience?
• What does a visitor need/want to do on your website?
• How does it need to integrate with your company processes?
• How much support will you need?
• How will the website be maintained?
• How important is security?
• How important is the usability of the system?
• What resources (e.g., budget, developers, etc.) are you willing to dedicate to the website?

I recommend open-source platforms for companies needing a marketing website or who have a small budget and need a starting point. Larger companies who have their own servers and IT staff , or who want more control and better integration with the rest of their company processes do better on a licensed, enterprise-level software with built-in professional tools such as content staging, load balancing, CRM and more. Depending on the type of business and development needs, it may be best to go with a hybrid or custom solution. A hybrid solution is most-suitable for companies with on-site development staff to continually enhance and grow the site as part of their business model.

Photo Credit: Photobucket