We recently finished a complete redesign of the landing page for our OpenCart mobile theme. Both the theme and the copy were changed.
It took a number of iterations to make it look like it does now. I cannot say a lot about the design, but I'll tell you what transformations the copy went through and why.
What was wrong with the old page?
It wasn't terribly bad, but I'll only focus on what was wrong with it so that I can emphasize the reasoning behind the changes that we made.
Here is our old landing page:
<a target=”_blank” href=”
Links leading away from the landing page.
The main issue was that there were too many unnecessary distractions: Links on top, 2 Calls-to-Action (CTAs) at the very beginning, more links at the end. Where should a poor visitor click first? Should they click or stay on the landing page?
You generally want to keep your visitors on the landing page because they can scroll back and forth and re-read whatever they need. If they move to another page, they might never come back.
No final CTA.
The purpose of a landing page is to convince the visitor to take one single action. After all of the arguments have been laid out, it makes sense to ask the visitor to take the action one final time (a.k.a. "the final CTA").
What we wanted to improve
We embarked on a complete redesign with the following idea:
A sales page has to guide the visitor effortlessly to one single goal—clicking the main CTA.
The keyword here is "effortlessly". What effort is there is browsing a web page?
I'm referring to a psychological factor called decision fatigue. In short, making choices, even the simplest ones, lowers the glucose levels in the blood. As a consequence, when these levels are low, we prefer not to make any more choices and often just choose to do nothing.
When a visitor stumbles on your sales page they have to decide on a number of things: "Should I click on this link?", "Which link will give me the information I'm seeking?", "Oh, should I see that picture instead?", "Hmm… there is a video, should I see that?"
Instead, all of the arguments in favour of choosing your product can be presented with text and images on one page. No external links and unnecessary distractions.
Landing page v1.0
After a lot of iterations we finally released the new landing page to the world.
Landing page v1.0 didn't convert very well. However, we had done one single thing very successfully—the visitors were reading the text. We got them interested!
According to our Google Analytics data, the time on page for the front page increased by 100%.
How we wrote the copy
Being in the OpenCart world for quite some time and having sold that extension for quite some time we did have insight into why we were successfully selling a mobile theme to OpenCart store owners. However, this isn't where all of the text came from. We didn't just think of it.
There is NO creativity in copywriting.
If someone told you that you need to pick your brain to come up with the best sales pitch or you need some kind of talent, they would be lying.
The copy that we wrote was carefully patched together using our own version of the Pain-Dream-Solution-CTA structure found in Amy Hoy's article about how they doubled their conversion rate, our knowledge about landing pages and our knowledge about our customers.
Here's what Landing page v1.0 looked like:
Let me go through each of the elements I highlighted above:
- Our customers' core pain. We already knew the main problem that our product solves for them: "Smartphone visitors leave without buying. I'm missing out on sales! I'm losing money…". If we were to follow Amy's process blindly, we'd probably stop here. However, we knew that in our case, potential customers already realize that they need a mobile-optimized site to tackle this issue. We didn't have to sell them on the idea of having a mobile website. But, through research, we found out that getting a mobile site up and running is what really grinds their gears. And I say "through research" because the subpains that you see are literally taken from the OpenCart forums.
- Their core dream. From the pains, it's kind of obvious that our target customer dreams of saving their time and money building a custom mobile website. They dream of having a sure-fire way to do this. You will see other sub-dreams throughout the text. The purpose was to keep the visitors reading. Simply stating that they have a problem doesn't interest them. They are aware of it. Mentioning that there might be a way to get exactly what they want is more intriguing.
- The solution, based on 1 and 2 we're presenting our mobile theme as something that is easy to install and adds a mobile theme to the OpenCart website instantly.
- The demo. This is the hands-on experience with the product. Another way to get them more interested.
- The list of benefits. You will read in a number of marketing books that people care about the benefits of using your product. They don't really care about its features because they can't directly connect the features with the desired benefit.
- The testimonials inspire trust and increase your conversion rate. You see them sprinkled in our copy and this isn't random. The first 2 testimonials are there to support the claims of the paragraphs that precede them.
- The Call-to-Action is after we have presented enough evidence why this is the best mobile theme on the OpenCart marketplace.
- The list of FAQs is for those who are still hesitating. The point is to remove any doubts that the potential customer might still have about the product. The funny thing is that the single question that you see directly answered on the page was actually asked by one of our potential customers. Again, this comes from the people who are using our theme, from store owners. It's not something that we thought they wanted to know.
- Some more testimonials are there to reinforce the public opinion that this is a great product.
- The final CTA. As I said, it's there as a logical ending. After the first CTA we've laid out more proof that this is the right product for our visitor. It makes sense to ask them again if they are convinced.
As you can see, we didn't "create" all of this content. We just glued it together into coherent text. You can do the same for your landing page.
Why the new page was better than the old one?
- All distractions were removed. All a potential customer would want to know is on the front page.
- There was a final CTA
- There are only "Help & Support" links for those who have pre-sales questions and a "Docs" link for the existing customers.
- The copy. Judging by our heatmap (below), most of the visitors read the text. Also, the time on page doubled.
- The benefits section. Again, the heatmap showed that people were interested in that section. They weren't very interested in the features section, though.
- The "Help & Support" link. It got quite a lot of clicks, which means that people had questions. It was a good idea to give them an easy way to contact us.
What didn't work
- The demo link wasn't a link. Since we're selling a mobile theme, we wanted our potential customers to type the URL in their phone's browser and experience the theme on a real smartphone. However, they kept clicking on the demo text hoping it was a link.
The bottom line
In the end of our iterations landing page v1.0 seemed bulletproof. It contained every piece of convincing evidence that our mobile theme was the best choice for an OpenCart store owner. It didn't convert very well but we did double the time they spent on that page.
What’s in this article for you?
Two things that you can A/B test on your landing page:
- Remove all distracting and unnecessary links that lead away from your sales page
- Try to emphasize the benefits (desirable outcomes) of using your product instead of the features. Why would people want to use it?
And one thing that always produces better results:
Make sure there is an easy way for people to get help! A lot of your potential customers will have questions about your product. Make it easy for them to contact you. Don’t worry, you won’t be swamped by support mail. And even if you do, that’s an excellent opportunity to learn more about your customers and, therefore, to improve your product, your landing page and increase your sales.
What did we do next?
Guessing a.k.a. A/B testing.
It was time to try and find out why our new landing page wasn't working the way we expected it to and how we could improve it. We had to make guesses and prove or disprove them with A/B tests.
I'll tell you more about landing page v2.0 in the next post. Don't miss it. Subscribe to the mailing list below. It's spam free.