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

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

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.

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.

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

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.

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

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.

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

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

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

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

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.

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.

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.

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

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

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.

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

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

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.

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

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

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.

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.

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.

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.

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.

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

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

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

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

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.

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

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

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

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

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. 

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

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.

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.

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.

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.

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

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

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

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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.

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

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

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.

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.

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.

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.

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.

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!

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