Coding for A/B testing: Run more AB tests, find more winners
4.6 (58 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
805 students enrolled

Coding for A/B testing: Run more AB tests, find more winners

Learn HTML, CSS, JS & data tracking for AB testing and build your own AB tests without the help of a developer
Bestseller
4.6 (58 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
805 students enrolled
Created by Ruben de Boer
Last updated 8/2020
English
English [Auto]
Current price: $72.99 Original price: $104.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 6 hours on-demand video
  • 18 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Run more A/B tests and find more A/B test winners
  • Build your own A/B tests without the help of a developer
  • Set up reliable data tracking for A/B testing
  • Do a proper quality assurance to make sure your A/B tests work perfectly
  • Learn HTML, CSS and Javascript to run many more A/B tests
Requirements
  • A testing tool (like VWO and Optimizely) is not required, but it is useful. Free options are discussed in the course. (Learnings are applicable for all testing tools)
  • Eagerness to learn coding for A/B testing
  • Eagerness to run many more A/B tests
  • No coding knowledge required
  • No prior knowledge is needed
  • Useful (free) tools will be discussed in the course
Description

** Brand new course and already BESTSELLER in the category A/B testing**

As a Conversion Optimization specialist or as someone working on A/B testing, your success is often determined by the number of A/B tests you run and the number of test winners you find. So the more tests you run, the higher your chance of success. But very often, the IT department is a major bottleneck for us. When we want to set up a test, it ends up at the bottom of the IT backlog, costing you valuable time and decreasing your chance to be successful in AB testing. If you recognize this situation, then this is the right course for you.

By taking this course you will learn:

  • HTML

  • CSS for AB testing

  • JavaScript (jQuery) for AB testing

  • Data tracking for AB testing

  • Setting up 60 to 90% of your own A/B tests without the help of a developer

This helps you to set up and run many more A/B tests and greatly increase your success. The course is set up in a practical and engaging manner. Together, we will start with the absolute basics before building many different kinds of A/B tests on your own website, while we increase the complexity step by step. The course is designed for people with no coding skills, and for those that have some experience already. The learnings in this course are applicable to every testing tool on the market.

Coding for A/B testing course structure

  • Section 1: Introduction

  • Section 2: HTML

  • Section 3: CSS for AB testing

  • Section 4: Javascript (jQuery) for AB testing

  • Section 5: Data gathering for AB testing

  • Section 6: Quality assurance for AB testing

  • Section 7: Thank you

Of course, there are many web development courses out there. But there is one big difference: As a Conversion specialist, you don’t build websites, you chance them. This requires a completely different focus on coding while also making sure you obtain reliable and trustworthy data. Web development courses help you to build websites, this course helps you to build and run reliable and successful A/B tests.

The course is designed for anyone working on A/B testing. Conversion specialists, growth hackers, and even front-end developers can hugely benefit from this course.

Now let’s get started. Feel free to check out the free preview lectures, or start taking this course right now.


Who this course is for:
  • Conversion specialists who want to run more A/B tests
  • Anyone working on A/B testing
  • Online marketeers, growth hackers and designers who want to learn how to code A/B tests
Course content
Expand all 81 lectures 06:14:26
+ Introduction
6 lectures 18:25

This lecture is the kick-off of the course. It describes the course structure, benefits and explains how to follow the course.

Preview 03:49

In this short lecture, I will briefly explain what AB testing is.

Preview 01:48

In your AB test, there are two ways to create a variation in your testing tool. In this lecture, you will learn what these two methods are, and which one results in the most reliable AB tests.

Two ways to create a variation
03:39

This lecture is an introduction into HTML, CSS and Javascript. It explains what these languages are, and why these are important for A/B testing.

HTML, CSS & JS for A/B testing
05:32

When building your own AB tests, several tools come in handy. This lecture will cover the tools which we will use throughout the course. The good news: they are all for free.

Free tools for this course
02:13

It is impossible to remember all the codes by heart. When A/B testing, you will often search the web for the codes you need. This lecture will cover several great resources that you can use for building your A/B tests.

Code resources
01:24
+ HTML
17 lectures 56:42

This lecture is an introduction to HTML. What is it and why is it important for AB testing?

What is HTML
01:46

What are the basics of HTML? What does an HTML element consist of? What is an HTML tag? You will learn this and much more in this lecture.

HTML basics
05:09

On a website and in your A/B tests you will likely find a lot of header tags. These will be covered in this lecture.

Preview 04:38

When you check out the structure of a webpage, you will likely come across a lot of paragraph tags. When you add content to your AB tests, you are also likely to use this tag. This lecture will cover the paragraph tag.

Paragraph tags
02:16

On a webpage, you can create ordered lists and unordered lists. This will be covered in this lecture.

Lists
04:07

Using anchor tags you can create links to other pages and websites. You can open these links in the same browser tab or a new one. This lecture will show you how.

Link to a different page
04:49

Occasionally, linking to content on the same page could be useful for AB testing. How this works will be explained in this lesson.

Link to the same page
04:35

Understanding how images on your website are build-up can be important for A/B testing. You can use this knowledge to adjust images in your A/B tests by combining HTML and Javascript.

Images
03:23

What are self-closing tags and what can you do with it? You will this in this lecture.

Self-closing tags
03:07

Occasionally you might add or adjust tables in your AB tests. This lesson will cover its HTML code.

Tables
05:12

You can do a lot with symbols and there are many symbols you can choose from. These will be covered in this lecture.

Symbols
01:24

An iframe allows you to create a window to another website. You will learn how this works in this lecture.

iframes
02:17

In your AB tests, it is unlikely that you will add extra input fields. You might, however, remove some fields or adjust its value or placeholder. This lecture will show you how the code of an input field is build-up. In the Javascript section, you will learn how to adjust it in your AB tests.

Input fields and buttons
04:46

Understanding how HTML text styling works is useful when making changes in your variations. However, as you will learn in the next section, applying style changes through CSS is more useful for AB testing.

Text styling
03:44

When building your A/B tests, adding comments to your code is very useful. This lesson will show you how to create comments in HTML.

Comments
01:46

Division and span in combination with an id, is useful for applying style changes in your AB tests.

Division and span tags
03:15

You have finished the HTML section. Now that you understand the structure of a webpage, you are all set to start AB testing.

Wrap up HTML
00:28

In this short quiz we will cover a few important concepts from this section. The quiz is not mandatory and there is no minimum score required. The quiz simply repeats some of the information which helps you learn and check if you understood everything correctly.

HTML quiz
6 questions
+ CSS for AB testing
22 lectures 01:56:56

What is CSS? And why is it useful for A/B testing? This will briefly be covered in this introduction to this section.

What is CSS
01:28

This lecture will cover the basics of CSS of AB testing. How is the code build up and how to apply it?

CSS for AB testing basics
03:50

This lecture and the next two are very important for A/B testing. Getting the selector right is crucial for building your A/B tests.

CSS selector: classes and ids
07:02

There are many combinations you can make to get your selector right. This lecture will cover these combinations.

CSS selector: combinations
08:18

To get your CSS selector right, there are several, more advanced, techniques you can use. These will be covered in this lecture.

CSS selector: additional options
07:20

Applying CSS changes in your developer tools is very useful for AB testing. You will learn how to make CSS changes in your developer tools in this lecture.

CSS in developer tools
02:59

In your A/B tests, you might occasionally want to change the color of an element. There are a lot of colors you can choose from. This lecture will teach you how to apply these.

Color codes
06:57

In the previous section, we covered text styling through HTML. In this lecture, you will learn how to apply text styling through CSS in your A/B tests.

CSS text styling
10:18

Through CSS you can change the numbers and bullets in your lists. This lecture will show you how.

Preview 03:01

For AB testing, it is important to have a good understanding of the CSS boxmodel. This lecture is the introduction to the next lectures to come.

CSS boxmodel
04:01

How can you adjust the with and height of the content in a box? And how can you make this responsive? This will be covered in this lecture.

Width and height
03:51

What is padding? And how can you use it in your A/B tests? You will learn this, in this lecture.

Padding
05:14

Next up in the CSS boxmodel are the border. There are different kinds of borders as well as border sizes.

Borders
05:30

The last lesson about the CSS boxmodel, before we get to the boxmodel exercise. This lecture will cover the margins.

Margin
04:07

To wrap up the CSS boxmodel, you can do this fun little exercise.

Boxmodel exercise
04:26

The display property is something you will be using a lot when AB testing. This lecture will give you examples of its possibilities and on how to apply it in your AB tests.

Display
06:52

With the positioning of elements, you can apply fun changes in your A/B tests. In this lecture, you will learn how.

Positioning
06:13

With float, you can make elements float on your page, and have the other content wrap around it.

Float
05:13

When elements overlap, you can determine which element in on top of the other using the z-index.

Z-index
02:44

In this lecture, we will cover a hover effect and other pseudo classes and elements.

Pseudo classes and elements
06:53

Through media queries, you can make CSS adjustments based on the screen size. This is very useful for AB testing in case you add extra content which should be mobile responsive for instance. 

Media queries
10:15

You have completed the CSS section. In the next section, you will build a lot of A/B tests using Javascript.

Wrap up CSS
00:24

In this short quiz we will cover a few important concepts from this section. The quiz is not mandatory and there is no minimum score required. The quiz simply repeats some of the information which helps you learn and check if you understood everything correctly.

CSS quiz
6 questions
+ Javascript (jQuery) for AB testing
22 lectures 02:21:46

With Javascript, you can make a lot of changes in your A/B test. In this section, we will be building a lot of A/B tests together. In this first lecture, you will learn why Javascript is useful and important for A/B testing.

What is Javascript & jQuery
02:54

This lecture will cover the basics of jQuery for AB testing. This lecture will get you ready for all the lectures on jQuery to come.

jQuery for AB testing basics
04:58

You might run into the problem that your website does not have a jQuery library installed. This is not a problem for most AB testing tools, as they have their own jQuery library. For Google Optimize, however, this is a problem. If you want to use jQuery in your developer tools and Google Optimize, but your website does not have a jQuery library installed, then this lecture will provide a solution to that.

Missing jQuery library and Google Optimize setup
04:40

Selecting elements in jQuery is similar to selecting elements in CSS. This lecture will show you how.

Selecting elements with jQuery
06:17

In your AB tests, you will likely make a lot of text and HTML adjustments. This lecture will teach you how to do this.

Changing text and html
07:22

Rearranging elements is very useful for A/B testing. You will likely use the codes which are being shown in this lecture a lot when building your A/B tests.

Preview 10:27

Adding elements is also something you might do a lot in your AB tests. This lecture will combine HTML and jQuery for AB testing.

Add elements
06:57

Just like adding elements, removing them is also you might apply often in your tests. You will learn how to do this in jQuery in this lesson.

Remove elements
04:44

Occasionally you might want to apply CSS changes to your website using jQuery in your AB test. This lecture will show you how this is done.

CSS changes through jQuery
05:05

Adding classes and id through jQuery can help you to apply style changes for certain elements. This is a useful combination for AB testing and this lecture will show you how.

Add classes and ids
05:29

Changing id's, images, links, and placeholders is something that might be useful for your AB testing. This lecture will cover everything about changing HTML attributes with jQuery.

Change attributes
04:43

The click function helps you to apply certain changes when your user clicks on a certain element on your website. The code is a bit more advanced. This lesson will take you through the build of this code, step by step, so you can apply it to your AB tests.

Click function
06:21

With variables, you don't have to write a piece of code several times. It can also help your code to look cleaner and therefore easier to read and understand.

Variables
04:56

The each function can be very useful for AB tests on category pages. For AB testing, this is often a page where you can find some nice winners. This function is a bit more difficult to set up, but after this lesson, this should not be a problem for you anymore.

Each function
06:44

With the if statement you can create certain conditions in your A/B tests. You can also use it to check if the element in on the page.

If statement
11:37

Debugging is very useful for A/B testing. You have written a nice piece of code, but somehow it doesn't work. Maybe you forgot a . or made a misspelling. This lecture will help you to quickly discover where you made a mistake.

Debugging
05:06

In AB testing, you can often run into timing issues. There are several ways to overcome this. This lecture will explain what a timing issue is, and how you can resolve it.

Timing issues
08:53

This exercise will combine all three languages. You get to set up an AB test in which you can toggle content. After you gave it a try, a solution will be provided.

Exercise 1: Toggle content
10:30

Adding an extra menu item can be useful in AB testing. In this exercise, you will give it a try, including the necessary styling. Of course, a solution to the exercise will be shown in this lecture.

Exercise 2: Extra menu item
07:04

Pop-ups can be great for your conversion rates. In this exercise, you will create a pop-up that displays after 10 seconds, including a call to action button and x to close it. Of course, a solution to the exercise will be shown.

Exercise 3: Show pop-up after 10 seconds
09:06

Urgency is known to be great for your conversion rates. In this exercise, you get to build an A/B test in which you create a count down timer.

Exercise 4: Countdown timer
07:24

You have completed the Javascript for A/B testing section. You should now be able to build a lot of your own A/B tests. Next up is data gathering and the Quality Assurance.

Wrap up JS and jQuery
00:29

In this short quiz we will cover a few important concepts from this section. The quiz is not mandatory and there is no minimum score required. The quiz simply repeats some of the information which helps you learn and check if you understood everything correctly.

jQuery quiz
5 questions
+ Data gathering for AB testing
7 lectures 24:58

In order to draw the right conclusions from your AB test, reliable and trustworthy data is of great importance. This lesson is the introduction of the Data gathering for AB testing section.

Importance of trustworthy data for AB testing
02:42

Using Google Analytics, you can set up events in your AB testing tool to track which variation of the test your user is seeing. This method has several advantages over the other tracking options.

Control and variation
08:34

In the case your AB testing tool loads on your website before Google Analytics, you will run into timing issues. This lecture will explain how you can overcome this.

Timing issues with Google Analytics events
02:33

In some cases, you might want to add extra tracking to your AB tests. This lecture will show you how.

Extra events
04:17

Adding heatmaps to the different variations in your AB test can give you extra insights. In this lecture, you will learn how this is done.

Preview 04:09

Polls and recordings for the different variations can also be added to your A/B test.

Polls and recordings
02:21

You have come to the end of the data gathering for AB testing section. Now you can build your own AB tests and gather reliable and extra data for trustworthy insights.

Wrap up data gathering
00:22
+ Quality assurance for AB testing
6 lectures 14:30

Before you set the test live, you want to be absolutely sure that everything is working perfectly fine on all devices, browsers and screen sizes and that data is being tracked correctly. This lesson is the introduction to the Quality assurance for AB testing section.

Importance of QA
01:01

Before you run your first A/B test, you want to check the setup of your AB testing tool on your website to ensure that everything is working the best it can.

Preview 02:40

Before you run your first A/B test, you also want to run an A/A test first. This lecture will explain what an A/A test is and how you can set it up.

A/A test
03:15

It is time to do the quality assurance of your A/B test. In this lecture, we will set the A/B test live to your IP address.

QA on IP address
04:09

In case your testing tool cannot target on IP address or you don't want your colleagues to see your A/B test before it goes live, you can also set the test live to a unique cookie. This lecture will show you how this is done.

QA on cookie
03:09

You build your own A/B test, you added data tracking and you made sure everything is working perfectly fine. Congratulations, you can start the test!

Wrap up quality assurance
00:16
+ Thank you
1 lecture 01:09

Final words and a cheat sheet. Thank you for following this course!

Thank you
01:09