Accelerate your business and increase your sales by following these simple tips on how to improve your websites page speed to increase traffic to your site and boost conversions.
Today, page speed is a key factor in digital marketing. It has a huge influence on:
- How long the users are staying on your website.
- How many of them transform to a paying customer.
- Where you are ranked in the organic search.
Unfortunately, most websites do not perform well when it comes to page speed, and this has a direct negative effect on their sales.
There’s almost an endless amount of activities that can take up our days as digital marketers, but 9 times out of 10, there’s never enough time to do them all. As a result, certain items are moved to the back burner and become less of a priority.
A hot topic that seems to get put back most frequently is optimising page speed. This is easy to understand since most people don’t really appreciate the significance of this frequently ignored information, so they don’t see the value of spending time and money to enhance it by just a few seconds or less.
What may seem like an insignificant amount of time for some marketers, including those who concentrate exclusively on search engine optimisation, has been shown to be colossal by data from industry giants all the way down to our own analytical data.
I’m going to say you’re like me, that you want to optimise your results, and of course, your profits, right? Who doesn’t? So let’s start making your site even faster than a pinball in a well lubricated machine! (That’s kind of visual, isn’t it?)
1. Ditch the Budget Web Hosting
We’re just trying to save money these days, after all, these subscriptions to Raven, SEMrush, Moz, and all the other apps we use on a regular basis add up fast. It’s almost like having an extra child.
One way a lot of people are trying to save money is by purchasing really cheap shared hosting where the provider simply crams as many websites as it can on a server, much like a bunch of clowns stacked up in a single-car resulting in poor performance.
Yes, your website will be accessible most of the time with most web hosts, but it will be loaded so slowly that your visitors will be disappointed without ever converting to buyers.
“But it is barely recognisable! “These bargain shoppers say.
Here’s the thing — it could hardly be obvious to you because it’s your baby, and you love it.
But everybody else just wants to get in and get out of your website as soon as possible.
People just want to be on your site long enough to do what they came to do, whether that means getting a response, purchasing a product, or some other particular aim. If you slow them down even just a little, they’re likely to dislike their experience and leave without converting.
Think about it like this:
Many people love their own children, unconditionally. Or someone else’s kid crying, throwing stuff around, ruining their night out at a restaurant? They hate the child. It’s the same thing with your own site.
How Much of a Difference Does Speeding Up A Page Really Make?
According to a report conducted by Amazon, a gap of just 100ms — a unit of time that humans can’t even perceive — was enough to decrease their profits by 1%. Walmart also found similar findings.
If that tiny unit of time has such a strong effect on revenue, what kind of effect do you think an extra second or more would have?
But it doesn’t end there because of how quickly (or slowly) the website loads can have an effect on organic search ranking and pay-per-click costs.
In other words, if your website is loading slowly, you can expect your rivals who have invested in this vital field to eat your lunch.
Bottom line: miss the web hosting budget plans. If they market it as a product (based mainly on price), then they treat their customers as a commodity also.
There’s an awful lot of web hosts that are optimised for speed, especially WordPress websites, and some of them are priced in the same way as budget options.
So ask around, do some research, and invest in a web host that will give you the power to please both your visitors and Google.
2. Reduce HTTP Calls
-Each file required for a webpage to render and work, such as HTML, CSS, JavaScript, images, and fonts, requires a separate HTTP request. The more requests you make, the slower the page loads.
If you’re anything like most of the people I’m talking to, you’re probably thinking, “Yeah, I don’t need to worry about that, Adam. I know what I’m doing, and I don’t add a lot of bloated garbage to my website! That may be partly accurate.
You might not add a bunch of bloated garbage to your website, but for 90 + percent of the websites I’ve come across — it’s still there anyway.
It’s not that the Bloat Fairy snuck it in when you were asleep. It’s because most web designers, regardless of their ability or experience, don’t make page speed a priority. The unfortunate reality is that most people don’t even know how to do it.
Here’s where the problem begins:
Most themes are loaded with one or more CSS files and multiple JavaScript files. Some, such as Jquery or FontAwesome, are usually remotely loaded from another server, which significantly increases the time it takes your pages to load.
This becomes even more troublesome when you consider adding additional CSS and JavaScript files to plugins. It’s easy to end up with half a dozen or more HTTP requests from CSS and JavaScript files alone.
If you factor in all the images on a page that require a separate HTTP request, it will quickly get out of hand.
Merge the JavaScript files into a single file.
Merge the CSS files into a single file.
Reduce or delete plugins that load their own JavaScript and/or CSS files. In certain cases, as with Gravity Forms, you have the option to disable it from being loaded.
Use sprites for often used images.
Use fonts such as FontAwesome or Ionic Icons instead of image files where feasible, because only one file needs to be loaded.
3. Include the Trailing Slash
Omitting a trailing slash on links to your website, whether it be from external sources (link building efforts) or from your own website, has a negative impact on speed.
Here’s why:
If you visit a URL without a trailing slash, the web server will search for a file with that name. If a file with that name is not found, it will be treated as a directory and search for the default file in that directory.
In other words, by removing the trailing slash, you are forcing the server to execute an unnecessary 301 redirect. Although it may seem nearly instant to you, it takes a little longer, and as we’ve already established, every little bit adds up.
https://example.com (this is bad)
or
https://example.com/services (this is also bad)
Vs.
https://example.com/ (this is good)
or
https://example.com/services/ (this is also good)
4. Enable Compression
Enabling GZIP compression will greatly reduce the amount of time it takes to download your HTML, CSS, JavaScript files since they are downloaded as much smaller compressed files, which are then compacted by the browser.
Do not worry — your visitors won’t have to do anything special because all modern browsers already support GZIP and automatically process it for all HTTP requests.
5. Enable Browser Caching
With browser caching allowed, the contents of the website are saved in your visitor’s browser so the next time they hop on to your site, or when they visit another page, their browser will load it without having to send multiple HTTP requests to the server for any of the cached features.
When the first page has been loaded and its elements saved in the user cache, only new elements need to be downloaded from the following pages. This will greatly reduce the number of files that need to be downloaded during a typical browsing session.
6. Minify Resources
Minifying your CSS and JavaScript files eliminate unwanted whitespace and comment to minimise file size and, as a result, reduces the time to download them.
Luckily, this doesn’t have to be a manual method since there are many resources available online to transform a file into a simpler, smaller version of the file itself.
There is also a range of plugins available for WordPress that will replace links in your website header for your standard CSS and JavaScript files with a minimised version of them without changing your original files, including common caching plugins such as:
- W3 Total Cache
- WP Super Cache
- WP Rocket
It could take a little time to get the settings correct since minimisation can also break CSS and JavaScript, so once you’ve minimised all, be sure to test your website thoroughly.
7. Prioritise above-the-fold content
Your website will appear to load faster to the visitor if it is coded to prioritise the content above — in other words, the content that is visible before the visitor scrolls.
This means making sure that any elements that appear above the fold areas are similar to the beginning of the HTML coding on the site so that the browser can download and make them first.
It is also important to include any CSS and JavaScript needed to render that area inline rather than in an external CSS file.
8. Optimise Media Files
Since mobile devices with high-quality cameras are popular and modern content management systems such as WordPress make it easy to upload pictures, many people simply shoot and upload photos without understanding that the picture is always at least four times larger than required.
This slows down your website significantly — especially for mobile users.
Optimising the media files on your website has the ability to significantly increase your page speed, and doing so is reasonably straightforward, so it’s a good investment of your time.
Optimising Images
How To Choose The Best Format
JPG is suitable for photographic images, whereas GIF or PNG are better suited for images of large areas of solid colour. 8-bit PNG files are for images without a transparent background and 24-bit files for images with a transparent background.
Ensure that the files are correctly sized. If the image is shown at 800 pixels wide on your website, there is no advantage in using a 1600 pixels wide image.
Ensure the picture file is compressed. Apart from being the best image editing software, Adobe Photoshop has incredible image compression capabilities. You could also use free WordPress plugins – such as WWW Image Optimiser, Imsanity, and TinyJPG – to automatically compress uploaded photos.
Optimising Video
Choose the correct format for your videos
MP4 is better because it provides the smallest file size.
Serve the correct display (dimensions) depending on the scale of the viewer’s screen.
Eliminate audio tracks if the video is used as a design feature in the background.
Compress the video clip. Most of the time, I use Adobe Premiere, but Camtasia is also a strong option.
Reduce the length of the videos you use.
Consider uploading videos to platforms like YouTube or Vimeo instead of serving them locally by using their iframe embedding tool.
Don’t stop there, though, because it just scratches the surface.
In order to properly maximise the media on your website, you need to display photos of sufficient size depending on the size of the screen instead of simply resizing them.
There are two ways to deal with this, depending on image implementation.
You can serve images within the HTML of your website using the src set that allows the viewer to pick, download and view the appropriate image depending on the screen size of the device the user uses.
Images stored via CSS – usually as background images, can be served using media queries to pick the appropriate image based on the screen size of the device a visitor uses.
Utilise Caching & CDNs
Caching enables the webserver to store a static copy of the webpages so that they can be downloaded more easily to a visitor’s browser, while the CDN allows such copies to be distributed to different servers all over the world so that a visitor’s browser can retrieve them from the server nearest to their region. This significantly increases page pace.
What is Page Speed Optimisation?
Businesses frequently place page speed enhancements on the back burner, assuming that their site speed reflects the maximum performance of their website.
Unfortunately, that’s not the case.
There is a significant difference between the pace of the web and the pace of the website, and it can be a determining factor in your bounce rate and your organic rating.
What’s the difference?
Site speed is the average load time sample of a few pages on your web, and thus not a very in-depth way to assess the true output of your website.
Page speed refers to the loading time of a particular page on your website, or how long it takes to display your content and photos. Testing for each page, or your most important pages, in particular, can expose critical weaknesses and flaws in the performance of your site.
Page speed is a highly significant ranking factor in Google’s algorithms. It doesn’t just play a role in ranking, but it also plays an important role in user experience (Google may argue that “experience” and “rank” should be closely related). Pages that take a longer time to load will increase your bounce rate and lower the average session length, resulting in less interactions and less conversions.
That’s why it’s so important to recognise what causes pages on your site to load slowly, and to use effective tools and techniques to improve your page speed. The introduction of these enhancements will boost your rankings and, through improved user experience, and oh-so-important conversion rate.
Before we get to know how to do it and what resources are most useful, let’s go over the advantages.
BENEFIT #1
There are several advantages to individually optimising the speed of the page, but one of the most noticeable benefits is improved user experience.
If you’ve clicked on a website previously and it seems to take forever to load, your patience will be thin, and you’ll quit and search for a site that actually loads the answers you need. If someone instantly clicks the “back” button to leave the site, that’s a bounce, and you definitely don’t want your customers to do that. If the bounce rate is higher, that also means that people don’t spend as much time on your platform, and the less time they stay, the less likely they’re going to convert.
“The quicker your site loads, the lower your bounce rate. If your site is quick, you have a better chance of Google ranking over slow sites that cause high bounce rates.
All of this means that a well-optimised website will lower your bounce rate as less users leave your site impatiently. We all have our breaking points while waiting for a site to load, and according to Google, most people’s patience breaks at about 2 seconds, and encourages sites to load in “under half a second.”
The difference between leaving or staying can even be 250 milliseconds:
Kissmetrics reported that 47 percent of people were expecting a loading time of 2 seconds or less, and 40 percent of people would leave if the website would take more than 3 seconds to load. In short, a web page that loads in 2 seconds will theoretically carry that 40% of people who leave after 3 seconds. This is a race against time.
When fewer people leave, they spend more time on the website, and when people spend more time on your website, they connect more, interact more, and visit more pages. These are all (likely) ranking signals for Google, which takes us to the next advantage of page speed optimisation: increased ranking positions.
BENEFIT #2
Increased page speed ultimately means an increase in the amount of pages that Google can search and index. The more pages that are indexed, the greater the probability that you will have the rank of each page.
How does it work? Google has set the bandwidth for how fast they’re going to crawl on your site in accordance with the speed of your website. Longer load times decrease this bandwidth, and that reduces the amount of pages Google is going to crawl.
WHAT NEXT?
Both of these advantages are interlinked. If Google can crawl and index way more of your pages, you have a better chance of ranking and a lower chance of a penalty, and thus a better chance of attracting visitors. If these visitors are attracted, optimised pages help to keep them there.
Knowing this, you’re going to want to start the process of optimising page speeds on your web. But there’s only one problem: in the process of page speed optimisation, you can make basic errors that actually negatively impact your page speed instead of improving it.
Knowing about these common mistakes will help you prevent them and help you optimise your pages to perfection.
Common Mistakes
What are the common mistakes? There are more than a couple of them.
Picture optimisations: optimising the images is not a one-size-fits-all approach that is the same for every platform. It can be an in-depth process requiring analysis and evaluation, taking into account various factors, not excluding consistency, pixels, encoded data and format capabilities. One specific big no-no is text-in-images – it’s not a nice user experience because you can’t select the text, zoom in on it, check it, etc.
Redirects: Redirects almost never look great, and you usually use 301s when you have to. Unfortunately, while these redirects are far better than temporary redirects, they will cause several round-trip times when performed incorrectly, raising the loading time of your HTML document even before it will load your other material. When it comes to redirecting — Don’t go overboard – be careful!
Browser Cache Leveraging: You don’t want to stop using your browser cache. Google itself encourages this, since ‘the ability to store and reuse previously collected resources is a vital element of maximising efficiency.’ Not doing this would require further round trips between your server and the user, causing delays and costing your visitors data which no one likes. You can prevent this by introducing an HTTP cache or a strategy that includes saving copies of previously requested sources so that they do not have to be re-downloaded from your server.
Hotlinks: It’s not a mistake to have Hotlinks, but not to have them can be. Hotlinks are a type of security that prevents theft of your pictures. Hotlink security tools are available to avoid other sites connecting all images and files on your website. When other site owners steal your images, it takes away your bandwidth — which, as we know, Google uses to search as many pages on your website as possible. The security of the hotlink protects your bandwidth.
Web Fonts: Web fonts are an appealing way to improve the web design; they add to the elegance and can make it easier for users to read. The problem? People sometimes fail to customise their website fonts. Unoptimised website fonts are rendering and slowing down the pace of your pages. However, custom web fonts will actually improve your rendering when configured.
Common Errors: irrespective of page speed enhancements, common errors such as 404 errors should be closely monitored and corrected as soon as they are observed. 404 issues are deadweight to your server and look terrible to Google.
Forgetting to Act: Sadly, it is all too normal for companies to detect page speed flaws using quick testing methods, yet to overlook or fail to make the adjustments needed to correct those flaws. This is only counterproductive to your online success further down the road. Make Page Speed Optimisation a priority, not a “nice-to-have.”
Each of these features is special to each website. Using a one-size-fits-all approach can lead to all of these common errors and negatively impact your page speed and overall site efficiency.
The Magnificent Eight of Best Practices
It isn’t enough to know about common mistakes, in order to optimise your pages for maximum results, you really need to know what you need to do and the best way to do it.
The method can be divided into 8 goal areas:
Allow compression: File compression is a key step in achieving good page loading speeds. Using applications such as Gzip can help you compress your files, which are designed to minimise the size of your sites HTML, JavaScript and CSS files by more than 150 bytes. However, be careful. Don’t use software like Gzip on your files. You need to compact image applications like Photoshop because it helps you to monitor the quality of the image.
Decrease the size of your sites, CSS, HTML, and JavaScript: first, what exactly does it minimise? Minifying means cleaning out redundant data that is obsolete in your code — all while not changing how your browsers access your information. Minifying CSS, HTML, and JavaScript simply means removing unnecessary characters that are cluttering your files. You will significantly improve page speeds by doing this.
Reduce Redirects: The more redirects your site has, the slower your page will be loaded. That means, when the visitor is sitting there looking at a blank screen, the URL is redirecting, then redirecting … and hopefully not redirecting for the third time. Reduce redirects at all costs and make your pages load that much faster.
Delete Render-Blocking JavaScript: JavaScript can be difficult. First, you reduce it. Then you have to delete all JavaScript that could interrupt the rendering of your website. If you have a JavaScript render-blocker, your browser must pause and perform the script that’s where you begin to waste precious time.
Leverage Web Caching: Caching is basically about saving a bunch of data so that when anyone visits your site, the web is not overwhelmed by having to reload the entire page. Having a long-term and not a short-term date of expiry of the cache is advantageous in this regard. A fair expiry date for any site that does not change continuously is a year.
Server Response Time: Firstly, you’ll need to know that your server response time should be less than 200s in an ideal world. Take your page tools, traffic, hosting, and server applications into account after considering this. If you see a bottleneck in any of these, take note of it and repair it. Testing each source independently will help you to recognise the problem.
Use a Content Distribution Network: CDNs, as they’re better known are networks comprised of servers designed to distribute content evenly. This ensures that your site is stored in copies stored in different data centres for quicker and more consistent loading of content to your customers. You can boost your performance and user experience by using a CDN.
Image Optimisation: As mentioned under common errors, image optimisation is a major hangup for many, which at first seems quite easy. To simplify, don’t make your picture bigger than it has to be, and make sure it’s in the right format. If you’re searching for images, use JPEG – they can be compressed more easily on the internet. CSS is ideal for creating a template image, and it saves you time to load, so visitors don’t have to wait for multiple images to load.
It might seem daunting at first, but approaching the process by looking at it step by step and splitting it into tasks will save time and stress.
“Spend some time browsing through the speed test reports of your website and searching for problems that have the greatest effect on your load times. Focus on those high-impact variables and take the appropriate measures to shape them.
With that in mind, beginning with high priorities, the process can be made simpler and more effective.
Now that you know what the most important aspects of page speed optimisation are and understand, you can get to work! These best practices not only result in a quicker website but also a better user experience for users and Google. Note that each site is special and needs to be configured accordingly. With these advantages in mind, it is worth making time for page speed improvements.
