In one of our previous blogs, we provided a guide on how to create and run an A/B test on your website. Meanwhile, behind the scenes, we actually ran an A/B test for our expoze.io website. We think it would be exciting and compelling to share with you the design choices and the results of the A/B testing we ran.


As conversion rate optimization (CRO) professionals will know, overall website design through colors, text, button shapes, and layout can significantly change the behavior of visitors.


The aim is to help visitors undertake the actions we want most, like sign ups; who wouldn’t want more customers? So we implemented and tested new design options for over a month and compared them to the designs of the previous month to get a clear and reliable picture of the overall performance.

Call to Action Buttons

To start off, we tested CTA button changes. Namely, we changed the color from green to blue for the CTA buttons to stand out more. The overall theme of our web pages is green/white, with the majority of the text in green. So a contrasting color could be more noticeable and draw more visual attention. Blue would also still fit in with the page design and potentially lead to a higher click-through rate. Below are the designs and test results for one of the CTA buttons.

As we can see, the results show a massive improvement! The blue version saw a 47% increase in click-through rate over the previous green button. Exactly the result we were looking for.


We changed and tested multiple CTA buttons across our website; the blue button consistently scored a higher click-through rate. Results range from an increase of 25% up to a whopping 175%. It is decent progress, now more people are going to the pages we want them to visit.

Video thumbnails

As you may have noticed, we have an embedded YouTube video on our homepage. We wanted to add a thumbnail with the hope of more people clicking and watching the video since 90% of the best-performing videos have custom thumbnails.


Additionally, the video is not only posted on the website, but across multiple channels, so it could have an impact on more than only the website. The old design (version A) can be seen below, it looks clean but perhaps a bit too bland and doesn’t really communicate what the video entails.

So for version B, we wanted to create an image that could pique visitors' interests, communicate the topic and create a less static experience. We added:

• Flashy text to reveal what expoze.io is
• Contrasting background
• Angled the phone display with an Instagram feed showing a famous Cyberpunk 2077 ad, plus an expoze.io heatmap

After a month of testing, we compared the data and the results were crystal clear. Both the click-through rate and the views increased when using version B. The complete results:

• Impression click-through rate +181%
• Views +35%
• Unique viewers +27%
  
  

Web Page Background

When looking at the previous examples, you might have noticed a change in the homepage background, that is because we decided to test a new version for it too. To increase the visual attention of visitors to the website, we tried a different approach. This new version would need to stay true to our design language while adding more contrast, making it easier to read and navigate the page. We analyzed the visual attention between the designs with our expoze.io platform, results are shown below.

We witnessed a significant increase in visual attention on the homepage with version B, from 3,9% to 5,9%. That’s a whopping 51% increase in visual attention!


Interestingly, the added contrast also caused more traffic to the CTA buttons on the homepage. The ‘Get Started’ button on the top-right corner had an increase of 25% in click-through rate even though the button itself did not change.  

How we created the designs

So how did we create effective design solutions that showed improvements across the board? We used our AI-generated eye tracking in the design process to compare the designs before we tested them. For example, the video thumbnail had a different iteration (version C) as can be seen below.

It allowed us to choose the best version for a new design, which we could then test in a real-world scenario with the A/B test. We placed the two different thumbnails in the context of our webpage and produced a heatmap with areas of interest (AOI) for the thumbnail area. It revealed if the visual attention of visitors would differ. The result can be seen below.

The area of interest clearly shows us that version B with the blue text would attract more visual attention, so that’s the version we ran for the A/B test. Hypothetically, if the website had 1000 visitors a day it would mean that 65 more people see the video thumbnail, a big difference in numbers.


To round off, we hope this blog has informed and perhaps even inspired you about design decisions for a more effective web page design. Maybe you now have ideas you immediately want to test for your own website. Make sure to pre-test your designs with expoze.io to get the best results out of your A/B test.

‍