There are two main metrics that your page loading speed test will report on:
First, it will report on the time it takes to load your entire web page from your server all the way to the browser’s window or tab
Second, it will report on how quickly individual assets load, like images and multimedia files.
If you are trying to improve your page load times, you should focus on both of these metrics and try to do so quickly; however, if you only have a few minutes or hours in which to make improvements, then improving your overall page load time is the higher priority.
Table of Contents
Why is Page Speed Important?
When you optimize your site for speed, you’ll not only be able to serve content faster, but you’ll also score higher on Google’s PageSpeed Insights.
In fact, Google even uses page load time as a factor in its ranking algorithm.
With fast load times, users are more likely to stay on your site longer and click through from one page to another. And that all directly translates into search traffic.
If people don’t like waiting for pages to load, then they won’t stick around—and that could mean lost ad impressions and sales.
Slow page load times also negatively impact user experience which is so important when it comes to gaining customers’ trust over competitors.
What Factors Affect Page Load Time?
Before you run off and start optimizing your site, it’s important to understand how load time is calculated.
Simply put, load time is how long it takes for a web page to appear in a user’s browser after they click on a link or refresh their browser.
Google uses site speed as a ranking factor in their search algorithm—with slower sites being less likely to rank well in SERPs.
In addition, slow-loading pages are significantly more likely to frustrate users than faster ones, making them more likely to bounce without taking any action on your site. That’s why it’s so important that you optimize your site’s performance—to keep users happy while also improving SEO performance.
Google Pagespeed Insights
Google offers an easy-to-use tool for testing page speed.
Just input your URL, choose your preferred domain host from a dropdown menu, click analyze, and in seconds you’ll have access to an impressive amount of performance data.
The good news is that there are several things you can do today to improve these metrics—and thereby keep users happy.
For example, Google recommends compressing resources with gzip or choosing an optimal image format—if your website is chock full of high-resolution images, then it’s important you compress them into formats like jpg or png before including them on web pages.
Pagespeed Insights Step by Step
As easy as it is to measure your page speed, most of us don’t know-how. To find out if your site loads faster than you think, I suggest using Google PageSpeed Insights. This tool not only provides you with a quick view of how fast (or slow) your page loads; it also tells you what specifically you can do to improve.
To access PageSpeed Insights:
- Click on Insights located in your Google Webmaster Tools Dashboard.
- Click on crawl.
- Click on start test.
- Now simply refresh any page from your website and look for a pop-up asking you to start testing on different pages.
What is a Good Page Speed?
Page speed, or performance, is determined by how long it takes for a web page to load.
The Google PageSpeed Insights tool helps you quickly diagnose how slow your website loads using an easy-to-understand scoring system.
The scoring system uses results from various tests that analyze your site’s mobile speed, HTML optimization, and resource usage (among other things).
It returns a score of between 0–100. Higher scores are better because they indicate faster loading times. An ideal score is 85–90. Anything lower than 50 means that Google considers your page load time slow.
This is especially true on mobile devices; users expect pages to load within seconds on their phones—and any longer could result in losing potential customers.
Reduce Server Response Time
A web page’s server response time refers to how long it takes for a browser or other client to receive an initial response from a Web server.
That initial response can come in many forms, but if you’re measuring server response time, it means your website is sending some kind of HTTP header (most likely a status code) within one second of getting a request.
If your server takes longer than that—even by just milliseconds—you have problems. On average, users expect pages to load in two seconds or less; according to Google, every extra one-tenth of a second over that results in 7 percent fewer views per visitor. In other words: Speed matters. A lot.
Reduce DOM Size
When loading your page, browsers must convert HTML into a format that’s usable by a computer.
This process can be quite time-consuming and unfortunately is part of what slows down your website’s performance.
The more bloated your site’s HTML, i.e., extra tags or useless elements like those used for styling purposes only, the longer it will take for browsers to convert it into something usable.
Minification means removing any unnecessary characters from the source code.
This includes removing whitespace, newline characters, comments, and anything else that doesn’t affect how your program runs but slows down how fast a browser can download and run it.
For example, concatenating multiple script files into one file or merging non-overlapping functions into one function not only reduces file size by a factor of four or more but also makes pages load much faster because there’s no longer an extra HTTP request for each new script file.
Remove Render-Blocking Resources
If your site is running slowly, you may want to check your page speed.
A tool like Pingdom’s or Google’s PageSpeed Insights can give you a good idea of where your page speed issues are coming from. If they see render-blocking resources, those might be some of your biggest problems.
These are external elements (like images) that hold up the rendering of your page and these often have something to do with third-party content (like ads or social widgets).
Third-party scripts should be loaded asynchronously so they won’t block page rendering, so make sure you use one of many great plugins that help with that if you want fast-loading pages.
Add an Expires Header
An Expires header tells your browser when a cached file should expire. When a browser encounters an expired file, it checks with the origin server for an updated version.
If there’s no updated version available, it re-downloads it from its cache.
By default, most browsers will check every 24 hours (or more frequently if a lot of updates have occurred).
Make sure your expiration time is accurate so that you aren’t serving stale content—and keep in mind that these headers are only useful for static files like images and CSS.
Gzip is an open-source compression technology that helps you save space on your web pages. With gzip enabled, Google will decompress assets in real-time on its own servers before they reach users’ browsers.
That means faster loading times for users. As an added bonus, it also saves bandwidth—which can result in lower hosting costs if you’re paying by bandwidth.
For more on how to enable gzip compression on your website, check out Google’s documentation or my post about it. Using Cloudflare? Make sure you’re using their Rocket Loader feature!
Configure Browser Caching Settings
One of the most effective ways you can improve page load times is by configuring your browser’s cache settings.
By using caching plugins or changing a few settings in your web browser, you can reduce load times dramatically.
Take Firefox for example; you can configure it to use a local server cache for static resources (like CSS/JS files) when browsing locally.
For high-traffic websites, CDNs are an excellent way to serve content as quickly as possible—even though they don’t actually speed up loading time—they do make it more consistent across users since it’s being hosted on multiple servers at once.
Use Sprites or CSS Sprites
If you’re using a lot of different images on your site, you can use sprites or CSS sprites for faster load times.
Sprites are graphic files that contain multiple icons or images in one file, typically using PNGs. So instead of loading 10 different icons from your server, you would load 1 sprite containing all 10 of them and let CSS tell your browser where to display each icon.
Sprites save time because they have much less data than separate images while providing a similar appearance, so they’re great for page speed tests.
They aren’t as useful when browsing with a mobile device; iPhones and iPads can only handle one image at a time.
Prefetch Necessary Resources in Advance
One of the best ways to improve page load times is by prefetching necessary resources before users arrive at your site.
This can be done via a service like Google CDN, or even on your own server with something like Apache Traffic Server or Varnish Cache.
If you’re not comfortable managing a cache on your own server, you can use something like Fastly, which will cache your assets from a number of leading CDNs around the world.
In other words, with Fastly’s service: if a user in Rome visits your site, assets will be served up from one of their edge locations in Italy.
When another user who lives near London visits your site, it’ll serve up assets from an edge location in London.
Every second counts. That’s why page speed is one of Google’s ranking factors. Make sure your pages load fast by avoiding non-static resources, minifying your code, compressing images, reducing DNS lookups, avoiding redirects, and combining HTTP/HTTPS.
On top of it, don’t forget to keep your hosting provider up-to-date with their software updates.
You can run a free tool on your website or use Google PageSpeed Insights to find out more information about how you can optimize page load times for faster load times across all devices.