A/B testing is the one thing that separates opinion from science.
You cannot know in advance what will work based on previous experiences because every single web page is unique: it speaks of a specific business and refers to a specific target of users.
Which is better, the red button or the blue button? Do you prefer a slide or a video? A title with a question or with an affirmation? Enough bar talk. You can’t know it like I can’t know it.
Tests are done. 50% of visitors see the page with the red button, and the other 50% see the one with the blue button. Once you have a good number of conversions (minimum 100 per variation), you can see which page converts the most and keep that one. Then more tests, and so on.
Well. But where to start to practice A/B testing? There are 2 tools that I recommend for creating A/B tests: the first is Visual Website Optimizer, and the second is Optimizely.
Both tools are really well done and have extremely intuitive and professional creation editors at the same time. They also have a very active reference community and in-depth blogs that will give you answers to all kinds of questions.
To start, I recommend Optimizely as it offers a free basic plan to get used to. (Visual Website Optimizer offers you a free trial period of only 30 days, which is too short to become familiar with the tool).
So come on, register on the Optimizely website, and let’s start your first A/B test immediately!
Table of Contents
Implement tracking code for A/B testing
Once you have registered and entered the Optimizely dashboard, you need to connect the platform to your website. Go to the “Settings” item and copy the implementation code. You will need to paste it into the HTML of the pages you intend to monitor just before the <head> section ends.
Depending on the CMS you use, there are different ways to do it. In this example, I’m using WordPress, and there are two cases, either install the appropriate plugin and proceed according to the instructions or enter the code manually, pasting it at the top of the page (make sure the editor must be in the text version!).
NB: if you intend to proceed with the manual implementation, you must insert the code in each of the pages involved in the test.
Create a variation of your original page
Once you have entered the tracking code on your site, go back to the Optimizely dashboard and click on the green “Create new experiment” button. You’ll need to enter the page URL where you want to run the experiment.
Start with a simple landing page: tests on categories, products, and cart pages are a little more complicated, and you can do them once you understand the basics.
You will be sent back to the Optimizely Editor screen, where you will see the URL page you entered (Original) and a variation (Variation #1).
- You can create different variations of the same page to perform an A/B/n test, but be careful: the more variations you create on the same page, the more traffic you need to achieve statistically acceptable results. So unless you have a page with 10,000+ daily visits, only test one variation at a time.
- In the variation, modify ONLY ONE element at a time. If you isolate one variable (e.g., a button, a title), you will know with (almost) certainty that the difference in conversion rates between the two pages depends on that element. If you make a variation with the title, colors, button size, and other amenities, how will you know which elements are better than the original page?
In the example below, I created a copywriting variation of the Landing Page for lead generation.
The technique is simple: we give you a free ebook that explains ten ways to increase conversions on your website; in exchange, you give us your email. Quite honest.
The CTR is already satisfactory in itself, but we are not satisfied: we want more and more people to download our Ebook. For this, we need to know which title captures the most attention and facilitates the transformation of visitors into leads.
As you can see, in Optimizely’s visual editor, it’s really easy to select and edit any element. In my case, I click on the H1 title and select “Edit Element” => “Edit Text,” and insert a variation of the title, from
Original: “Free Ebook Course “10 Web Marketing Strategies to Increase the Sales of your E-commerce Site”
Variation #1: “10 Practical Strategies to Double Your E-Commerce Site’s Conversions (and Revenue)”
That’s all! Easy right? Now all you have to do is create one or more goals based on which to calculate the different conversion rates. Don’t worry; the software will do all the calculations!
Create one or more goals
To create an objective, click on the flag icon at the top right, next to the “Start Experiment” button. You can create three goals depending on what you want to track: clicks, page views, and custom events. Let’s leave the latter alone, which is more complicated, and let’s see the first two.
Objective #1 – Clicks. Interested in knowing which links users click on? Is there a particular link you want to monitor while ignoring the rest of the links out there?
Once you have selected the “Clicks” target, a form will open on your page. Select one at a time the links you want to keep track of.
Goal #2 – Page Views. In the case of the Ecommerce School landing page, once you have entered the email and clicked on the call to action, you will be redirected to a thank you page.
Instead of tracking clicks, I can simply set the Thank You Page display as a goal by entering its URL. Attention: the code must have been previously entered on that page; otherwise, Optimizely cannot keep track of it.
- But what’s the use of tracking the page if I’ve already set the click on the button as a goal? For several reasons, one of which is: if a user, after entering the email, clicks “Enter” on his keyboard, he arrives at the destination page, but the click on the call to action is not counted!
By default, Optimizely offers you the preset “Engagement” goal, which I personally find very effective. In practice, the goal occurs every time any of the links on the page is clicked.
However, you may object; this way, the goal also occurs when a visitor clicks on the wording “Go to Blog.”
So what? Only some people want to give their email right away, and some want to see the blog first to get an idea and gain confidence, especially if the user has never heard of E-commerce School before.
Then from the blog, he will find the same free Ebook to download, but the important thing is that the Title has captured his attention.
In any case, you can create several objectives to get a more comprehensive view of users’ movements on the page.
By monitoring Engagement, the Thank You Page, the “Download the ebook” link, and the “Go to the Blog” link simultaneously, I will have full control over my page!
Analyze the test results
When to stop a test and declare one page the winner over the other? Of course, it depends on the traffic and conversions that the respective pages have received.
As an absolute minimum, you must achieve a result of at least 100 conversions per change and a statistical significance of 95% before you conclude your A/B test.
Don’t give credence to the numbers before you’ve reached this threshold, and let your beliefs affect your test results. For example, if you see that variation #1 has already reached 50 conversions while the original page has only 10, don’t be in a hurry to declare the first winner: the tests are done on random samples, and there is plenty of time for the second page to recover!
To view the test results, go to Options => View Results.
In the case of the E-commerce-school landing page, as you can see, the original version is winning over the Variation with a score of (53 conversions / 141 views) vs. (35 conversions / 105 views). But the statistical significance is only 25%, and there is still a long way to go before picking a winner!
Why, if the pages are spread 50/50, did the original appear 36 times more than the variation?
Simple: Optimizely will automatically display a page more often when it converts more. Agreed that an experiment is being carried out, but in the meantime, it is better to optimize the results to bring you more customers!
Conclusions
What we did was create a very simple but effective A/B test. You can proceed to more advanced levels, for example, by segmenting the traffic on which to test the page change and integrating the data within Google Analytics.
Furthermore, it is possible to test single pages and pop-ups, contact forms, page templates, and even applications.
But for now, it’s better to put only a little meat on the fire until you have large traffic numbers!
Try to create your first A/B test too, and if you have any clarification questions, write me a comment below, and I’ll be happy to answer you!
Also Read : Artificial Intelligence In The Company: How To Adapt It To Work Better