Screen resolution.

No, I’m not talking about how Hi-Def your HDTV is. (Although I’m sure you’d be happy to tell me.)

Yes, I’m talking about your online audience’s display resolution. While the subject sounds much more stale than your HDTV, it just might help afford you an upgrade.

Don’t Design Outside of the Box

Many designers seem to design without giving any thought to the visible width and height of the end users’ display. Having dabbled in design myself, I have also been guilty as charged, many times over.

As technology advances, enabling screen resolutions to grow and costs to drop, the problem of designing sites too large to fit users’ screens seems to have lessened, but it is still a problem. As your users’ screens get larger, guess what? So does your designer’s, and probably at an even greater rate.

In fact, right now I am staring at a screen that takes up half of my desktop and has a resolution of 1920 x 1200. I’m pretty confident that mine is bigger than yours, and unfortunately there’s a decent chance my design will reflect that.

Of course if you are a true purist you will say that one should always design using a fluid layout, like Jakob Nielson points out. While I completely agree in theory, in practice, designers are too meticulous about their layouts to let them be stretched, squashed, poked and prodded at.

What Screen Resolution Should I Design For?

Note: The following statistics were taken from W3CSchools.

Display Resolution Statistics:

Yes, many more people are using high resolution monitors, but the majority of people are viewing web sites at 1024 x 768 resolution.

So, design for 1024 x 768, and remember the browser window takes up a lot of that real estate.

Personally I try to use 960 for the width. I attended a few Cameron Moll sessions last year at WDW Seattle, and his argument for using 960 was a good one. It’s divisible by 3, 4, 5, 6, 8, 10, 12, 15, and 16 which means your grid options are endless, and of course it fits within the most popular 1024 width.

That’s all fine and good, and isn’t too shocking, but what is unfortunate is how many designers ignore the arguably even more important height dimension.

If you need to keep content above the fold, I would use 525 as your line of demarcation. This is especially important for landing pages where the call-to-action needs to be ‘in your face.’

Yes, You Should Give a Damn About Screen Resolution

Look at this example.

Using 1024 x 768 for my display resolution, I performed a search on Google for ‘kids toys’ and clicked on this recognizable brand in the Sponsored Links. This is what I saw above the fold:

No, the giant in-your-face area is not clickable.

If you were to scroll down you’d see a couple of smaller call-to-action areas that are, but you’ve already lost me.

First of all, that whole area should be clickable, but minimally the primary call-to-action NEEDS to be above the fold. If the designer had tested this on the most common screen resolution, I think they would have made some different decisions.

In contrast I did a search for Luxury Cars and every one I checked out worked well on my screen:

I would change a few things on this landing page, but the point is the designer got all of the pertinent information above the fold.

I will concede that it’s much safer now to design web pages and landing pages bigger, but look at the statistics, decide where your target audience most likely falls, and then be sure to test your designs before launch.

While at SXSW in March, I ran into Shannon McKarney from Jaded Pixel, the company behind the popular Shopify hosted e-commerce platform. Shannon asked if she could interview me for the Jaded Pixel blog and I agreed. I’m cross-posting the interview below. The original is here.

What inspired you to write the book?
We were struck by how many of the sites we worked with suffered from the same design and usability problems. But that was really a symptom of the way people think about and manage their sites. So in addition to providing some concrete design guidelines, we wanted to try to change the way people think about web design. Personally, I wanted more people to see the money they’re leaving on the table by not designing their sites well.

How the Book Was Born
I had just finished a presentation on Designing for Conversion at Web Design World in Seattle in July 2006 and was answering some audience questions in front of the stage afterward when a kind but serious-looking gentleman handed me his card and said “I really enjoyed your presentation. How’d you like to write a book about it?” A quick glance at his card identified him as Michael Nolan, Sr. Acquisitions Editor at Peachpit Press/New Riders. After a stunned silence while my mind fixated on the long-held perception that ‘I don’t write so good’, I smiled crookedly at him and said with all the gravitas and certainty I could muster “Ummmmm… Sure?”

(Read the full article…)

I’m very pleased to announce Closed Loop Marketing’s partnership with Widemile, Inc. Closed Loop Marketing is one of thirteen leading agencies invited to use the beta-release of Widemile’s new multivariate optimization platform.

Designed and developed with partners in mind, Widemile’s new optimization solution will allow Closed Loop Marketing to offer our clients a robust, enterprise-level multivariate testing platform that integrates smoothly with our Paid Search, Conversion Optimization, and SEO services.

As long-time advocates of site testing and optimization, we’ve helped a wide variety of clients improve the effectiveness of their landing pages, sales funnels, and other key site areas. When we combine testing with SEM campaign optimization, the result is a dramatic, end-to-end improvement in quality traffic, conversions, and ROI for our clients.

About Widemile

Based in Seattle, Washington, Widemile is a leading provider of site testing and optimization technologies. Widemile’s third-generation software-as-a-service (SaaS) multivariate optimization system is based on open standards, includes proprietary testing and analytic techniques, and is designed to exceed mission-critical enterprise standards for security, stability, scalability and performance.

And I can also say, having worked with them in the past, that the Widemile team is a group of super-smart, high-quality people. We at CLM are excited to participate in this beta-release, and look forward to a long and rewarding partnership with Widemile.

More information:

• See Widemile’s press release
• Coverage on ClickZ

We’ve all experienced it at some point; the sneaking suspicion that those we’ve chosen to trust may not be entirely worthy.

Take web sites, for example.

We visit a web site, look around and like what it has to offer. We want to believe that the site””and the company behind it”” has our best interests at heart. Perhaps we’ve even had a good experience with the site before.

But then the oddities begin to creep in, the strange little inconsistencies that make us wonder… is it me?

Suspicion…

It doesn’t take much to plant seeds of doubt in a visitor’s mind. Small broken promises and misunderstandings can suffice, such as:

• We click on an ad, then don’t find the promised item on the landing page.
• We carefully click on a product link, only to find something different highlighted on the next page.
• We start a registration process, only to encounter many more steps than the site indicated.
• We try to complete a specific task quickly, only to find our progress slowed by questions, ads, and confusing page layouts.

What’s going on here? Don’t these companies know what their visitors want?

In many cases, the answer is yes””perhaps too well. They know exactly what we want, they just choose to use that understanding in a way we don’t expect. In a way that serves their business goals, not necessarily those of their visitors.

Let’s take a look at a couple examples I’ve run into over the past few months.

Example 1 - GeoTrust

Recently it came time to renew the GeoTrust secure certificate I’d installed on a personal server. The email notice contained a convenient link which led to the following page (I’ve enlarged and called out the product list for clarity):

So far so good, this looked like exactly what I needed. I wanted the first item on the list, the “QuickSSL” product, so I clicked on the first dark-blue “Renew” button.

And came to this confusing page:

Here’s where the doubt crept in. The page title is what I expected, but the content on the page seems to be all about the “QuickSSL Premium” product. Did I make a mistake? I didn’t want the Premium product, I wanted the less expensive “QuickSSL” product.

At first glance (and most visitors won’t give the page much more time than that), the only available action on this page is the huge orange “Upgrade to QuickSSL Premium” button:

Yikes! How do I purchase the plain “QuickSSL?” Ah, there it is, a visually de-emphasized link in small blue text:

This is a great example of evil usability at work. Notice all the factors that contribute to this link’s obscurity:

• Unclear design - Compared to the orange button, this option does not look much like an action item. It’s smaller, in a darker color, and doesn’t look like a button at all.
• Unclear wording - the call to action, “Stay with QuickSSL,” isn’t what visitors to this page expect to do next. What they expect to do””what I expected to do when I came here””is to “purchase” or “renew,” not “stay with” the QuickSSL product.
• Unexpected positioning - visitors interested in purchasing the QuickSSL product don’t expect the next step in the process to be hidden down at the bottom left-hand corner of a page, outside the shaded area that contains the emphasized text, and after a bunch of unexpected content. The orange button, on the other hand, IS in the expected position on the page for a next step.

Why would GeoTrust design the page this way? Those not as cynical as I may say it’s incompetence, poor audience task modeling, or a loose-cannon designer.

I think not.

It’s an example of a business goal overriding the visitor’s clearly stated intention. Now, we can debate the company’s intention. Perhaps they truly believe the basic “QuickSSL” product is inadequate for most customers and see this as a way to helpfully guide customers to a better solution.

What’s more likely is that this is a pure and simple upsell that disguises its intent by twisting well-understood usability principles such as:

• Web visitors don’t generally read text. So all that verbiage that tries to make this sound like an option, instead of the only available action? Ignored by most visitors. But great cover.
• Buttons get clicked. Visitors arrive on a page looking for the next step. What’s clickable? they ask. And on this page, that clickable item is the big orange button. It’s not a carefully considered thought process, it’s a trusting response to what appears to be clear guidance. “There’s a button!” Click.

Let’s look at another example.

Example 2: GoDaddy

Another task I undertook recently was registering a domain name through GoDaddy.com. Let me preface this by saying I’ve had a decent customer experience with this company, overall, so I came into this with a fair amount of goodwill.

I’d just found the domain name I wanted, and clicked the “Continue” button. Below is the page I saw next.

Take a look: What’s the one item that looks most clickable on this page?

If you answered, “The huge green button,” you’re right!

But if you click that button, you add two additional domain names to your order, just like magic! What if that’s not what you wanted to do? What if you want to register only the domain name you picked on the previous page?

To do this, you’d have to click the small text link under the huge green button:

This annoys me every time I go through the GoDaddy checkout process. I’m used to it now, but each encounter incrementally diminishes the store of goodwill I have for the company. I never send friends to the site without detailed caveats along the lines of:

“It’ll be very confusing and they’ll try to sell you extra stuff, but just ignore all that. Look for the tiny little text links that say “No thanks” and keep on going.”

Again, it’s remotely possible GoDaddy truly believes they’re doing customers a service here. Or that they’re incompetent or don’t understand their audience.

Again, I think not.

You’ve Got to Change Your Evil Ways… Baby

It’s easy to shake an accusing finger at these and other sites who deliberately lead visitors into unintended actions. But waiting for them to change their ways isn’t the answer. As long as the rewards of this approach are greater than the downside (customer complaints, blog rants, etc.), they’ll keep right on down the same path.

What can we do about it? How about starting here:

• Complain to the company, often and annoyingly.
• Warn and educate everyone you know about tactics like this.
• Avoid companies that consistently use these tactics, and spread the word about them.
• On the flip side, reward companies who treat visitors with respect. Visit them, buy from them, and spread the word about them.
• Help those who are less internet-savvy than yourself through the minefields.

Meanwhile, I’ll keep doing my small part, here on the CLM blog. If you run across a good example for this series, post it in a comment, I’d love to hear about it!

When did the web site design process become a roadblock to launching a site, rather than helping it along?

When did the details of site design and function become a site owner obsession, more important than becoming visible, more compelling than getting a business online, spreading the word and making money?

And yes, before you say anything, we’re fully on board with the concept of details making a difference. We even wrote a book about it (Web Design for ROI). But there’s a point at which the details paralyze the process, preventing real action and forestalling any benefits.

Seth Godin wrote a post along these lines entitled “How to Create a Good Enough Web Site” in which he describes a simple””some web designers would even say heretical””process for quickly developing and launching a new site. Start with a design that’s “good enough,” Seth says, and focus on what’s important. By doing things in a practical order, not over-thinking the design, and getting signoffs at the right junctures, a web site can go from concept to launch in much less time and with much less trauma than usual. That’s the agile development approach.

From there, we’d add, it’s time to begin iterating and improving your site based on feedback and metrics. By making and testing small changes to design, copy, supportive advertising, and so forth, you can create an exceptional site that has incorporated valuable input””real, live, authentic input you had no access to during development. And you’ll be online a lot longer than otherwise.

What inputs matter?

To complement an agile web site launch, we recommend tracking and responding to your selected key metrics. That is, measurements that actually matter to your business goals. But most businesses are swamped with stats and measurements. Which ones matter, which metrics are “key?”

Here are a few to start with:

• Your ‘landing page’ conversion rate. This is the page or pages where you send marketing traffic, whether paid search, natural search, email blast, or offline advertising. Track and watch how effective this landing experience is for you over time. Consider doing A/B or multivariate testing to narrow down what works for your site, company, and audience.
• Your shopping cart completion rate (for e-commerce sites). It’s really not OK to have more than half your customers drop out of your checkout process, despite most sites averaging 60% dropoff. Check your analytics for trouble spots in your checkout, to pinpoint which steps are the worst offenders.
• Your RFQ / Registration process completion rate (for lead generation sites). As with a checkout process, there may be multiple steps, and a few of those steps may be bad apples as far as your prospective customers are concerned. Focus your update attention on those steps with the worst issues, and keep a constant, detailed eye on your stats.
• Your home page abandonment rate. If your home page is visible and receives traffic, then track how effective your home page is at drawing visitors deeper into your site. If your ‘bounce’ rates are very high, this may mean you need to clarify your identity, what you do, or improve your visual credibility. Or it may mean you’re using an advertising source that drives low-quality traffic. Either way, it’s important to know.
• Your end stats. By this we mean sales, contract signings, membership agreements, and so forth. Where things get real, in other words. Can you track your traffic, downloads, and lead through to what really matters? If not, you’re missing the full picture. You won’t know what traffic source is your most valuable, where to focus your iterative site improvements, or what’s actually delivering the best ROI for you, you’re working blind.

If you’ve found these tips valuable or at least intriguing, it’s not too late to register for the Voices that Matter conference in San Francisco (Oct 22-25) where Lance Loveday and I are lucky enough to be speaking alongside web greats such as Dan Brown, Jacob Nielsen, Kelly Goto, and many others. Hope to see you there!