Doing your own site speed audit is not that difficult. A simple website page speed audit can help you discover the most important SEO factors that require attention and enable you to improve your page loading times.
I encourage clients to audit their site speed on a regular basis. You don’t have to do the whole site. One or two pages is enough. Especially those pages with new content.
While we do offer a full website audit as one of our expert SEO services, all of the tools you will need to do your own site speed test are offered here for free.
If your site is large, or you find yourself lost in the process, or, you don’t have time to complete an audit, you can always hire us as your website management service to do it for you.
This Website Audit Checklist Includes
- What page Speed is, and Why it Matters
- Tools to Check Your Site Speed and Identify Problems
- How to Read the Results
- How to Fix the Most Important Issues Yourself
- Which things you can safely Ignore
Page Speed Test and Page Loading
What is Page Speed?
A website’s speed is basically how fast it appears in a user’s browser. Page loading and site speed refer to the same thing.
Technically, site speed is dependent upon load time. For a page to load size, code, images, HTML and other scripts must reach the user’s browser.
When people say “page load time” for a website, they usually mean one of two measurements: “document complete” time or “fully rendered” time.
Think of document completion time as the time it takes a page to load before you can start clicking or entering data. All the content might not be there yet, but you can interact with the page.
Pay attention to Site Speed and Page Loading. If a page begins to load slowly, investigate the reasons early and find a remedy.
Think of fully rendered time as the time it takes to download and display all images, advertisements, and analytic trackers. This is all the background stuff you see filling up the page when you scroll.
Why Site Speed Matters
Page Speed is a critical component in the digital user experience and hugely important in our content-driven world. There’s a reason why Google Analytics now includes statistics like Page Load Time, Lookup, and Page Size.
Page speed affects both Search Engine Results and, perhaps more importantly, user experience. Page speed is also directly related to the design of your website.
According to surveys done by Akamai and Gomez.com, nearly half of web users expect a site to load in 2 seconds or less, and they tend to abandon a site that isn’t loaded within 3 seconds. 79% of web shoppers who have trouble with web site performance say they won’t return to the site to buy again and around 44% of them would tell a friend if they had a poor experience shopping online.
You know this experientially. You probably become impatient if a page takes a long time to load. You may click off to a new tab to pass the time while the slow-loading page comes into view. Or, you may forget about it altogether.
A Word On Local Hosting
With the exploration of cloud computing, companies have launched localized data centres for global locations. If your site audience is from Australia, then you don’t need to host your sites in the United States. Several managed WordPress hosts in Australia offer their services from Sydney and Melbourne. This not only helps with user experience with fast load pages but also improves the latest core web vitals
How to Test Your Page Speed
There are a number of tools online to test your page speed. Here are two. My favourite is GTMetrix. Both are Free Site Speed Testing Tools.
Page Speed Insights by Google
Each suggestion is rated with a priority indicator to indicate its importance:
Page Speed Insights by Google will help you identify performance best practices that can be applied to your site, and Page Speed optimization tools can help you automate the process.
Page Speed Insights measures the performance of a page for mobile devices and desktop devices. It fetches the URL twice, once with a mobile user-agent, and once with a desktop user agent.
The PageSpeed Score ranges from 0 to 100 points. A higher score is better, and a score of 85 or above indicates that the page is performing well. Please note that Page Speed Insights is being continually improved, so the score will change as we add new rules or improve our analysis.
On May 28th, 2020, Google revealed that there would be an upcoming page experience update that would enhance the existing Core Web Vitals metrics.
PageSpeed Insights measures how the page can improve its performance on:
- Time to above-the-fold load: Elapsed time from the moment a user requests a new page to the moment the browser renders the above-the-fold content.
- Time to full page load: Elapsed time from when a user requests a new page to when the browser fully renders the page.
However, since the performance of a network connection varies considerably, Page Speed Insights only considers the network-independent aspects of page performance: the server configuration, the HTML structure of a page, and its use of external resources such as images, JavaScript, and CSS. Implementing the suggestions should improve the relative performance of the page.
However, the page’s absolute performance will still depend upon a user’s network connection.
GTMetrix
GT Metrix offers a range of excellent tools to help you identify site speed problems. The results page is clean and clear.
GTMetrix offers similar results to Google’s Page Speed but also provides detailed results on what is slowing down the site and suggested fixes.
These suggestions also consider the Yslow testing tool and provide excellent information that is useful for developers but also easy enough for beginners to understand.
GTmetrix uses Google Page Speed and Yahoo! YSlow to grade your site’s performance and provides actionable recommendations to fix these issues.
GTmetrix has a suite of features and options to make optimizing your website speed clear and easy. GTmetrix also passes your URL through an actual Android device to get real-world performance data on your page load.
With this tool, you can also analyze the page load of your site from different regions around the world.
When used with their monitored alerts feature, GTmetrix will save a video of the page load that triggered the alert for viewing (only available to GTmetrix PRO users.)
You can also view your page load in a film-strip view. This allows you to get a frame-by-frame look at your page loading in real-time.
Take a look at this page speed checklist from TechWyse to better understand what may be affecting your page loading time. If you are running an eCommerce business, then it’s important that you look at those aspects of auditing relevant to a store.
What do I do with the Page Speed Test Results?
Some of the results you can ignore. Some will need attention straight away, and for some, you will have to weigh up the gains vs the time taken to do the fixes.
Must Fix
Enable Keep-Alive
A Keep-Alive signal is often sent at predefined intervals and plays an important role on the Internet. After a signal is sent, if no reply is received, the link is assumed to be down, and future data will be routed via another path until the link is up again.
If you are using WordPress on an Apache server (which is most of us) here is the script you need to add to your .htaccess file, which usually lives in your public.html folder using FTP.
<IfModule mod_headers.c>
Header set Connection keep-alive
</IfModule>
If using an e-commerce cart, take care and test. E-commerce sites can run into major issues if expires headers are not set appropriately.
For example, if a returning visitor tries to add products to their shopping cart but the resources are cached (such as HTML, CSS, any product image files, etc.), the cart will show products that were added in the past and not the recently added products.
Activate GZip
Gzip is the most popular and effective compression method currently available and generally reduces the response size by about 70%. Approximately 90% of today’s Internet traffic travels through browsers that claim to support gzip.
Gzipping reduces the size of the HTTP response and helps to reduce response time. It’s an easy way to reduce page weight. You can enable Gzip for WordPress and most other platforms by adding the following code to your .htaccess file:
<IfModule mod_deflate.c>
<IfModule mod_filter.c>
AddOutputFilterByType DEFLATE text/plain text/html application/x-httpd-php-source
AddOutputFilterByType DEFLATE text/xml application/xml application/xhtml+xml application/xml-dtd
AddOutputFilterByType DEFLATE application/rdf+xml application/rss+xml application/atom+xml image/svg+xml
AddOutputFilterByType DEFLATE text/css text/javascript application/javascript application/x-javascript
AddOutputFilterByType DEFLATE font/truetype application/x-font-ttf font/opentype application/x-font-otf
</IfModule>
</IfModule>
Test your site once you save the .htaccess file. If anything breaks, go and Google a GZip solution specific for your platform.
Add a Caching Plugin
This is for WordPress users, but other platforms will have something similar. On this site, we have installed Quick (Zen) Cache. You can get a free version or a pro version for only $15.00
A Caching plugin, like Quick (Zen) Cache, enables you to store (cache) your site for fast retrieval by web browsers and servers.
I have written a full WordPress Tutorial on using Quick Cache, but here are the edited highlights.
The Quick (Zen) Cache plugin uses configuration options that you select from the options panel. Once a file has been cached, Quick Cache uses advanced techniques that allow it to recognize when it should and should not serve a cached version of the file.
In computer science, a cache (pronounced /kash/) is a collection of data duplicating original values stored elsewhere or computed earlier, where the original data is expensive to fetch (owing to longer access time) or to compute, compared to the cost of reading the cache.
In other words, a cache is a temporary storage area where frequently accessed data can be stored for rapid access. Once the data is stored in the cache, it can be used in the future by accessing the cached copy rather than re-fetching or recomputing the original data.
Quick (Zen) Cache is extremely reliable because it runs completely in PHP code and does not hand important decisions off to the mod_rewrite engine or browser cache, also making Quick Cache MUCH easier to set up and configure.
In addition, Quick (Zen) Cache actually sends a no-cache header (yes, a no-cache header); which allows it to remain in control at all times.
It might seem weird that a caching plugin would send a no-cache header :-). Well, no-cache headers are a key component in this plugin and will NOT affect performance negatively.
On the contrary, this is how the system can accurately serve cache files to public users vs. users who are logged in, commenters, etc.
Optimize your Images
Using the wrong image format can bulk up your pages. In general:
- use JPG for photographs
- use PNG for everything else.
Resize large images
An entry-level smartphone with a 3-megapixel camera will produce an image that is too large to display on a web page. Unfortunately, content editors will upload images directly from their camera. A little education and an automated resizing system is recommended.
Image dimensions should never exceed the maximum size of their container. If your template has a maximum space of 800 horizontal pixels, the image will not need a greater width. Those using high-density/Retina displays may appreciate a double 1,600-pixel width image, but that’s still smaller than typical camera output.
Make sure you specify height and width attributes in your HTML. This enables your page to serve images quick since it doesn’t have to figure out the size for itself.
Resizing images has a significant effect on page weight. Shrinking the image dimensions by 50% reduces the total area by 75% and should considerably reduce the file size.
Compress Images
Even if you’ve switched to the correct format and resized the dimensions, it’s possible to shrink images further using plugins and tools that analyse and optimize the graphic.
In WordPress, we use a nifty little plugin called “Ewww Image Optimiser”.
Fix if you have the opportunity
These are helpful but can be time-consuming fixes. That said, they can genuinely improve user experience and page speed. Think about doing these tasks – or, at least, when modifying your site, think carefully before adding these components.
Plugins and Widgets
Check third-party plugins and widgets. Do you really need all of them? Does anyone care that you can make snow fall down your screen?
Plugins and poorly written widgets can slow down page speed. Test and remove the ones you don’t really need.
A big culprits are slideshows and galleries. Users ignore most. On news sites, they are notorious for clogging the site. They take up valuable real estate for e-commerce sites and are very poor converters.
Jquery and Render Blocking Scripts
You will have seen this in your GT Metrix results. What does it all mean?
Much of the above comment about plugins and sliders come down to the Inefficient use of jquery and similar scripts that are hogging the show on your site.
Most sites live with the nuisance, but if you have the inclination, there are things you can do to (possibly) solve the problem.
You could install a plugin. We have used Speed Booster Pack on some sites with good success. It enables you to customise the settings for jquery and CSS, minify, lazy load images and a few other good things. And, if anything breaks, you can disable that Booster pack component.
Be careful and test afterwards. Some plugins are not made very well and will break down and cry if you tell them to go to the back of the queue, which is essentially what this plugin does.
Try and use Asynchronous Resources for Social Media
This usually refers to Social Media Icons. One set is enough, but the way.
When a browser parses a traditional script tag, it must wait for the script to download, parse, and execute before rendering any HTML that comes after it.
With an asynchronous script, however, the browser can continue parsing and rendering HTML that comes after the async script without waiting for that script to complete. When a script is loaded asynchronously, it is fetched as soon as possible. Still, its execution is deferred until the browser’s UI thread is not busy doing something else, such as rendering the web page.
Plenty of good async plugins allow you to make the change without any trouble.
Go and do Coffee with Friends Instead
If you are using a shared server, you will experience fluctuations in speed. There isn’t much you can do about that unless you upgrade, which is not an option for many small online businesses. Go and do coffee.
If your Page Speed Test tells you your Social Icons are not optimized, ignore it. The gain is tiny, and the work is not worth it. Go and do Coffee.
Combining images using CSS sprites? Do coffee.
Defer parsing of JavaScript? Yeah, good luck with that one. I am not even going to try. Do Coffee.
Make fewer HTTP requests? If you have done everything else listed above, this will happen for you. Beyond that, you can hire someone else to agonise over how to make your site skinny or go out and do coffee.
According to Kissmetrics, nearly half of web users expect a site to load in two seconds or less, and they tend to abandon sites that don’t load within three seconds. A total of 79 per cent of online shoppers who have trouble with site performance won’t return to the site to buy again, and about 44 per cent of them would tell a friend if they had a poor experience shopping online.
While site speed is one of more than 200 signals Google uses to determine search rankings, and fewer than 1 per cent of search queries are affected by the site speed signal, it’s conversions that you need to worry about. A fast site will give your visitors confidence in your product or service and convince them to hand over their cash.
See a subject we haven’t covered? Contact Us and let us know what you would like us to write about.
Hey, maybe you could write it for us!
Excellent stuff. Just what I was looking for, Thanks David.
My pleasure, Dan. Glad I could help. Now you can chuck away your little black book!
I’ve been testing image file formats and found that most of the time .gif out performs jpg and png. I can get a relatively nice looking graphic using 64 colours in my gif image.
G’day Paul. I always had trouble getting a gif to look any good.
If you have Photoshop you can usually get good results from gif by selecting 64 colours and the ‘Selective’ option.
I manage to get 93/100 on GTmetrix for a page with a lot of graphics, I think i can get it even higher with some of your suggestions, for instance I don’t think I have that ‘keep alive’ implemented as well as others
Strange it still tells me to optimize images in gtmetrix even thought I run them through wp-smushit
I look forward to adding these changes and seeing what I can achieve, ill keep you updated.
Excellent post David. Simple advice that anyone can follow. Cheers, Dana.
Fantastic article David! The one that helped me the most was trying to find alternative Javascripts instead of using ones which use the Jquery library. I found that there are a lot of smaller scripts available which don’t use Jquery at all. In the end I was able to remove Jquery entirely from my website when made a huge difference for my smaller website on shared hosting.
GTMetrix was also very useful, especially the analysis reports. Do you know of any other good tools like that? Thanks! Jenk