Page Speed is a measure of how fast a web page loads. Shorter page load times help your pages to rank better and improve the visitor experience. Pages with a longer load time often have higher bounce rates and lower average time on page, both of which will impact your Search Engine Optimisation (SEO).
Here’s how we improve Page Speed across all of the websites we build:
-
Image Optimisation
Large image files are the most common cause of slow page speeds.
When considering how adding images to your website impact page speed, there are two main things to remember:
- Large images take longer to load than small images.
- The more images a page or blog post has, the longer the page will take to load.
To tackle point one, we use a plugin called Tiny PNG to automatically compress images as they are uploaded to the CMS.
TinyPNG uses smart lossy compression techniques to reduce the file size of your media files without compromising the image quality. This means that fewer bytes are required to store the data and therefore the image is served faster on the frontend of the site.
A photo speaks a thousand words… but it won’t say anything if it doesn’t load quick enough. – We Are Flamingo
-
Leverage Caching
Page Caching
WordPress gathers elements that repeat across a site (e.g., menus, your header or footer) and serves for every visitor each time they visit the website. This happens regardless of whether anything has actually changed on the page since they last saw it. This creates a lot of working and requests to the server which can be avoided by serving up a cached version of the page.
Page caching saves a version of the page to serve up when nothing has changed since the last visit. Using a plugin called WP Rocket is the simplest way to achieve great page caching.
Leverage browser caching.
When someone visits a page on your site, their browser saves copies of any resources loaded into the page or post at that URL. Browser caching can help your site load faster for people visiting (or revisiting) any pages that load the same resources.
You can help browser caching work better by specifying how long a given resource should be kept in visitors’ browser cache. A good web host provider will likely handle some of this for you, however WP Rocket offer a browser caching option that works well in a lot of cases.
Minifying CSS and JavaScript files removes extra space that computers don’t actually need in order to understand a file. In some cases, this can cut file size in half.
-
Load JavaScript Asynchronously
Loading asynchronously means to load while other resources are loading.
A web page consists of a head and a body. Everything in the body is rendered by the browser while the head is used to load external resources (e.g. scripts and style sheets) and to add meta data to the page. These scripts can be loaded alongside the rest of the body loading so as not to hold up the page from being served to a user.
-
Improve Server Response Time
Server response time is the amount of time required to load the HTML document of a website from a server so that a user can start rendering the page.
A good hosting provider or a server with better resources will be able to serve your website quicker.
-
Reduce Redirects
Every redirect adds a little time to the load time of a page. A redirect adds an extra step in the process before a page is shown.
Most importantly, redirect chains need to be avoided. This happens when a redirect goes to another redirect. For example, when a non-www page gets redirected to a www version of the page, and then later on gets redirected again to a www version.
