Test two URLs in Optimizely Web Experimentation or Optimizely Performance Edge using a redirect experiment

Redirect experiments let you compare two separate URLs as variations in an A/B test. For example, you might create a redirect experiment that compares two versions of a landing page. This is useful when comparing landing pages or multiple versions of a site page that have different URLs. Testing whole pages against each other is a proven way to perform deep experimentation. 

Here are some tips for using redirects:

• Use redirects if your variation code exceeds 200 lines.
• Check Forward all query parameters to the destination URL to keep the parameter attached in the variation.
• Leave Allow Additional Redirects unchecked to prevent subsequent redirects.
• Use an event to track clicks on the redirected variation.
• Ensure your URL targeting does not capture the redirect URLs.
• Ensure the Optimizely Experimentation snippet is on the original and redirected pages.

Setting up a redirect experiment involves setting up the experiment targeting, settings up the metrics, and creating the redirect variations.

Create an experiment and set up targeting

When you begin the process of setting up your redirect experiment, you have three options:

• Use an existing page.
• Create a new page.
• Create a new experiment that targets the original URL you are redirecting visitors from. For example, if the experiment redirects from https://atticandbutton.us/homepage to https://atticandbutton.us/new-homepage, then the original URL is https://atticandbutton.us/homepage.

Choose the best option for your redirect experiment, and continue to step 2.

Add the redirect to your variation 

Create a variation change to redirect visitors to the redirect URL.

1. Go to Manage Experiment > Variations and select the variation (not the original).
2. Click Create.
3. Select Redirect.

You have two options for setting up your redirect via the URL or with custom code. If you select URL, paste in either the complete URL or the relative path where you want visitors to be redirected to.

If you select Code, define a function that returns a URL string where you want to redirect visitors.

Set up a page to track events across all URLs 

If you want to track how an event performs on both the experiment URL and the redirect URL, create a page that includes both in the URL match conditions, known as the hybrid page. Ensure you do not include this page in the experiment's targeting. 

1. Include both the experiment URL and the redirect URL in the URL match conditions section.
2. Add a new event to the hybrid page.

Create a click event

Sometimes an element on the experiment URL has a different selector than the equivalent element on the redirect URL. If you need to target these multiple selectors in a single click event, repeat these steps for both URLs. 

1. Open the URL in your browser.
2. Right-click the button element and select Inspect. A console displays and highlights the element on the page.
3. Right-click the highlighted element and select Copy > Copy selector.
4. Paste this selector into the Selector field of the click event. You can add multiple selectors by separating them with commas.

   

5. Click Save.

Select metrics and audiences for your experiment 

When a visitor is bucketed into an Optimizely Web Experimentation variation with a redirect change, Optimizely prioritizes executing that change to ensure minimal delay before a visitor can reach and load the new destination page.

As a result, redirects can cause race conditions with the typical event tracking for pageview events on the origin page. Because doing so does not generally provide a strategically significant metric for redirect experiments, using origin page views as a metric for your redirect tests is not recommended.

1. Add the click events you created in step 3 above as metrics in the experiment.
2. (Optional) Add an audience.
3. (Optional) Adjust the traffic allocation and distribution between your variations. The original variation is the original URL; the next variation is the URL visitors are redirected to.

Redirect experiments are a known and reasonable cause of traffic imbalance. Due to the nature of redirects, clients may close the window or tab and leave a page before the redirect finishes executing. The Optimizely Web Experimentation code does not activate in this situation, preventing the transmission of the event data to Optimizely. Optimizely never receives the data, so Optimizely does not count the user. Learn more about sample ratio mismatch (SRM). 

Experiments that redirect to a different domain may experience tracking issues for those redirected visitors. Learn more about cross-domain tracking.

Test and publish your experiment 

After setting up a redirect experiment, test the experiment and publish it live to your visitors. You can verify that your set up is correct by going to the API Names tab in your redirect experiment. 

Best practices

• Indicate the canonical link – To improve SEO link and ranking signals, the redirected page should indicate that the original page is the preferred (canonical) destination. Add a <link> element with the rel="canonical" attribute into the <head> section of the redirected page. Check out this Google Support Doc for more information.
• Exclude the redirect URL – To avoid redirects on the redirect URL itself, make sure to exclude the redirect URL via the page targeting settings.
• Unblock the redirect – By default, when you set a redirect, Optimizely Experimentation blocks other redirects for 5 seconds to prevent an infinite loop of redirects. Learn more about unblocking the redirect.

Having the Snippet as high in the <head> tag as possible is vital.

Performance questions

Will visitors see a flicker of images/old page loading prior to being redirected?

No, Optimizely redirects hides the body of the original page using CSS to prevent flashing/flickering.

How does the redirect work?

Optimizely uses window.location.replace. This is called immediately after the bucketing decision. The origin page does not load, and no additional requests are made on the original page.

In Chrome, in-flight XHR requests are canceled by the browser when location.replace is called.

How can we ensure mobile visitors do not have a poor experience?

You can do a test cookie-gated experiment and evaluate performance by using Chrome dev tools (using throttling and device emulation)

Can the user click Back in their browser to return to the origin page?

No, window.location.replace() prevents bringing the user back to the original homepage.

SEO 

Optimizely Web Experimentation is a JavaScript tool, so it cannot inherently prevent Bots from indexing variations on your site for SEO purposes. However, Optimziely can provide some recommendations on how best to minimize this.

Search engines have their own methods and proprietary algorithms for indexing pages on the web. Google and other search engines handle the indexing of dynamic JavaScript content in various ways. Since Optimizely powers experimentation via dynamic JavaScript, any SEO implications of using Optimizely would fall under Google’s rules and methodology of indexing dynamic JavaScript content. To prevent SEO engines from indexing the variant version of the page, take the following measures:

• Canonical <link> tag – You should add a link tag to the head of your page, which tells Google that the canonical version of the page lives at a different URL.
• Robots.txt entry – Search engines that respect this convention skip over URLs that follow the disallow directive - Robots.

Analytics

If you have client-side analytics tools in place, ensure that the transmitted data to those systems is useful. On the post-redirect (variant) page, the document.referrer is the pre-redirect page URL, which is not very useful. Sometimes, you may want to report that the true referrer was the document.referrer of the pre-redirect page.

You can use the getRedirectInfo method to capture the original referrer to pass it to your third-party analytics systems:

var redirectInfo = window.optimizely.get('state')  .getRedirectInfo();

var realReferrer = redirectInfo.referrer;