Webpagetest.org is probably the best and most comprehensive free tool for measuring your page load time. Unfortunately, it provides a lot of very complex data. Today I'll show you what you need to set, how to bring order into the data chaos and which parameters you need for a professional analysis. Because only if you know how your websites load, you can optimize them.

Your own website should be secure. And fast. Much depends on the loading time: the conversion rate, the feeling of security of the person in using the end device and the Google ranking of your offer. However, many do not even get as far as correctly determining the loading time of their own website.

For example, some don't even know which tools exactly they can use to analyze their website properly. Or they don't know which settings they need to make in order to achieve really good results. So that you don't make the same mistakes, I'll show you today how you can get a quick and meaningful overview of your website with (in our opinion) the best free measurement tool ever. So you know exactly how fast your website loads and if and where you need to optimize.

To understand exactly how the individual analysis steps work, I advise you to take a look at the data sets linked at the important points or to analyze your own website in parallel. After all, it's not that easy to bring order into the data chaos. But as a reward for the effort, you will receive some of the best data you have ever collected about your website. And especially if you work on commission or earn money with your WordPress projects, the effort is worth it.

Webpagetest is the best tool we know of

Admittedly: We praise webpagetest.org effusively in this article. Perhaps too effusively, but not without reason. Because webpagetest is the only tool we know of that allows you to reliably determine the absolute and perceived load time of your website. And it's completely free. No payment barrier, no subscription model, just valuable data and an API that allows you to automate the whole thing: that's how it should be.

For the sake of completeness, it should be said that you also get nice measurement results with Pingdom and GTmetrix. But not as nice results as with Webpagetest. Of course, this doesn't mean that you can not and should not validate your results with several tests in different tools. And it also doesn't mean that you shouldn't measure with Pingdom or GTmetrix. Only I can recommend you to have a look at Webpagetest at least once.

It's almost become a mantra with us: To measure the load time of your website, tools like Google PageSpeed Insights are not enough. They only determine the performance potential of your website. Of course, this data is still valuable - from a performance and SEO perspective - but it simply doesn't allow you to draw any conclusions about what actually happens when your website is called up.

But that's exactly what you want to know. And that's exactly what you need to know in order to determine whether an optimization measure is effective.

Unfortunately, Webpagetest delivers not only not very pretty data, but also very extensive test results. Therefore, I will show you today how to use Webpagetest and how to interpret the results.

Webpagetest was originally an AOL project and only intended for internal use. In 2008, however, the program then became open source software and is now mainly maintained and developed by Google. The entire documentation of Webpagetest can be found on GitHub and can also be downloaded and used locally.

While PageSpeed Insights shows you where the optimization potential of your website lies, Webpagetest can do much more. It shows you not only how you can improve your website, but also directly what effects your optimization measures have on the loading time of your website.

Unlike Pingdom and GTmetrix, there is no company behind Webpagetest that wants to sell a paid service (ok, except Google, but at least the service is not sold directly). Rather, you could say that Webpagetest is part of Google's plan to make the web faster overall. However you want to evaluate Google's efforts in this context.

4 steps to really meaningful load time data

Yes, Webpagetest is more complex than other tools. But don't let that scare you away! In this case, complexity is good. Because it means you get great data about your website. And also as your first time using the tool, you will get the relevant information pretty quickly.

And that's with the following four steps:

Step 1: Set test parameters

Step 2: Get an overview

Step 3: Detailed analysis

Step 4: Analysis of the perceived loading time

Step 1: Set test parameters

Webpagetest offers very fine settings for testing your website. Four of these settings are particularly important to get good measurement results:

• the server to be tested with
• the browser to be tested with
• the advanced test settings, which I will discuss in more detail in a moment

The server you choose for the test simulates a website call from there. If you select the default server in the USA, then the test result will be output for a page call from Texas. In most cases, however, this is not necessarily what you want. Therefore, this setting is very important. Because it can massively distort the overall result and must be set accordingly, depending on the use case.

The two most common use cases are:

1. Determination of the loading time for a user from your target group
2. Load time comparison after an optimization measure

If you want to know how the loading time of your website is perceived, then the server location must correspond as closely as possible to the typical location of the calls. For a German blog, this means that you should choose a server in Germany, for example in Frankfurt.

If you want to know what the results of an optimization measure are, it doesn't matter which server location you use. The only important thing is that you must use the same server location for the test before and after optimization. Otherwise you will not be able to compare the measurement data properly. Obviously, I recommend a German test server here as well. This simply delivers the most realistic results.

The browser used

Webpagetest offers many setting options to simulate specific transmission techniques and browsers. For example, you can define that the website should be loaded via a 3G connection and Firefox. However, for the beginning it is enough to choose the browser that your target group uses most often.

You can find information about this in Google Analytics or Piwik, for example. Raidboxes, for example, is mostly visited via Chrome.

Very important: The advanced settings determine how good your measurement data will ultimately be!

In addition to the two parameters that determine how the test is performed - the server location and the browser used - Webpagetest also offers the option of setting what the test should output at the end. In the advanced settings you can, for example, define that only certain values should be output, or that the measurement should stop automatically after a certain time. And here there are two settings that are especially important to get reasonably comprehensive and reliable data: the "Number of Tests to Run" and the "Repeat View".

In principle, you should always measure more than once when measuring the load time. Otherwise you run the risk of measuring outliers and possibly looking for a problem that doesn't exist. And believe me: We have already experienced this a few times. I recommend at least three consecutive tests.

You should also remember to always measure the cached version of your website as well. You can do this by using the Repeat View option.

Once you have entered your URL - e.g. https://raidboxes.de - and set the test parameters (i.e. the German server, the browser, the minimum of 3 repetitions and the repeat view), you can start the test. Depending on how many tests are currently running, the analysis may take a few minutes.

It is important to note that Webpagetest only tests the website that is accessible under the URL, not your entire web presence. That means you should test your homepage, all landing pages and, if relevant, your product overview individually.

In this guide, I work with the data from the analysis of our home page, raidboxes.io.

Step 2: Get an overview

The first thing you see is the performance summary and the "Opportunities & Experiments" item. Here you get a rough overview of what potential your website has in certain aspects, or whether the website already performs well in these aspects. Webpagetest also gives you similar results as Google PageSpeed Insights.

(1) The more green, the better

The second area once again lists the test parameters for checking. Green indicates a good degree of optimization, orange indicates usable optimization potential, and red indicates urgent need for action.

Here you get all relevant key data of the page load time for the cached and uncached variant of your website. The first view is uncached and the repeat view is cached. It is important to note: In the overview, Webpagetest only displays the values for one of the three tests. The text in brackets next to the labels First View and Repeat View shows you which test this is. Run 2 is the result for the second test run.

I will now explain the two important parameters:

• First byte: Time until the first data byte is transmitted between client and web server. This value should, if possible, be below 200 milliseconds and is an important indication of the performance of your hosting.
• Start Render: This value describes the time a website takes to load before content is displayed for the first time. Until this time, the website remains completely white for the user. Of course, this value should also be as low as possible. Together with the total duration of the visual page load, this value forms the evaluation benchmark for the perceived website speed. Start Render marks the beginning of the visible loading of your website.

The following applies to all these values: the smaller, the better. As a guideline, you can remember:

• Time to first byte should be less than 200 milliseconds
• Start render should not be greater than 2.5 seconds
• The entire visual page layout should not exceed five seconds

Of course, these values are only rules of thumb. It always depends on your website: A store page with 50 products - that is 50 or more images and descriptive texts - naturally loads slower than an imprint page that consists only of text.

Therefore, I can only advise: Test the websites of your direct competitors and your role models. This will give you comparative values within the industry.

Calculating mean values - Now it's time for the nitty-gritty

Unfortunately, the overview explained above always shows only the results of a single measurement run. And you remember: single, isolated values can lead you astray. That's why you took at least three consecutive measurements to test your website. And the average values of these three measurements are the best approximations you can get for your page load time.

And don't worry: creating the averages only takes the push of a button:

Before you continue, you should check both the First and Repeat boxes at the top.

Now you get an initially confusing amount of data from so-called plots. And these are exactly the results you want to have. In principle, this new overview is the same for all values. So once you understand how to read them, they are anything but confusing.

As you can see, all three measured values (1-3) are plotted here in a diagram. Above the plot is the value to which the diagram refers. The number in the Mean column now describes the average value of the loading time across all three measurements. This average value is the most valuable info you can get about your website.

By the way: By clicking on Box Repeat you can also get the values for the loading time with and without caching. And if you want to find the results for the other values: Just search for "First Byte" and "Start Render" via your browser search (CTRL+F for PCs and cmd+f for Macs).

Interim conclusion: A lot of work for particularly valuable data

Okay, that was a lot of input. And it was a lot of steps. Especially compared to simple test methods. But the effort is worth it, because you saw it in the numbers of the diagrams: Two tests with the same settings can sometimes be a whole second apart. So under certain circumstances, chance decides whether you invest time and money in the further optimization of your websites or not. And especially if you earn your money with WordPress, be it with your own store, a web design business or your own agency, you should have the best data basis for such a decision.

But in fact, we haven't reached the end yet. Because now you know the most important performance characteristics of your website, so you know how fast your website loads and whether there is still potential for optimization, but you do not yet know where exactly your website can still be improved. And that's exactly what the detailed analysis is for.

Step 3: Detailed analysis

The overview already tells you a lot about your website. You can see whether there is room for improvement in certain areas, how fast your website actually loads and whether it could load a bit faster. However, you cannot yet identify the causes of the problems. But you can find them in the detailed reports:

• the waterfall diagrams
• the potential analysis

The waterfall diagrams list every single HTTP request that a browser makes to the web server. At first glance, these diagrams seem very complex and confusing. But if you know how, you can pull a lot of details about your website from a waterfall chart with just one look. Here we show you how to read waterfall charts correctly and how you can use them to further optimize your website.

Basically, a fast website has a short waterfall diagram with few, short requests. This means that the length of the diagram and the length of the bars in the individual lines are particularly relevant.

In the performance review you will find detailed information about how well the performance of your website is already optimized. This detailed review contains:

• the Optimization Checklist, to be found under the menu item "Optimization"
• the detailed breakdown of the performance test

In the Optimization Checklist you will find the individual evaluation criteria that are applied to each of the HTTP requests. A green checkmark means that the requirement is met, a yellow triangle indicates a need for improvement, and a red cross means that the proposed optimization measure is missing.

Finally, you will find a description of the warnings and missing optimization measures in the details section. Webpagetest describes the still possible optimizations for each resource. For images, for example, it shows how much data volume can be saved.

You will have to spend some time with these detailed evaluations, but with their help you can get a detailed picture of your website and its optimization potential.

And because it's basically the same info that PageSpeed Insights spits out, you can of course just run a PageSpeed analysis in parallel. Because this test is a lot prettier and better prepared.

Step 4: Analysis of the perceived loading time

Unlike all other tests we know of, Webpagetest is the only one that displays the perceived load time of your website for free. Using the Filmstrip View, you can watch a video of the page loading. This way you can see exactly what can be seen when loading and can even better evaluate if and how your website should be optimized.

Perceived load time is probably the most important metric of your page load time. It influences whether people leave your website too soon, the conversion probability and the overall experience of your website. Especially for stores, the perceived speed of the website is therefore an important benchmark. Of course, the perceived loading time should always be as low as possible.

In addition to the Film Strip View, remember the following:

The Filmstrip View shows you exactly to a tenth of a second what your website looks like and what processes are being carried out at any given time. It is often the case that nothing happens for up to several seconds, and in one fell swoop the website looks almost exactly like it does in its final state. This gives the impression that the website has finished loading within this time. Or rather, you already have the feeling that you can interact with the website.

So especially when prioritizing the visible page content, the Filmstrip View is a very valuable tool.

Conclusion

Ok, after reading this article you should now be able to choose the right settings for a webpage test. Now you should also know which metrics to interpret and how to prevent misinterpretations due to outliers. You also know where to find detailed information about your website and how to determine and display the perceived load time of your website.

So you know the important basics to get a really comprehensive overview of your website. And you know where to get the information that allows you to fill the measurement results with life and draw meaningful conclusions for your website.

But why was this important again? Quite simple: Without a reasonable measurement of the actual state of your website, you can not properly evaluate how your website currently loads. And on the other hand, you lack information for the optimization of the loading time.

You have another tip for using Webpagetest? Perfect, then leave us a comment below!