Introduction

Optimizely enables simple, rapid A/B testing by enabling site administrators to design and run repeated experiments without having to modify your code base. The following sections are intended to give a technical overview of how Optimizely works, and how you can use Optimizely to maximize your page performance.

Creating an Experiment

To begin creating an experiment with Optimizely, visit the Optimizely homepage, enter your website URL in the input field, and hit <ENTER> or click 'Test it out!'.

Once you hit <ENTER> , you'll be taken to the Optimizely Editor, with the site you specified loaded in the editing area.

Creating Variations

Experiments in Optimizely work by displaying a variation of that page to each visitor (assigned randomly) and then recording whether or not that visitor achieves a "goal" or set of goals. For example, an e-commerce site might try three different colors for a "Buy Now" button to understand which is more likely to be clicked by a visitor. The aggregate likelihood of your visitors completing a goal after viewing a particular variation is an estimate of how well that variation would perform if adopted permanently.

To modify any element on the page in question, hover over it, highlight it, and select an option from the drop-down menu.

The possible options are

• Edit Element - Modify the selected element in multiple ways
  • Edit HTML - Edit the raw HTML of an element
  • Change Image - Swap an image with another image on your hard drive or hosted anywhere on the internet
  • Make/Edit Hyperlink - Add a new URL to the selected element to create a Hyperlink, or edit an existing Hyperlink
  • Edit Style - Edit the CSS properties of an element
• Insert Item - Add new elements to the page
  • Insert HTML - Add new HTML to the page
  • Insert Image - Add a new image to the page
  • Insert Text - Add new text to the page
• Move and Resize - Change the size of an element/image or drag to move around on the page on the page
• Rearrange - Drag an element on the page and displace the existing elements
• Remove - Remove an element from the page
• Track Clicks - Create a new click goal
• Custom Javascript (advanced) - Generate a jQuery selector for this element and open up the Optimizely Code Editor
• Select Container - If Item A (say, an image) is currently selected on the page, move the selection box to the item that directly contains Item A

You can switch between the original page and each of your variations in the editor using the tabs in the header pane, and you can create a new variation by clicking the "Add variation" button.

Setting up Goals

For information about setting up goals check out the following articles:

Tracking Conversion Goals
Tracking Clicks on a Page
Tracking API Call

Starting an Experiment

To start an Optimizely Experiment, it's necessary to paste a small snippet of code into the top of the head of any page you'd like to test as well as any page you'd like to use as a goal. This snippet will never change, and as long as it's included on a page, you can run as many experiments as you like. Each Optimizely project has a unique snippet.

To obtain your snippet, just click the "Implementation" link on the upper right hand corner while signed into Optimizely. You'll see a modal dialog containing your snippet, which you can copy and paste onto the relevant pages.

 

Once you've implemented the snippet on the relevant pages, you can start an experiment by clicking the "Start Experiment" button in the upper right hand corner of the Optimizely editor, and pause by clicking the pause button.

Interpreting Results

Once the experiment is running you can check the results. Here are some helpful articles to help you understand what you see on the page:

Interpreting Test Results
Understanding Engagement
Definition of Chance to Beat Baseline

Resources

There are many other useful articles in our Knowledge Base. Head on over to the Support Center to learn more. If you have any questions, please contact the support team at support@optimizely.com.