DON’T MISS OUT

Get updates on new articles, webinars and other opportunities:

User Flow Optimization: The CRO Strategy No One Talks About

by Today's Eggspert

A/B testing works… sometimes.

But more often than not, you’re simply “moving deck chairs around the Titanic” as Larry Kim puts it (making small changes that only generate small returns).

Instead, the ‘unicorns’ – or the A/B tests regularly topping 10% conversions – are focused on overhauling their offers and restructuring the flows and funnels through their website.

Here’s the step-by-step process my company used to optimize a website’s user flow to deliver 166% increase in leads after three months.

marketing performace

Three months of user flow optimization vs. the previous period.

Why A/B Testing Isn’t Always That Great

A/B tests are awesome in theory.

You barely have to lift a mental muscle in deciding whether a green button sounds better than an orange one.

Early results look promising? Awesome. Brag to your boss and cue case study article for Inbound.org.

Unfortunately, there are a few problems with A/B tests.

First is that “tiny changes” often lead to “tiny results” (if any), and more commonly regress back to the mean, according to Larry Kim’s data of over $3 billion in annual ad spend.

converted

Image Source

A/B test example where initial results average out over time.

Then you’ve got an issue with volume.

You’re going to need at least 1,000 monthly conversions before getting started and a minimum of 250 conversions before declaring a winner.

Half of the people reading this have probably been ruled out just based on those requirements alone.

But there’s still one more thing…

A/B tests fail to deliver significant results most of the time.

They habitually over-prioritize surface level changes, without the research and analysis behind it that inform what should be tested in the first place.

You end up obsessing over a tiny piece of the overall conversion process, while neglecting the broader context of what happens before and after people see that little button color variation.

Instead of obsessing over which minuscule test to run next, the ‘unicorns’ topping 10% conversion rates are playing a different game.

Rather than chasing the one elusive change (out of a hundred) that will move the needle, they’re focused more on improving the entire user flow or journey.

Here’s why.

How User Flow Optimization Works

One of the first steps when sitting down to brainstorm a new site design is determining how user flows, paths, or funnels will work.

This critical step will influence interactions and use; as opposed to just designing pretty pictures in a vacuum.

It will dictate your information architecture, or reorganize the current one once you figure out the different paths people will use to buy things on your site.

user flows

Image Source

How user flows influence a website’s information architecture.

Function, after all, is what you pay the big bucks for on custom design and development.

Case-in-point: there are many excellent ‘DIY’ website builders out there like Wix or Squarespace that will allow anyone to create a beautiful site. All for only a few bucks a month.

website templates

Image Source

Squarespace provides beautiful templates that look and feel custom. But DIY options like this often lack a strategy organization and use.

What’s commonly lost though (or glossed over) is the thought-process behind how those aesthetically-pleasing pages fit together.

User flows already exist on your website. They just might be inadvertent (and ineffective) ones.

They’re there; haphazardly forcing people from one step to the next in a jumbled mess. And they’re often sabotaging your conversion rates as a result.

In an ideal world, you want to streamline a visitor’s experience to help them find what they’re looking for on your site faster and easier.

It’s a delicate balancing act though, where sometimes the best customers are repeat visitors (and not the ones who convert immediately).

So you want to build out a series of connected offers, campaigns, pages, and sequences for visitors who’ll come back over time, tying them in with where a session starts from (like the page and channel).

For example, the homepage is ground zero in most companies, where every department and director wants their own piece of the pie. That’s why everyone settles on a nice carousel slider (that your competitor no doubt also has), despite the fact that they suck for both experience and conversions.

But many times, when you start looking at user flows, you’ll notice that many people don’t even use the homepage. They’re going from a PPC campaign direct to a landing page. Or they’re Googling some commercial keyword and ending up on a product page.

Whatever the case, you have different visitors using different ways to (hopefully) end up at the same place: your Checkout, Sign Up, or Quote Request page.

online steps

Image Source

Three example user flows, where the initial acquisition source dictates messaging of the ‘funnel’.

Here’s How to Analyze Your Own Website’s User Flow

Improving your message match is one of the best ways to increase conversions on an ad campaign. It links together what people are looking for, with the ad they see, and the content on the landing page they hit.

Optimizing user flow is the same, except you’re extending this process into every step someone takes through your website, linking one page or follow-up email to the one that preceded it.

Here is an abbreviated, cliff-notes style outline that focuses on the high points.

Step #1. Determine Where Users Are Coming From (to Understand What They’re Looking For)

Multi-event, multi-device journeys are becoming the norm.

People bounce around using different channels along their customer journey, increasing awareness and evaluating their options prior to purchase.

Google’s Customer Journey to Online Purchase tool visually depicts this, showing how people will use different online promotional channels at different points in time.

marketing channels

An example of how consumers for small eCommerce brands will use different channels to find a website throughout their purchasing process.

That means, the specific method someone is using to arrive at your site can tell you a lot about who they are and what they’re looking for.

The easiest place to start is inside your own Google Analytics with the Sources / Mediums sending you traffic. Here’s what one client’s data looked like.

source medium

A client example that showing the traffic or acquisition channel sending the most people to this website.

So far we can see that a large percentage of their visits are coming from Organic Google searches, Direct, and some Paid Searches as well.

You can then cross-reference this with looking at which pages these people are going to (or how they’re flowing through the site) to get a better understanding of what they’re doing (e.g. what they’re typing into Google) to reach your site for the first time.

page interaction

A client example showing how user’s flow from traffic channel to different pages throughout your site.

We’ve barely scratched the surface, and yet we’ve already been able to uncover a bunch about this website. Specifically, we can identify two primary segments of traffic:

  1. Most of the visitors are already ‘brand aware’; visiting directly or doing branded searches as evidenced by the majority of people going straight to the homepage, about page, and product/service pages. (Whereas one of the main benefits of creating a blog, for example, is to talk about ‘unbranded’ topics that bring in new people who haven’t heard of you yet.)
  2. The second group of people are coming through a paid search campaign and going directly to a landing page. This one’s easy and straightforward.

Great. Now what?

Let’s see what people do once they’re on the site.

Step #2. Analyze What’s Working (or Not) With Current Pages

Now that you know where people are coming from, what they’re looking for, and where they’re going, you can start to re-create what each segment’s current user flow might look like on your website.

This includes all the ‘micro-conversions’ or small interactions and follow-ups that people see when jumping from one page or opt-in to the next.

visitor steps

A client example that illustrates all the micro-conversions someone has to accomplish prior to a new lead conversion.

Seeing this laid out visually helps you spot the obvious problem areas or bottlenecks that might happen from one transition to the next.

For example, lead nurturing is a common missing component.

People usually need at least 6-8 ‘touches’ prior to converting. However, your latest Facebook Lead Gen ad campaign tries to send people directly to the landing page to order.

When instead, you’d be better off creating a follow-up drip campaign that educates and nurtures these new leads.

But now you can quickly spot an issue like this and take action, coming up with possible solutions like using a Facebook ads CRM sync that will automatically add news leads to a workflow in MailChimp, Infusionsoft, HubSpot, etc.

facebook hubspot

AdEspresso’s helpful CRM sync will automatically add new leads to specific workflows in HubSpot.

After compiling these user flow steps, you can start to dive deep into each individual one within the process to analyze how users are interacting with each page, what’s working well, and what’s not.

This is where CrazyEgg is worth its weight in gold. Literally. Being armed with compelling visuals helps make your case to clients and bosses better than any boring research report.

Here’s a few examples.

That long homepage jammed-pack with every department’s feedback? No one’s reading it.

How do you know? The Scrollmap tells you so.

heatmap

How far down a page someone is scrolling, or how much content they’re consuming on the page. In this example, no one’s reading below the fold.

White hot is good, while deep ocean blue is not — illustrating that in this example no one goes below the fold.

One possible reason? There are too many options and distractions!

The Overlay feature can show you how people are interacting with a page, and where the majority of clicks are happening. This example below shows the abundance of places people are on the homepage.

451 research

What (specifically) are people clicking on, and is this page doing a good job driving people into a funnel or flow?

While your homepage can get by resembling an air-traffic controller, directing people from one stop to the next, that’s definitely not a good sign for internal product or service pages.

Here’s why.

Step 3. Analyze Conversion Opt-In & Follow-Up Sequence

If design is how something works, your landing page design depends on if people are clicking on your CTAs.

Landing pages should have a specific goal or objective in mind. Sometimes that’s adding it to the cart, while others it’s to begin filling out a form.

What you don’t want here, is chaos.

heatmap

A bad example of what happens when a page isn’t designed with conversions in mind — visitor interactions are spread out and diluted.

The heatmap example above shows page interaction and clicks all over the screen. There’s no focus, and it leads you to believe that this page’s design is unclear and incoherent. Users aren’t sure what they’re supposed to do next. So the vast majority of them go back up to the Nav bar and go somewhere else.

Contrast that now with the click distribution of another landing page. Where the previous example would show too much parity between elements, on conversion-focused pages you want one or two CTA-elements to have a monopoly of interaction.

visible on this page

The click distribution of different page elements. A majority of clicks on your CTA’s is a good sign for conversions!

The overwhelming majority of people are clicking on your page’s primary CTA?

You’re on the right path.

You can get there by starting with the best practices, and make tweaks or adjustments based on a template like this ‘perfectly testable landing page.’

The key though is to make sure you’ve done all the previous work up to this point, because that’s what influences your decisions.

For example, sometimes you want the form on a landing page to be nice and short, so you generate as many ‘top of the funnel’ leads as possible. However other times you want it to be long and detailed, so only the most qualified ‘bottom of the funnel’ leads get through. This example below is the former.

intro to smart irrigation

A bad example of a landing page that (among other things) features a form that’s too long for the ‘top of the funnel’ offer they’re promoting.

The context for making this call comes from knowing where these people are coming from (step 1 above), and where this page is showing up in the overall funnel (step 2 above).

From there, you can continue scrutinizing each additional interaction or ‘touch’ someone has with your brand, down to the follow-up email notifications and ‘thank you’ confirmation pages, to make sure that you’re aligning not just design but the entire customer experience.

thank you

A bad follow up email example that doesn’t ‘sell’ the next step or action a reader should take.

Conclusion

Landing page optimization techniques like A/B testing get all the headlines.

But it’s only a small component of the overall conversion optimization process or practice.

They’re also relatively high-risk, low-reward too.

They take a ton of time, they require a ton of volume, and they commonly deliver only minuscule results that can eventually go back to being just ‘average’.

In reality, conversion optimization is about improving the entire customer flow, optimizing each step and micro-conversion along the way.

These user flows are already playing out on your website, whether they were deliberately set-up or not.

Focusing the bulk of your conversion efforts here can not only deliver ‘big wins’ in comparison, but they can also deliver more consistent and predictable wins too.

About The Author:

Brad Smith is a founding partner at Codeless Interactive, and frequent contributor to Kissmetrics, Unbounce, WordStream, AdEspresso, and more. Connect with him on Twitter.

*Featured Image Source

3 Comments

DON’T MISS OUT

Get updates on new articles, webinars and other opportunities:

Today’s Eggspert

This article was written by today's Daily Eggspert. If you would like to contribute as an Eggspert, please reach out to us here.

3 COMMENTS

Comment Policy

Please join the conversation! We like long and thoughtful communication.
Abrupt comments and gibberish will not be approved. Please, only use your real name, not your business name or keywords. We rarely allow links in your comment.
Finally, please use your favorite personal social media profile for the website field.

SPEAK YOUR MIND

Your email address will not be published.

  1. John Fox says:
    October 14, 2016 at 5:49 am

    Did you happen to compare mobile vs. desktop scroll behavior?

    • Brad Smith says:
      December 15, 2016 at 9:21 am

      Hey John!

      I don’t recall comparing mobile off the top of my head, but that’s a great point to consider and check out!

  2. Elizabeth says:
    October 12, 2016 at 7:23 am

    Thanks for sharing this , i was looking for a good article on creating good website design,it will help me to understand the whole criteria easily.

Show Me My Heatmap

Ah, @CrazyEgg I really do love you! So useful evaluating how users are interacting with all aspects of our zanerobe.com redesign

Mike Halligan

@MrMikeHalligan