If we want our SEO and marketing efforts to shine, we need the right infrastructure, so the customers stick instead of bouncing. After all, 79% of customers can't stand sites with poor performance.
For most businesses, the main thing we have to do is increase website performance.
In this article, we'll demonstrate 17 ways to do just that.
Let's dive in!
#1 Way to Increase Website Performance: Go Mobile-First
Most people are searching from their mobile devices nowadays, so it's no surprise that Google's going to be using mobile-first indexing from now on.
The first thing we have to do to increase website performance for mobile is run it through Google's Mobile-Friendly Test and fix any mistakes that occur. This is, so both Google's bots and our customers are pleased with our website performance.
#2: Keep the Design Simple
There's nothing like a website chock full of features to increase our page load time. And since the average amount of time customers are ready to wait is 4 seconds, too many features can make that 10, 15 or even as much as 30 seconds.
The leading cause is a website with too many things going on.
Additionally, intricate web design can make it hard for users to find what they need, increasing our bounce rates.
The solution: keep it simple. Remove all the unnecessary widgets and features, and make sure that the site is easy to navigate. Make user experience (UX) a priority.
#3: Compress Images and Files
High-resolution images are beautiful to look at, but they're often larger than 5 MBs, meaning that pages take too long to load. This is why we need optimization for images.
Some platforms, like WordPress, have automatic image compression. If we're using different platforms, we can use a tool like Squoosh that reduces the size of each image file while retaining quality.
As for PDF and .doc files, we can use tools like WeCompress to keep our file sizes in check and make sure our websites aren't bloated.
#4: Minimize HTTP Requests
Whenever a browser accesses our website, it has to download the separate elements (files, images, etc.). Each one is downloaded separately through an HTTP request, and this takes too much time if we have multiple parts.
Now, we can't strip our sites bare, but we can reduce the number of HTTP requests a browser has to make.
The first thing to do is (if we use Google Chrome) check the number of requests. From Google Developer Tools, we right-click on the web page we want to inspect and select the "Network" tab. You might need to reload the page once you have the Network Tab open.
The next step is combining multiple files into one.
On platforms like WordPress, there are plugins like WP Rocket, which do that for us.
Additionally, we can combine the images we often use into one sprite sheet.
CSS Sprites allow browsers to retrieve the images we can use multiple times instead of calling up many different images at the same time. Everything's neatly compressed and stored in labeled boxes for later retrieval.
#5: Enable Browser Caching
If people are visiting our site more than once, we should have caching enabled. If we have caching enabled their browsers don't have to download all the information again.
Instead, if caching is enabled, the information they've downloaded during their first visit is stored and displayed much faster when they revisit our site.
This also minimizes the amount of HTTP requests browsers send, so we're killing two birds with one stone.
#6: Minify HTML and CSS Scripts
Too many different elements and characters like line breaks and spaces can impair page loading.
#7: Use Content Delivery Networks
Every web server we use to host our site is located somewhere. It could be in the US, in the UK, and so on. This means that our website resides where it's the closest to the people we're trying to reach.
However, some hosting providers let us choose, while others don't. This means that it might take longer for people in different countries. The browsers of people outside of the countries where our servers are hosted could take significantly longer.
This can be a speed killer. What we can do is use content delivery networks such as Cloudflare to host additional copies of our site all over the world to increase website performance.
#8: Improve Time to First Byte
Time to first byte (also called TTFB) defines how long the browser has to wait before it gets its first byte of data from our sites.
Now, in this case, we can't compress images, since this is primarily a thing based on the servers we have.
Again, we can check TTFB for page loading in Chrome Developer Tools (section: Network -> column: Waterfall). Just hover over the asset in the column to see TTFB.
The best TTFB is 200ms or under, but if it's longer for us, we can increase website performance by:
- Converting dynamic content files to static, so they don't have to be retrieved separately (caching helps with this one)
- Checking the DNS lookup speed (you can also find this by hovering over the asset in the waterfall column) and if it's too slow, switching to a different DNS provider
#9: Choosing a Better Hosting Option
Typically, there are three hosting options we have at our disposal with most hosting providers:
- Shared hosting
- Dedicated server
- VPS hosting
Shared hosting is the cheapest because we're sharing our server space (including RAM and CPU) with other clients.
VPS gives us separate portions of the server to use, which makes it a better option.
Of course, the best option is getting a dedicated server as it ultimately belongs to our site, so we're not "fighting for space."
In turn, this significantly improves our page loading speed and allows us to increase website performance.
#10: Don't Use Frameworks and Libraries Too Often
There's no need to reach for sophisticated tools like jQuery for simple web development.
If our websites aren't complex like those of enormous social networks, then we can keep it simple and code the elements we need ourselves.
Otherwise, we're bloating our websites. Thus increasing our loading time by using the development elements (like the ones we get from frameworks and libraries) that are better suited for some other sites.
#11: Fix Your Broken Links
Broken links reduce website speed.
Our first step should be checking which links on our sites are broken. This can be done with tools such as Google Search Console in the "Coverage" section, or SEMRush. I prefer to use Screaming Frog, but either of these tools will work.
And when we know which links are problematic, we can remove and fix them. It's best to rerun the scan, just so we're sure there are no more broken links. I like to run a weekly check and update as necessary.
#12: Throw Out Everything You Don't Need (Wordpress)
However, if they're not being used, they don't have to be on our sites because they can – and will ruin the way our website loads.
The checklist to go through to increase website performance is:
- Deactivate and remove all the plugins we're not using
- Remove unnecessary elements
- Turn off pingbacks and trackbacks in WordPress
- Clean up our database with WP Optimize for WordPress
#13: Use Google PageSpeed
The Google PageSpeed module is a great one to use because it automatically optimizes the number of resources that are used and how they're used.
The best part? We don't have to do anything but add the module to our server.
#14: Compress Your Site
In addition to compressing our images and files, we can also reduce everything else with Gzip.
#15: The Difference between Above-the-Fold and Below-the-Fold Content
Some files and components are just more important than the others.
The styles that should be the first to load should be placed inside the "head" section of our site's HTML document.
Otherwise, if we prioritize the JS files, the complete website won't be displayed until they're loaded.
If they take a long time, this means our visitors are waiting a lot of time to see the most critical elements. This happens because the JS files weren't done downloading.
#16: Host Large Files on Third-Party Platforms
Uploading huge files like videos directly to our sites don't just ruin page loading time. It can also be against the rules of hosting usage.
The solution is uploading our videos to other platforms (YouTube, Vimeo) first, and then embedding them into pages.
This both saves space and reduces loading time.
#17: Be Lazy about Loading
Which is to say: use Lazy Load.
Don't let visitors wait for a long time until every image and file is loaded for the page to be displayed! Get the Lazy Load plugin (or enable the option, if available on the platforms you use.
This means that images won't be loaded until the visitor has reached the part where they're indispensable for their user experience.
This is especially useful with long-form content like blog posts and brochures that contain multiple images. Loading all of them at once before displaying the page in the first place takes a long time.
And with Lazy Load, nothing's loaded until the viewer needs to see it.