Wes Cutshall

This is what your website looks like on a modern computer when you don’t redesign it for more than 10 years.

Relax…Stretch

Tirerack’s website fits within an 800px width. It is awkwardly jammed into the left-hand side of my screen. I checked Google Analytics on my own sites and found that PC screens with a width of 800px or less made up 5-6% of my visitors. I would argue that Tirerack would have a similar technologically advanced, but more male dominated, demographic. I have no idea why Tirerack has insisted on keeping this design when the web offers so much more.Why not stretch a little and make the site easier to use on today’s larger screens?

It Still Works

But, kudos to them for staying in business. In those 10+ years nobody has come up to even challenged their business. I’ve been buying tires from them for more than 10 years and always feel that I get a good deal. But, it’s fairly inexpensive, IMO, to update a website to a more modern layout; and it can only increase their revenue. If I were a stock holder I’d be asking why we are actively attempting to appear out-of-touch with the modern world. After all, buying tires via the web was a pretty bold, forward-thinking, concept when Tirerack launched. You would think they’d “get” it.

The biggest website implementation mistake I see is still the Wall. People are just convinced that their offering is so enticing that people are going to be compelled to register just to find out if they’re truly interested in becoming a customer. This goes for free, freemium, and for-pay websites. I’m still shocked at the mistakes being made in this area. What’s the cause? Ego? Lack of creativity? There’s a solution.

In 2004 when I was doing research for my lost dog website idea I ran into a ton of websites behind a Wall. One in particular has stuck with me. The domain has since been sold (hint, hint, Walls suck) so I won’t link to it here. The website had a registration fee and a Wall. If you lost your dog you could pay to register and then you’d be able to search their found dogs list, etc. No public stats. No sample data. No idea if ANYONE was using the website (they weren’t). When I designed Fido Finder one of my ideas was to make it so obvious if/that it was used. And, I didn’t make people pay to register (that’s the mother Wall of them all, the Pay Wall).

Workarounds to the Wall

Groupon

Groupon.com is hidden behind a wall…if you visit their home page directly. The home page is a wizard walking you through picking your city and registering with your email address. You have no idea if they are offering anything you want. But, they have allowed for viral sharing. Their city pages are open to the public, if you know how to find them (Google). The Houston page shows current deals with details. The site also allows for direct linking to the individual deals themselves without having to be a registered member to view the deal. This allows for email sharing. Without this “window” on the side of their Wall, Groupon wouldn’t have the viral traffic that has made it a household name.

Groupon home page attempts to get you to climb the Wall

You can find city pages, though, if you Google for them, or are linked to them.

Fab

Fab.com has an interesting workaround for insisting that their products be behind a Wall. For example, Fab advertises its products on Facebook. If you click an ad you’re taken to a landing page that shows the page content in the background with a “register/login” overlay. You can see a dimmed content page behind the registration box. You can tell that this content is what you wanted to look at when you clicked the ad. It’s just enticing enough that you might consider registering in order to see more about this product. It’s an interesting compromise. Fab’s business model is built on the concept of emailing you daily product offerings. Their goal is to get access to your inbox to sell more products. For their concept to work you have to give up your email address. It worked, at least for me. Fab developed a glass Wall that I could see through. I could tell what was on the other side, and I wanted to be able to access it. So I gave up my email address. And now they email me every day and often I click their product links. Hautelook.com has a similar interface. You can view the current “events” from behind the tinted window. But if you want full access you have to register.

It’s behind a Wall, but I can see what it is!

Ideeli

Ideeli.com, another fashion deals website goes about skirting the Wall in a different manner. Ideeli first takes a shot at getting you to register on their home page. If you’re curious enough and click anywhere on the page (away from the registration box) you’re taken past the Wall, it seems. You now are viewing the product catalog. If you click through to a specific product you can now “add to cart”. When you try to add to your cart you are informed that you must be a registered user. Ahah! And this is not the same as a retail site asking you to create an account for checkout, you will be registering to receive daily/weekly deal emails. This interface is a good alternative to completely hiding behind the Wall.

Ideeli home page, click on the woman and you go to the catalog

It will appear as if you bypassed the Wall. You can see the products!

Click on a product and click “Add to Cart” and your shopping is abruptly stopped.

Klout

Klout.com is a website that measures your Internet reputation. Currently the only people that care about someone’s Internet reputation are those of us who have a Google alert set up with our own name. Nobody really looks someone ELSE up on Klout, do they? If you happened upon your own Klout profile, which is often generated based on public Twitter (etc) data before you ever visit, you would see something like the image below. You can see that Klout has information about you, and your friends / followers. If you were curious enough, you would be able to register to find out what else Klout knows about you. Klout wants you to register and connect to all of your social media accounts. Giving you a sample of the data they have about you is enticing enough for most to sign up. If you’ve made it far enough to find your Klout page you’ll probably register to see what’s behind the Wall.

This is the Klout Wall. But you can see through it. Register to see more.

Instagram

Instagram.com, by being a smart phone app, has a built-in Wall. You have to download the app in order to see what it really will offer you. The good thing about Instagram is that it’s built upon sharing. You can get an idea what the app offers simply by viewing other people’s photos that they have posted on Facebook and Twitter. Instagram wants you to register and follow these people within their app, sort of like following on Twitter. Most people have been introduced to what Instagram has to offer just by being a member of the Internet’s social media sites. Without this sharing push Instagram is just another behind the Wall photo filter app.

Conclusion

Putting a site behind the wall is most often a mistake. Getting traction for a site like this is expensive. Often the product offering isn’t good enough to support a Wall. Don’t assume that you’re website will be different from thousands of other failed sites behind a Wall. But if you need a Wall, consider some of these workarounds. Have a window and allow for social sharing to more than just your home page.

Fido Finder was my first Internet site and continues to be one of the most well-known sites I own. The site is built on the freemium business model. Give away the basic product and allow customers to choose to upgrade their account. On Fido Finder, users are given the option to choose a la cart upgrades to their lost dog listing. Since inception, the layout of the upgrade page has been pretty much the same. I’ve never been 100% happy with the page but I lacked other ideas. Recently, I started from scratch in designing the upgrade page and doubled my conversion rate. I’d like to share some of the things that I noticed, learned, and implemented during this time.

The Old Interface

I had a lot of problems on the old interface deciding what should be the focal point of the content. What was the selling point of an upgrade? We have the description of the upgrade, the benefit of the upgrade (listing time extension), and the cost of the upgrade. If you choose an image upgrade you can show exactly what your lost dog looks like. Choosing this upgrade extends your listing time by 30 days. And it only costs $5. Which of these factors is most important to users? The problem is that this is different for different users. Throughout the history of the site I emphasized different parameters (upgrade, extension, price) of each upgrade hoping to increase conversions. Nothing seemed to make a difference. Conversion rates hovered around 8-10% for years.

old interface

Starting From Scratch

When I decided to redo the upgrade page I sat and thought about the psychology of the upgrade choice (inspired by Predictably Irrational). Why would a user want to upgrade? What do they think it’s going to accomplish? I realized that users aren’t trying to accomplish making their listing show longer on the site. If you’ve never lost a dog before you’re thinking that he’s going to be found in a day or two and you just have to reach the finder. All they are thinking about is getting their dog home, now. There is no benefit to pushing the number of days an upgrade adds to their extension. Most users expect their dog to be home before their listing ever expires. So I removed the listing extension from my plans.

In a perfect world you make users think, “I need to do this, or else…” Regardless of what you are selling, you want them to create their own sense of urgency. I decided to present users with the reality of their decision to upgrade or not. Instead of the standard checkbox to select an upgrade that you want, the page loaded with radio buttons that have “I do not want…” selected. How ridiculous is it to agree that you “do not want” to upload an image of your lost dog. Of course you want to!

The traditional layout would be to have the default options on the left and chosen options on the right. So you would have “I do not want…” on the left and “I want…” on the right. I decided that this was the opposite of what I should do. Putting the “chosen” radio button on the left, instead, made it feel like after selecting the first upgrade the user should make all of the options on the left selected. It becomes obvious that each option’s correct property is to be selected, with the radio button on the left being selected. It feels as if the natural order of the page is to have 4 filled in radio buttons on the left. The “correct” thing to do is to select all of the upgrades. It feels unnatural to leave some of the radio buttons toggled to the right. I point out at this time that I do not like automatically checking optional upgrades and forcing users to deselect them, even though this would truly cause users to click on “I do not want”. Auto-selecting all 4 upgrades would mean that the interface loads with lots of overwhelming prices. Not a good idea.

new interface when the page loads

At the time that the page loads users don’t know that these options cost money. I wanted to them to make the decision “yes/no” I want to upload an image before they are presented with the price. I wanted users to think, “Duh, of course I want to upload an image!” before they can think, “I can upload an image if I want to pay $5.” Once a user selects “I want”, the price appears. In order to move past this page, and not pay, you have to approve the options of “I do not want…” How absurd does it feel to choose to not help find your lost dog? Another addition not represented in the interface images is the addition of the lost dog’s name to the upgrades. “I do not want to upload an image of Fido.” Choosing the reward upgrade extends your listing by 1 day for each dollar on the reward amount. I used to actually try to explain this on the page. Also, the price to add a reward is 10% of the reward amount. I used to try and explain this, too. The new interface simply changes the price of the upgrade if you change the chosen reward amount. Less interface is better.

new interface after items are chosen

Conclusion

After implementing this new interface conversion rates doubled instantly. I focused on what users want to buy (hope and help, not more time). I forced them to think about “What if I don’t?” and “Am I doing all I can?” And the interface is simpler by removing wordy descriptions (the real site had a sentence under each blurb of the upgrade) of the upgrades. Sometimes you have to step back and start all over. Think about what would drive users to choose your upgrades; sell them what they want. There are always multiple ways to design an interface, make sure that you’ve chosen your design for a reason. When I first built Fido Finder I built the page this way because it was all I had ever seen. 8 years later it was time to rethink it all.