WordPress Website Optimization, Every Aspect Perfected.
Optimize user experience and Search Engine Optimization with a fast website that simultaneously achieves high PageSpeed scores.
Start With Hosting
A good host is extremely important for many reasons – among the most important for speed and user experience is server level caching, and the inherent performance to provide a fast TTFB or Time To First Byte.
If you can’t manage a server yourself or have someone like us look after hosting for you, we recommend Kinsta for Managed Hosting.
In our own test, moving a site to Kinsta from Vultr added at least a 30% speed boost, helping our WordPress website optimization greatly.
The Web Server
We won’t rehash the usual debate between Nginx and Apache – combined taking up ~75% of all web traffic in the world. We’re here to let you know about OpenLiteSpeed, a better alternative.
OpenLiteSpeed has a better TTFB and can handle very high concurrent users when compared to Nginx or Apache. OpenLiteSpeed also uses fewer server resources, which results in reduced server costs.
OpenLiteSpeed comes with LS Cache, a built-in, natively connected caching and WordPress website optimization plugin that lets you achieve the vast majority of the tips from this site. And it’s all free.
The WordPress Theme
Typically the biggest offender of slowing down websites, non optimized themes includes extra requests, styles, and load items on pages they’re not needed, and sometimes not replacing the theme will make WordPress website optimization a losing battle.
There are many good options out there now – we recommend GeneratePress (free) with it’s premium plugin, for a fully featured but lightweight theme. A default WordPress install with GeneratePress theme is less than 30kb.
Other contenders we like are Astra and Hello.
The Page Builder
It’s easy to hate on page builders (the wrong builder could mean the end of your WordPress website optimization journey!), the reality for most professionals is that the end-client needs to be able to manage their own website, including editing and adding new content.
The only real way to achieve this is through page builders – which have improved a lot more than you may think.
We recommend BeaverBuilder as an extremely lightweight, user friendly and mobile friendly page builder.
Other solid choices include Oxygen and Elementor.
Another great offender for loading additional scripts where they’re not needed, or inefficiently being used they are meant to be – the bane of WordPress website optimization.
It’s easy to point to the total number of plugins on a website and surmise that’s why it has poor performance. However, lots of plugins are for background functionality and don’t have any impact on the front end for the user.
Our goal should be to minimise the number of plugins loading resources on the front-end, especially if that resource is not needed on certain pages.
To go back to how a web page loads or is ‘painted’ by the browser, you need to understand that for the page to show up, it has to first load the HTML, then the CSS. At this point the JS and other resources such as images can load.
Knowing how many scripts are loading, in what order, and what they do is a large part of WordPress website optimization.
Minification of CSS, JS, HTML
While this is a plus in the development phase, it becomes a negative when it comes to serving your pages. Web servers and browsers can parse file content without comments and well-structured code, both of which create additional network traffic without providing any functional benefit.
Every page speed tester will recommend minification to improve your WordPress website optimization, and for good reason – it helps, and there is no reason not to.
Combination of CSS and JS
CSS and JS files can be combined into a single file each. This greatly reduces the number of HTTP requests each page load requires, however, it can introduce style or functionality issues as the natural ordering is disrupted.
This step more than any other requires extensive testing, and usually results in several CSS or JS files to be excluded from the combined files, but the end goal will assist WordPress website optimization.
Inline CSS and JS
Inlining all CSS can improve performance for sites with a low pageviews/ visitor-rate, but may slow down performance otherwise.
Do you have the problem where your website loads, and then suddenly the text font changes, slightly moving the page as styling is applied?
This can be referred to as a Flash Of Unstyled Content or FOUC, and is caused by the page rendering before the CSS – in this case the font file – loads.
This can be fixed by utilising various CSS display parameters, such as display:swap, which lets us combine and link or preload the fonts in the head.
This is very noticable for normal users, hence a big impact on user experience. Even if fixing this doesn’t help the speed of the site, not having a jarring experience will make it feel faster, drastically helping your WordPress website optimization.
Lazyloading can be applied to images and iframes, instructing the browser not to load these until they enter the viewport.
This can sometimes cause issues. Sometimes, you’re better off without lazyloading, as the browser inherently loads resources based on their order. As always with WordPress website optimization, this will require testing to determine the helpfulness for your site.
CDN – Content Delivery Network
Content Delivery Networks deliver your web files from PoP’s (Points of Presence, their datacentres), rather than your own web server.
If your clients aren’t solely located in your geographic area, this is a perfect way to ensure that every visitor will be server from a local PoP, rather than their request travelling all the way to your web host.
CDN’s are also packed with features such as compression, uptime reliability, DDos/bot protection and improving TTFB, a great help with WordPress website optimization.
We recommend QUIC.cloud and KeyCDN.
This is where the styling solely for the first fold of content is separated and loaded first, to ensure the first screen is loaded as fast as possible.
If properly optimized this practice is typically not required, however it can help improve sites.
This may not have an impact on loading time, but it can greatly improve user experience – as they see the first content ASAP (minimal critical path), and hence the overall experience feels better (and faster) – the goal of our WordPress website optimization.
Not 301 redirects on your website, but rather when you have an external script redirecting to another script – causing a delay.
Every effort should be taken to ensure the correct file is being linked, however, typically this is the result of third partys, such as social media advertisers’ tracking codes.
HTTP/2 and HTTP/3
HTTP/2 and HTTP/3 are made to presend internal CSS and JS to the browser to optimize page loading.
The two protocols offer clients virtually identical feature sets
HTTP/3 is designed for QUIC, which is a transport protocol that handles streams by itself.
HTTP/2 is designed for TCP, and therefore handles streams in the HTTP layer.
Prefetch, Preconnect and Preload
Prefetch is a low priority resource hint that allows the browser to fetch resources in the background (idle time) that might be needed later, and store them in the browser’s cache.
Preconnect allows the browser to setup early connections before an HTTP request is actually sent to the server. This includes DNS lookups, TLS negotiations, TCP handshakes. This in turn eliminates roundtrip latency and saves time for users.
Preload allows the browser to set resource priority therefore allowing web developers to optimize the delivery of certain resources.
The Functions.php File
WordPress by default loads certain things we simply don’t need, and can actively harm our website’s performance. Updating the functions.php file to dequeue certain scripts and/or add filters can assist with you WordPress website optimization.
In addition, there are a few things we can add to improve SEO.
These can be added and removed via the functions.php file.
Need WordPress Website Optimization?
We offer WordPress Website Optimization services for all WordPress websites.
We also build websites, if that is what you need.