Breakdown: Moraware

Moraware is a small software company that makes software for countertop fabricators.

Here’s what their website’s home page looks like:

And this is what I see above the fold:

There’s something I’ve learned over the years about selling software: some products can be totally self-serve (e.g. Basecamp), and therefore it’s appropriate to offer visitors a sign-up form. But certain other products require a big commitment and have a high switching cost (e.g. hair salon scheduling software) and in those cases, prospects really need to get on the phone with an actual human being before they’ll feel comfortable moving forward with the software.

I understand Moraware to be the latter kind of product. That’s why Moraware’s home page’s call to action isn’t “sign up for an account today” but “call us or email us to schedule a demo”.

This page has room for improvement in at least a couple ways.

First Improvement: Layout

When I first land at moraware.com, my eye is drawn to the following two places:

The big blue bar contrasts so sharply with the white background that I can’t help but immediately notice it. Since people love pictures of people, I also find myself keenly interested in the photos toward the bottom of the page.

This is unfortunate because the “email address” form—arguably the single most important thing on this page—gets relegated to background noise.

Let’s contrast Moraware’s homepage with some other landing pages for somewhat similar products.

This page is far from perfect (the background image is distracting, the copy inside the yellow box is uncompelling, and the “Get Started” button competes too much with the “Take the Tour” call to action) but it does demonstrate one thing well: the site, for the most part, squeezes you into a single call to action. It’s impossible to miss that yellow box and the white email field inside it.

Let’s take a look at another example.

This one is also far from perfect but, like the Lessonly example, the demo form and the “Request Demo” button are unmissable.

So here’s my concrete suggestion regarding layout: put the email form in a visually distinct box and use unexciting colors for the rest of the page.

But, I actually wouldn’t even recommend including the email form on the home page. Read the next section to find out why.

Second Improvement: Segmentation

This isn’t visible above the fold (which is probably kind of a problem) but if I scroll down a little, I can see that Moraware apparently has two customer segments:

It looks like I can identify either as someone who wants to quote countertops or someone who schedules and tracks jobs. Depending on which segment I’m part of, a different product is appropriate for me.

This make sense, although I might argue that the visitor doesn’t need to know about the product names “CounterGo” and “JobTracker” yet. We just need to know which bucket the visitor goes in.

What I would recommend on the home page is just big buttons, one that says “Countertop Quoting Software” and another that says “Scheduling and Job Tracking Software”, and no pictures. You want the buttons to be the most interesting thing on the page.

The SiteTuners website is a pretty good example of similar segmentation:

Notice how they funnel their visitors into “Large businesses” and “Small businesses” groups.

So now let’s put my two suggestions together: on the home page, I would just have these two segmentation buttons and no email form. Then I would put an email form on each of the quoting software and scheduling software landing pages.

Third Improvement: Testimonials

I noticed a great testimonial on one of your pages:

“COUNTERGO IS A LIFESAVER. OVER THE LAST YEAR, I’VE BEEN ABLE TO GROW THE COMPANY TO SEVERAL JOBS PER DAY AND HAVEN’T HAD TO HIRE ANYONE ELSE TO DO QUOTES.”

This testimonial is good because it’s quantifiable. He didn’t say the software was good or anything like that (which wouldn’t have been a very helpful compliment), he said the software allowed him to grow to several jobs per day. I wish the testimonial were even more specific, though. How many jobs per day was he doing before? What does it mean to him personally for the business to have grown? Has he been able to afford to buy something he’s always wanted? Has it allowed him to take more vacations or sleep better at night?

There should be more testimonials and at least a couple of them should be featured prominently on the home page.

Key Takeaways

  • Don’t add visually interesting things like photos and bright colors in places where they’ll compete with your opt-in form.
  • Do use visual interest to make your opt-in form stand out.
  • Give the visitor as few options as possible. If the visitor can’t immediately discern what he or she should do, he or she may well simply do nothing.
  • Feature some quantifiable testimonials on the home page.

 

 

Comparison: Grand Rapids Hotels

I travel kind of a lot for the web development training work I do. Some of the hotel-booking experiences I’ve had have been absurdly bad.

I was curious what I would get if I were to google “grand rapids mi hotels”. Hotel sites are paying for ads to show up when I search for things like this. Are they making good use of their investment or squandering it?

Below I review the landing pages for 4 websites:

  • Kayak
  • Experience GR
  • Trivago
  • Trip Advisor

Kayak, Trivago and Trip advisor are paid AdWords ads. Experience GR is an organic link.

Kayak

I want to address Kayak first because I think their landing page is the best. Here’s what appears above the fold:

This page draws attention to exactly the place it should: the form where you enter your travel details. The “Search” button also contrasts strongly with the background.

When I did this search, Kayak showed up as the #4 paid link. Let’s look at the #3 unpaid link, Experience GR.

Experience GR

There is a lot of missed opportunity here. Look what appears above the fold:

There’s literally nothing on this page that lets me advance my goal of booking a hotel room. This page follows the “modern” trend of having a hero image that occupies the whole viewport, completely wasting the valuable space available.

If I scroll down, the next thing I notice is the “Grand Rapids Hotels” chunk of content.

 

The headline “Grand Rapids Hotels” is not particularly captivating. What does that headline tell me about the information that follows? Not really much.

If I bother to read the paragraph below “Grand Rapids Hotels” (which I probably won’t), I see that it starts with “Lodging in Grand Rapids runs the gamut from luxury hotels to budget motels.” I’m not exactly on the edge of my seat.

On a landing page (or in most writing, really), the job of each sentence is to get the reader to want to read the next sentence.

If I see “Grand Rapids Hotels”, that doesn’t really pique my curiosity to want to read the next sentence.

If I read “Lodging in Grand Rapids runs the gamut…” I don’t even want to read the rest of that sentence!

I’m not even sure why these two paragraphs exist at all. I just want to book a hotel!

If I scroll down, I see the actual part of the page I’m interested in: the part where I can pick a hotel.

My first thought is that I’m confused as to how these hotels are sorted. I see that the first hotel starts at $69.50 a night, the next one starts at $44.99, then the next one is $219.00. That’s a wild difference.

When I look up to the top row of controls, I see that the list is sorted by name. I can’t really think of a less meaningful attribute by which to search for hotels.

Let’s contrast this for a second with Kayak’s hotel results page:

Kayak’s default sorting is by “Recommended”, which of course makes sense. People want to choose a hotel based on how much the room costs combined with how good the hotel seems.

Experience GR only offers sorting by name and price. Since name is arguably useless, Experience GR really only offers one attribute by which to sort.

Anyway, here’s what I think Experience GR’s biggest missed opportunity is.

When a visitor clicks on the Kayak link, the visitor is presented with a page that clearly has just one goal: get the visitor to click Search. Kayak has done a lot (made the form starkly contrast the background, made the submit button starkly contrast everything else, auto-filled the form fields, made other page options much less prominent) to reduce any friction that might prevent the user from taking this action.

Once the user has clicked Search on that page, the user has made a certain level of commitment to Kayak. The user has made a small “yes” to Kayak, which makes it that much easier for Kayak to get another small “yes”.

(By the way, notice how Kayak’s buttons say “View Deal”, not “Book Now” like Experience GR’s. They don’t want you to have to make any one big commitment at a time.)

So, I think Experience GR’s biggest missed opportunity is the failure to present the user with a single, clear goal that’s easy to say “yes” to.

Trivago

Here’s what’s above the fold for Trivago:

Their page looks pretty cluttered and almost amateurish in design. Let’s compare it to Kayak for a second.

In Kayak’s case, it couldn’t be clearer which part of the page it is I’m supposed to focus on. With Trivago, not so much. No one thing pops out as the dominant element.

Maybe I’m supposed to focus on the calendar first. It looks like I’m supposed to select a date from the drop-down, but the design of the date field also makes it look like maybe I can type there. And I can’t help but be drawn by curiosity to the results that appear below the form. There’s just too much noise on this page distracting from the page’s goal, which is presumably to get me to perform a search.

I think Trivago could benefit hugely by simply hiding the search results when the page first loads. If it’s necessary to enter a date range before the search results are meaningful, then why show search results at all before a date is entered? And if the search results can be meaningful without first having a date range, why have the date dropdown automatically dropped down when the page loads?

Trivago could also benefit from a more professional-looking design. I’m not a graphic designer so I can’t comment on exactly how this could be achieved, but most people could probably sense a pretty stark contrast between how professional-looking Trivago’s site looks and how professional-looking Kayak’s site looks.

TripAdvisor

Here’s what’s above the fold for TripAdvisor:

TripAdvisor doesn’t suffer from the amateurish design problems Trivago and Experience GR do. From a pure “professionalism” perspective, TripAdvisor looks just as good as Kayak.

Usability seems pretty good, too. The large “Grand Rapids, Michigan Hotel Deals” header is where my eye is drawn first, and then naturally I look next to the search form.

There are at least a couple things TripAdvisor isn’t doing as well as Kayak. First, Kayak seems to have a better understanding of the principle of small, incremental commitments and the benefit of limited choices.

On Kayak’s landing page, above the fold, there’s one and only one action available: click Search. (You could also navigate away but that’s not really an action, that’s just navigating away.) It’s very easy for me to say “Oh, you want me to click Search? Okay, I’ll click Search”. When I then land on the results page, I’m probably more likely to follow through with my action because I’ve already made a micro-commitment to following through with the action and I want to be consistent with the “message” I’ve sent by clicking Search.

(By the way, I learned about people’s desire to be self-consistent in the book Influence by Robert Cialdini.)

TripAdvisor doesn’t have the small-commitment thing going on. When I click the link on the Google search results page, I’m taken straight to the TripAdvisor search results. Now I have to expend some cognitive energy (only a little big of cognitive energy, but some) figuring out exactly what it is I should do.

Again, this also ties into the idea of limited choices. If TripAdvisor had limited my choice to “either click Search or don’t”, it would be a lot easier for my to say “yes” to their request. But since I’m not even 100% sure what the request is, it’s harder for me to comply.

Key Takeaways

  • If you limit the number of choices on a page, it makes it easier for the visitor to say yes to whatever you’re asking them to do.
  • According to Robert Cialdini’s Influence, when a person says “yes” to a request of yours, it makes them more inclined to say “yes” to your next request. Therefore, don’t ask a visitor to do something big. Break the big request into a number of smaller requests.
  • Professional-looking design engenders more trust than amateurish design. (Duh.)
  • If you want the visitor to perform a certain action, put that action above the fold.
  • If you want page copy to get read, keep it extremely short. Use a header to attract action. Make the header evoke curiosity so that the next sentence gets read. The job of each sentence is to get the next sentence read.

Breakdown: I Will Teach You To Be Rich

I’ve long thought that the more “innovative” a website is, the harder it is to use.

The more animations, the more sideways text, the more “creativity” a site contains, the more it differs from the web conventions visitors have come to expect and rely on.

Ramit Sethi’s website is totally un-innovative. That’s why I think it’s good.

There’s no giant hero image or crazy ass giant video in the background on Ramit’s site that starts playing when the page loads. Aside from the photo of Ramit, there’s just one color, yellow!

And not only is everything else gray, it’s light gray text on a lighter gray background. It’s as if he wants you not to notice the rest of the site. I believe that’s precisely the idea: the only thing Ramit wants you to do on this site is to take his earning potential quiz.

Here’s the part of the page that’s visible in the viewport:

As you can see, it’s clear that the designer of this page really wanted to you click that “Start the quiz” button.

It’s also pretty clear what you get if you do click that button. I can tell that if I click that button, I’m going to be presented with an “earning potential quiz” and then I’ll get a custom report after that. It looks like Ramit only wants to attract people who want to “discover how to start making extra money”.

Below to the main call to action are the media outlets where Ramit has been featured. He’s using a tactic called social proof. Social proof, which I first read about in Robert Cialdini’s book Influence, is basically a shortcut our brains use that says, “Look, a bunch of other people think this thing is good, so it’s probably good.”

Besides the few short blurbs under “What you’ll get”, there’s really not much at all on this page. There aren’t even footer links like you’d expect from a big, popular site like this. This page has one single goal, which is to get you to take that quiz (and ultimately give Ramit your email address).

By the way, if you’re someone who markets and sells stuff online, I highly recommend that you get on Ramit Sethi’s email list. I teach myself email marketing mainly by subscribing to the email lists of “the masters” and observing their tactics. I don’t know of anyone better at email marketing than Ramit.

Key Takeaways

  • Point all your guns in the same direction. Decide one single action you want the user to take and make everything on the page support that action.
  • A quiet, “boring” design is probably more effective than a “creative” or “modern” design.
  • Social proof builds trust.