ChaosScenario

Missed Opportunities and Distributable Content

Every year around Independence Day some news websites like MSNBC.com create mini-citizenship tests  -- almost as if to prove how dumb we all are with respect to our own laws and history. Perhaps because journalists are in the habit of conducting idiotic and meaningless polls to develop news out of nothing (Such as "Which Presidential candidate would you rather invite to a barbeque?"), they consider polls such as this one to be satisfactory in the fulfillment of their public service. This particular execution, however, practically screamed for an opportunity for the online community to share their results with others. Sadly, it isn't something MSNBC seemed to consider worthwhile.

Undoubtedly, this poll is being passed around. The fact that I'm writing about it talking proves that, and I'd wager that at least some of the people who read this will likely take the test to see how they fare.

But then what?

MSNBC, like a lot of companies when given the opportunity, don't make it easy to share the results in a way that would entice people to share it.

Conceptually, the idea isn't that difficult. It's been done before (See "What's Your Blog's Reading Level?" or "How Many 5 Year Olds Can You Take in a Fight?"). The design can be mediocre (such as this hack-job I threw together), and people would still have fun with it.

As you can see, it can even be branded to serve as a sort of "product placement" within the content of someone's blog or MySpace page, which is more likely to be seen and used than if it were simply a display ad.

The execution of it just requires technical skill that the folks at MSNBC.com surely have at their disposal.

What's more, the results aren't exactly useless. Something like this can be fun and still inform people about some things that they didn't (but probably should) know. People don't get -- and many of them resist it anyway -- all of their education from a stale textbook. 

Don't know the term of a U.S. Senator? You will after you take the test.

Why aren't more companies (and schools) taking advantage of this powerful tool? - Cam Beck

Building Successful Microsites

Microsites are mini-websites are meant to supplement a company's primary website. They have their uses, but many times they are meant as a way to "introduce" a product to the general public.

Who they're for
A microsite shouldn't be built until this is clearly defined. For until you define the audience, you don't know if a microsite will appeal to them, or what sort of functionality to put on them.

Don't assume the first person you ask (even if it's the CEO) knows the audience as well as he thinks he does. Often the online audience doesn't perfectly reflect the audience the company reaches through other means.

Why they're used
Agencies like them because they are not as shackled by the design constraints and architecture of the primary website. Companies like them because they are relatively quick and inexpensive to set up (especially when put together hastily), and it gives them some ammunition to take to prove to their bosses that they're doing something "cutting-edge."

When they work
Microsites work when they're either especially well-thought out and fun, or when they actually provide a useful tool to the audience that they can't get somewhere else.

When they fail
All websites fail when they don't add sufficient value to their audience. Significantly -- and this is something typical agencies tend to forget as they're distracted by the Bright and Shiny Objects they're creating -- websites also fail if they do not deliver tangible results to the  client.

Therefore, defining your success metrics beforehand is critical, and it should never, ever be skipped.

How to do it right
Designers, cover your ears: Proper planning is the most important aspect of building a successful microsite. A big part of that planning is ensuring the right resources (including the design resources) are identified and secured.

Websites aren't like television commercials. People must actively choose to visit one, which means  to attract them, the site must provide something the audience wants or needs, and then it must provide that in a way that doesn't frustrate the users.

Even the most nifty design is useless if no one comes to it, so the planner must take into account how people would get to the site and what would motivate them to return (if that is, in fact, part of the plan). 

What it means to your brand
With the right strategy and execution, this method can build a strong affinity for your brand, which isn't exactly useless. However, that affinity doesn't always translate to an easily calculable ROI.

Because the microsite is a supplement and not the main course, poor execution here is most often low-risk, but poor planning can be, in certain situations, a public relations nightmare. Make sure you consider your contingencies and have the right stakeholders in the loop throughout the way.

One Important Caveat
Building microsites should normally take a back-seat to improving the performance of your main site. For creating a perfect microsite that is made popular by a clever promotional execution, can actually cause harm when the main site is useless and unusable.

- Cam Beck

 

Don't Break the Back Button on Flash Sites

A recent academic study conducted by researchers from the Universities of Hamburg and Hannover found that people don't use their browser's back button as much as they used to, compared to other elements of a website. The back button is still the 3rd-most used Web feature, behind hyperlinks and contextual buttons (buttons that occur within the content of the page). Be careful in how you interpret this new information, though. The back button is still one of the most important parts of the browser.

The study just demonstrates that the way people interact with websites changes as our tools for building rich user experiences become more robust. The back button is as useful as it ever has been, so if you're thinking about breaking it just because it makes it easier for you to build a Flash site, don't.

What makes the back button so special?
The back button is a classic error-recovery tool that is useful for every application. Most of the time, the ways we recover from errors are invisible to us. We just know intuitively that we can recover. When we miscalculate the ease of recovery, we are inconvenienced in some way or another.

Let's look at some common examples of mistakes in our lives and how our recovery can be thwarted by poor usability.

1. When you walk out the door without your keys, you just go back in to get them. If the door locks automatically behind you, you're screwed.
2. When a slip of the tongue insults your spouse, you quickly correct yourself. If your spouse doesn't tell you were offensive, problems ensue.
3. When you print the wrong version document, you open up the correct one and print that instead. If your documents are indistinguishable to the naked eye, you have no way of knowing which is correct and which is outdated, you can cause yourself and your company embarrassment, and you could perhaps lose important business.

The back button works in much the same way. It's one of the reasons the Web is such a low-risk medium. The easier it appears to be to recover from an error, the less risk a person will perceive when confronting a task.

If the back button doesn't work on your site the way 99% of the people on the Web have learned the back button is supposed to behave, users are forced to relearn a special interface rule for your site, which increases perceived risk and decreases adoption.

The back button naturally works well for websites built in HTML sites, but to keep them working the way they're supposed to in Flash, it requires extra effort.

Some Bad Examples
If not done properly, browsers will see the Flash site as a single page, and no matter how deep you are within the site, clicking the back button will take you off the site entirely, forcing you to find your way back to where you were (or to give up and spend your time elsewhere).

(Dig a little bit into this site or this site, and hit the back button to see what I mean.)

See aceofcakestv.com for a particularly egregious example. This site is so hard to navigate that it requires special instructions just to inform people how to use it.

I take no pleasure in pointing out that 2 of the 3 bad examples of back-button breakage listed here are actually agency sites. For more information on this problem, check out this classic piece on Web Ink Now.

Not wanting to go through the process of ensuring the back button functions the way people are accustomed to, rather than risk losing a visitor, many times Flash developers will simply prevent anyone from using the back button through meta refreshes or otherwise controlling the way they point you to the site. This makes the back button inactive.

Those responsible for making such decisions only think they're trapping a user on a site, but the truth is anyone can get out of any site at any time by clicking the close button.

The chances of losing a visitor in frustration increase exponentially the more you annoy them.

Some Good Examples
One thing I've learned over the years is that it's easier to tell people what they ought to do than it is to actually do it. No one gets it 100% right, which is why any company website should be seen as a continuously evolving project -- it is never quite done.

Here are some sites that make noble attempts to keep the back button working right.

Flash is not evil or inherently bad. But if you're going to use it, make sure you use it correctly. There are tools available (Hat tip to my colleague and Flash developer at Click Here, Shawn Scarsdale, for the information about the tool) to make sure the back button behaves on Flash sites (and Flex and Ajax) the way users have come to expect it to behave on every other type of site. - Cam Beck

Building a Website is Harder Than it Looks

When Wendy McHale of The Madison Avenue Journal first asked me to review a website for an Ad:Tech finalist, I chose Visa's Business Breakthrough because it is, in a way, a marketer's interactive dream project. It obviously had a large budget, and the video was skillfully shot and implemented throughout the site. A technician could certainly appreciate the production quality.

A big part of my job at Click Here is to troubleshoot websites at various stages of development, and this means looking for and finding the problems that do or might cause the users to fail completing whatever task they came to the site to accomplish. This way, I can cut through the bull to get to the meat of the issue, and everyone working on the project can do so with full awareness of what needs to be fixed and how to go about it.

My first review of the site, which I did not submit, was highly critical of the effort at businessbreakthrough.com. It reflected, I think, my typical approach to reviewing websites.

I reread it a few times, and I wasn't pleased.

As I thought about Steve Krug's mantra about website criticism, I reminded myself that it's always good to take a step back and remember just how hard it really is to build a website. Not only do you have the technical issues to consider, but you have to be able to:

1. Pitch a concept internally and to the client (often in multiple stages),
2. Secure the budget and resources
3. Try to reconcile the visions of everyone in the project who has a say in it -- including the technicians who are telling you that what you're asking can't be done on this budget -- and
4. Put together all the various pieces cohesively so that when users come to the site, it does not break.

The ugly truth about web design
I've been doing it for awhile, and though it's always enjoyable, it's never been easy (If it were, we couldn't be proud when we did it right). Everyone has a different opinion of what the site should be, and the person making the ultimate decision might not have the same grounding in the interactive space, including the way humans use it, as the people building the site.

So not only must those building the website be good at what they do, they also must have unimpeachable skills of persuasion. To convince the decision maker who might be biased toward another medium, they must be able to back up their claims with research the allotted budget of time and money didn't pay for.

The people paying for the site must feel as if the site is theirs.

Of course, we always have best practices to point to, but it doesn't help that the principle author of them is so hated by designers.

Because of this, those building the site must often sacrifice what they know to be right because of these external considerations, but that shouldn't stop us from admiring the things we know they executed well.

Click here to read the review, which is an edited version of my third draft. - Cam Beck

For more information: See Jakob Nielsen's latest synopsis of various usability mistakes made by several webites.

Apple Posts New Fun Internet Ad on Engadget

I'm curious. If you're a PC user, do you enjoy these spots?

- Cam Beck

The Biggest Decision You'll Make this Year - Mike Huckabee

Now that we've taken a look at all of the presidential hopefuls, I'd be remiss to leave out one of the most followed Vice Presidential candidates, Mike Huckabee.  I joke, which seems fitting for Huckabee's campaign.

• Hillary Clinton (Part 1)
• John McCain (Part 2)
• Barack Obama (Part 3)

Design

Logo – Huckabee doesn't really have a consistent logo, but I'll review what is present in the header.  There appears to be falling stars which makes me think that I can make a wish.  Huckabee also, like Senator Clinton, reminds us that he's running for president by simply putting "President" underneath his name.  I think it's a bit presumptuous that he left off the "for" before "President."

Color palette – maroon, blue and yellow. Like McCain, this seems like an odd color combination.  I think the maroon is an homage to his beloved Razorbacks.

Personal pic – Unlike any of the other candidates, Huckabee seems a bit humble to not show a personal pic in a fixed position on the site.  It's true that other pictures take up the hero shot on the homepage, but the one up today is not Huckabee's best angle.

Navigation –  Here's another horizontal navigation, but there's no secondary links from the top bar.  While some might see this as a simplistic design, it strikes me as quite a surprise in that it seems like when running for the President of the United States there would be plenty of things to link to.   

Calls to action – There seem to be quite a few different calls to action on the homepage from Read More!, Build our Base, Become a Ranger and Contribute.  None of these particularly stand out too much.

Order of importance – based on navigation

1. About Mike
2. Newsroom
3. Issues
4. Blog
5. Get Involved
6. Contribute

Order of importance – based on layout

1. Texas for Huckabee
2. Help Mike Today!
3. Ways You Can Help Huckabee!
4. Recent Blog Posts

What’s missing - While the site is a clean design, it still leaves much to be desired.  Based on how the sections of the site are labeled it seems that Huckabee definitely needs help.  The 3 outlined steps are to 1. Join the team, 2. Build their base or Become a Ranger! (not as awesome as it sounds) and 3. Contribute.   The third option is most important as it is highlighted with a yellow font color.  Overall, the design reminds me of my days when I first started using Dreamweaver and Photoshop. While both programs offer a ton of ways to make things look cool, when you try them all out on the same site it looks like crap.  My guess is that Huckabee has a precocious grandson.

Seal Rating:

   

Content

About Mike - This section of the site has a good amount of info on Huckabee, unfortunately the video that is intended to inspire reminds me more of a home movie.  On the flip-side, one of the most impressive things I've learned about Huckabee is that when he was diagnosed with Type II diabetes in 2003 he lost 110 pounds. He then went on to complete four marathons over the next two years.  The other interesting piece is that Huckabee plays the bass guitar in a "rock-n-roll" band, Capitol Offense.  Here's the thing, with the exception of Sting, how many bass players are the leader in their bands?  Huckabee seems more like a wingman than a commander in chief.  Huckabee's the guy that forwards you the Chuck Norris jokes, he's fun to hang out with but you're not following him into battle.

Developer Log - One of the most bizarre parts of the site resides in the subnavigation in the About Mike section is this Developer Log.  Here, a voter can see important things like on 12/18 at 6:19 PM they "Added Filter to Ranger Endorsements public display" and on 12/11 at 5:30 PM "Rangers can add their own links to their dashboard, making the dashboard a potential home page for supporters."  This is hilarious to me.  Why on earth would you put this mundane information up on the site?  Like I said, it feels very amateur, like the developer wants everyone to know the progress he's made on the site.

Become a Ranger - one of the biggest disappointments to the site is that when I tried to "Become a Ranger" I was met with a Chuck Norris-like server error scissor-kick to the throat.

Newsroom - The problem I have with this section is that the Press Releases and Recent Articles aren't titled very distinctively and they don't lead me to want to click on them at all.  The video archive, which shows a screenshot of the video is a let down in that I can't just view the video on this page.  I would have to click on the link of the video and which then takes me to YouTube.  They've listed the Author, Keywords, and Date, but the problem is that all of the entries are from the same person with the same keyword.

Issues - Huckabee has chosen to rename the issues with his own personal spin, which makes quick scanning of the issues very difficult.

Blog - Here I see another missed opportunity, in that the Blog only highlights campaign events and videos instead of providing content and engaging people in a conversation.  This content is just recycled from what could be displayed on a videos page and an upcoming events page.

What’s missing -  There simply isn't much to the site as the content is severely lacking compared the other three candidate's sites.  With that in mind, I will say that 29 Things You Didn't Know About Huckabee is my favorite part of the site.

Seal Rating:

 

Use of technology

The site was built on Coldfusion, which was a hot development framework back in 2001, but is seen as outdated by many in today's advertising space. Now, on to the social networks.

MySpace - 38,854 friends, 12,269 comments

• Barack Obama - 295,556 friends, 46,073 comments
  
• Hillary Clinton - 182,641 friends, 18,691 comments
• John McCain - 44,931 friends, 5,814 comments. 

Facebook - 56,839 supporters, 8,898 wall posts

• Barack Obama - 627,718 supporters, 83,325 wall posts
• Hillary Clinton - 110,460 supporters, 37,456 wall posts
• John McCain - 59,342 supporters, 5,804 wall posts

Eons - N/A

• Hillary Clinton - 297 friends, 3 badges
• Barack Obama - 216 friends, 1 badge 
• John McCain - 3 friends, 0 badges

YouTube - 4,113 subscribers, 461,353 channel views,184 videos uploaded

• Barack Obama - 30,595 subscribers, 12,180,341 channel views, 705 videos uploaded 
• Hillary Clinton - 9,829 subscribers, 1,304,419 channel views, 252 videos uploaded
• John McCain - 2,613 subscribers, 589,518 channel views, 166 videos uploaded
  

What’s missing - The social networking piece of Huckabee's campaign caught me off guard because I thought that most people, like me, would want to befriend the former Governor even if they didn't want to back his presidential run.  I mean, c'mon, he knows Chuck Norris! This sponsorship by Chuck Norris was the best and worst thing Huckabee could've done for his bid.  It was the best because it garnered 1.8 million views on YouTube alone, but it's possibly the worst because it's hard to take the guy seriously.

Seal Rating:

 

Overall

Well, Mike, I hate to do this buddy, but your site just stinks.  With the other candidates it literally took me days to review all of their content and put it into bit sized nuggets for our readers while you provided the nuggets as your content.  It's a shame because you seem like a really nice guy, you just should have spent some money on an interactive strategy. 

Overall Seal Rating:

Thanks so much for your attention in these marathon posts! My hope is that you found some useful information that might help you in your decision for the next president of the free world.   

- John Herrington

Perception is 90% of Success

When a customer or prospect comes to your website, they usually do so with a specific task in mind. In most cases, they have little or no interest in reading everything on your site, but only that which gets them further down the path of their intended purpose. If you have information or a service that is important to your website users that you want and need to communicate to them, you must not use language or design elements that hide this from them.

In industry terms, websites and their elements are said to have a "perceived affordance." These aren't two terms that are often used together in common vernacular, but a short:

• Perceived - What people think (they can do)
• Affordance - What can actually be done with or at an interface

If the two don't match, then the object is said to have poor perceived affordance. But what you need to know is that a preponderance of poor perceived affordance will cause your website to fail.

Jakob Nielsen wrote about this problem in his recent article, "Top-10 Application-Design Mistakes." He says that you can tell you have a perceived affordance problem when:

• Users say, "What do I do here?" - (This should be obvious to them.)
• Users don't go near a feature that would help them. - (If it would help them, then it needs to be highlighted at logical places.)
• A profusion of screen text tries to overcome these two problems. - (Lengthy instructions should not be needed, and they won't be read anyway.)

To demonstrate his point, Nielsen wrote about an interesting and persistent problem -- that sometimes objects in a Web design look like they should be clicked, but are not clickable. His example was something that looked like (but wasn't) a button, but the same can problem occurs when people use  underlined text on websites for anything other than a hyperlink.

(Did you see the difference?)

But not all affordance-perception problems are related to interface issues. Marketers can also fall into this trap by hiding the true purpose of their ads -- by making promises that cannot be fulfilled without effort that make the endeavor less valuable.

A "marketing" example
Last night I bought a plane ticket to New York from a very popular travel site. At the end of my checkout process, I came across a promo that told me I could get a $20 rebate if I would just "Click Here."

Curious but skeptical, I clicked on the promo only to come to a page that told me that to capitalize on this offer, I had to agree to a "trial subscription" for whatever it was they were selling.

Once the trial period expired, they would make things "convenient" for me by automatically deducting $14.95 per month from my account. On a page full of text, graphics, and fields, here is the fine print:

I had no interest whatsoever in what they were selling, and the promo gave me no idea what I could expect. In fact, because the conditions necessary to get $20 cash back  weren't spelled out (nor did they mention any conditions existed at all), the promotion was misleading -- something that is becoming increasingly frowned upon in a society that claims to value transparency and authenticity.

In the case above, the deception hid something that the company wanted to hide, but it still amazes me how many companies hide things that they think give them a competitive advantage.

They'll shove it under "About Us" and leave it there. They'll use cute navigation names and calls to action that hide the true purpose of the resulting or subordinate pages just to satisfy executives. What they fail to realize is that people aren't looking to be sold to. They're looking to accomplish something that probably has very little to do with the managers of the company or the bonuses they relish.

If you have information that may help people accomplish their tasks or be more comforted that they are making the right choice, aside from constructive design constraints, you should not force it upon them, but make the information accessible. When you do so, make sure people know 1) that the information is available and 2) how they can get to it, if they want it. - Cam Beck

Build Intentional Constraints for Non-Experts

I had a lot of difficulty writing this latest article for Marketing Profs Daily Fix.

The point is this: Design constraints should be embraced -- even sought -- when designing for non-experts.

How did I do? You be the judge. - Cam Beck

Image by Big-E-Mr-G

Stop What You're Doing and Read This

Most display advertising on the Web doesn't work. With an average click-through rate (CTR) of 0.14% to 0.2%, I will consider this statement self-evident.

That's not to say that it isn't worth it, since cost-per-thousand (CPM) impressions is extremely low, and companies can make up the ineffectiveness by putting these ads in front of a lot of people.

The principle reason they don't work is because people are already in a different mindset when they come to the ad-supported site (like Yahoo or MSNBC). They're usually looking for something, and that task has their attention.

Even if you successfully get their attention with a display ad, you are asking for a HUGE commitment from them to interrupt whatever task they were doing and do what you want them to do, instead. That is very difficult, which is why, if your company is using display advertising, you should consider a way to stop using CTR as your primary success metric.

Take the Mac ads that recently appeared on the New York Times website. There are a few reasons this worked that I won't go into here (Here's one take), but let it suffice to say that CTR was not as relevant as interaction.

If they clicked over to apple.com, that's great! The Internet gives us that ability whereas traditional TV does not, but if they interact with the ad and don't click over, they were still exposed to Apple's brand message.

Sometimes we are too in love with our own terms. CTR is a measurement, so we think we need to measure it. However, in the end, we're still trying to sell something, and people aren't interested in buying clicks or CTRs. We hope they're interested in buying whatever it is we're selling, and the less we have to interfere with their purpose, the better.

Even more, proper targeting should put us in a position to complement their purpose. - Cam Beck

Update: adWonder author Ryan Manchee has an outstanding follow-up to this article that is a must-read if this article resonated with you at all. The author is correct in pointing out, "[D]isplay advertising can be used effectively for response driven campaigns." Check it out.

We already know we're welcome. Now get to the point.

One of the cardinal sins of building web sites is falling prey to the temptation to blather about... well... just about everything.

The earliest transgressions of this behavior were typified by companies feeling it necessary to welcome you to their home page.

"Welcome to the home page of blah blah blah, a blah blah company that specializes in blah... blah... zzzzzzzzzzz"

But when we reflect that, on average, 60% of your traffic comes to your site through pages other than your home page, the importance of that welcome message to communicate your "brand voice" is reduced significantly, and you must instead communicate by relying on a model of organization that will allow users to orient themselves and discover whatever drove them to your site in the first place.

(Note: I imagine the variance for the above statistic is pretty large, depending on who you are. Consider that according to John's post the other day, only 3.6582% of Wikipedia's visitors hit the home page. For reference, the 60% statistic is pulled directly from Nielsen's Prioritizing Web Usability, pp. 28-29, and speaks directly of his measurements.)

Text serves a useful purpose on most pages in just about every site, but some require less than others. Say what you need to say, but don't clutter up the page with puffery and superfluous words that mean more to you than they do to the user.

I haven't read it yet, but I hear this is a pretty good book on the subject. - Cam Beck