Skip to content
Start now

A/B testing without page flickering and loading delay

Tips & Tricks
2 min Reading time
Content
A/B testing without page flickering and loading delay 1. use asynchronous code by default 2. as far up as possible in the area of the HTML code 3. activate optimizer only on pages with campaigns 4. tests with major changes in the directly visible area

by Katrin Nebermann

A/B testing without page flickering and loading delay

These four best practice tips will help you deal with the key challenges of A/B testing:

1. use asynchronous code by default

In principle, we recommend that the etracker code – as provided for in the standard – is played out asynchronously. This ensures optimal website speed, which is beneficial for the user experience and Google ranking. In particular, it prevents the consequences of a ‘worst-case scenario’: the loading delay of the website when the etracker services are overloaded.

2. as far up as possible in the area of the HTML code

The etracker code should be integrated as high up as possible in the area of the website’s HTML code. This ensures the best possible data collection in web analysis and minimizes possible flickering effects in A/B testing. This is because the earlier the etracker code is executed, the faster it can be checked whether the conditions for a test or smart messaging campaign apply in order to play it out if necessary.

3. activate optimizer only on pages with campaigns

To create and play out A/B tests or smart messaging, an additional parameter must be added to the tracking code in the parameter block on the corresponding web pages: data-enable-eo=”true”. If this is set, a white layer is placed over the page before it is displayed. It is removed when the variant becomes visible through injection or redirection (at the latest after 300 milliseconds or 0.3 seconds – configurable using parameters). This prevents the original page from being displayed during the loading time. This is of course unnecessary if no test or smart messaging project is active or in preparation.

4. tests with major changes in the directly visible area

The check before loading a variant usually only takes a few milliseconds. However, this can lead to flickering effects if the page loads very quickly. This means that the page is briefly displayed in its original form and then hidden until the test change is applied. In such cases, it can be useful to use the synchronous code option. Advantage: The risk of flickering effects is minimized. Disadvantage: The loading time can be affected, as the page is only (re)loaded after a response from the etracker server.

Alternatively, sequential tests can be carried out and evaluated as an onsite campaign in etracker Analytics. For this purpose, suitable parameters for onsite campaigns are simply added to the URL when the test variants are played out:

http://www.meineseite.de/?etcc_cu=onsite&etcc_med_onsite=Testname&etcc_cmp_onsite=Testvariante

Optionally, the URL can be created using a link generator:

The success can then be evaluated under Marketing Reports → Onsite Campaigns by comparing the effect on engagement and conversions. If the variations are played out one after the other, attention should be paid to comparable time periods and the significance of the results. For the latter, https://www.surveymonkey.com/mp/ab-testing-significance-calculator/ can be used, for example. Conversion optimization using A/B testing is therefore also very possible in times when loading time is a ranking factor.

More on the topic