Top 5 Most Common WordPress Website Speed Issues Completely Undermining Your Rankings

Gaining the Edge

Gaining a competitive advantage for your business on Google has never been more important to your website’s success. What amazes the SEO Gold Coast experts is that website load time is commonly overlooked in favour of other onsite and offsite SEO implementations even though Google has included website speed into their ranking algorithm. These are top 5 lowest costs to highest value speed optimisations that can be executed in under 60 minutes. It usually takes several days for a developer to optimize your WordPress website for improving site speed. But with 10Web WordPress Optimization Service you can do it in just 20 minutes and get a 95+ Google PageSpeed score. The service automatically optimizes images, lazy loads your pages, and detects if you have any CSS or JS issues. Moreover, it gives you a caching plugin, instructions, and recommendations on how to further optimize the speed of your website, for free!”

1. Eliminate Render Blocking Resources

JavaScript and CSS files placed at the top of the page in the head section can significantly slow down your websites load time, often large files like jQuery or Bootstrap can take precious seconds to download causing the rendering of the site to be delayed until the file has been downloaded.

Solution – Defer: By adding defer to JavaScript files we tell the browser to run the script after the page has loaded. There are various plugins which can do this job however you can also add a simple filter to functions.php

Add this code to your functions.php:

add_filter( ‘clean_url’, function( $url )

{

if ( FALSE === strpos( $url, ‘.js’ ) )

{

return $url;

}

return “$url’ defer=’defer”;

}, 11, 1 );

Solution – Preload: As your style sheets are critical to the rendering of your web page you’ll need them loaded as soon as possible. Preload does precisely this, as soon as the browser reads the tag it downloads and caches the CSS, rendering your page faster. Be aware 84% of browsers support preload, 16% do not, you must still deliver a non-preloaded stylesheet for cross-browser compatibility.

Add this code to your functions.php:

function add_rel_preload($html, $handle, $href, $media) {

if (is_admin())

return $html;

$html = <<<EOT

<link rel=’preload’ as=’style’ onload=”this.onload=null;this.rel=’stylesheet'” id=’$handle’ href=’$href’ type=’text/css’ media=’all’ />

<link rel=”stylesheet” href=’$href’>

EOT;

return $html;

}

add_filter( ‘style_loader_tag’, ‘add_rel_preload’, 10, 4 );

2. Serve Images in Next Generation Formats

Images are often large files, compressing and optimising size can greatly decrease load time. Serving images in WebP reduce page load times significantly as they can be up to 34% smaller in filesize than their JPEG or PNG equivalents.

Solution – There are several WordPress plugins available if you have the budget. Imagify is a superb paid plugin, although WebP Express is the best free choice.

3. Lazy Load Images

By default, a web browser will load all the images on the page regardless of whether they are above or below the fold (below the fold – is everything below the bottom of the screen you need to scroll to see). By telling the web browser to only load the image once the image comes into the viewport (what’s visible in the screen area) you greatly reduce the initial load time.

Solution – Lazy Load by WP Rocket is my personal favourite, it’s highly compatible, light and delivers true Lazy Load that never seems to conflict with other plugins.

4. Caching

Every time a user visits a page they download all the content again and again even if they have visited before. By enabling Expires Headers (caching) you can instruct the browser to grab website files from the cache of the browser rather than requesting the files each time the page loads. This doesn’t speed up the first time load of the website for a user, but every load after that first instance.

Solution – Plugins are available however you can add your own caching by adding expires headers to your .htaccess file.

<IfModule mod_expires.c>

ExpiresActive On

ExpiresByType image/jpeg “access plus 1 year”

ExpiresByType image/gif “access plus 1 year”

ExpiresByType image/png “access plus 1 year”

ExpiresByType image/webp “access plus 1 year”

ExpiresByType image/svg+xml “access plus 1 week”

ExpiresByType image/x-icon “access plus 1 week”

ExpiresByType video/mp4 “access plus 1 week”

ExpiresByType video/mpeg “access plus 1 week”

ExpiresByType text/css “access plus 1 week”

ExpiresByType text/javascript “access plus 1 week”

ExpiresByType application/javascript “access plus 1 week”

ExpiresByType application/pdf “access plus 1 week”

ExpiresByType application/x-shockwave-flash “access plus 1 week”

</IfModule>

5. GZip

Computers don’t need to read beautifully formatted text with spaces like humans. By compressing the text reducing spaces and size we decrease the time it takes the browser to download the files.

Solution – Enable Gzip, GZip compresses data sent through the HTTP protocol, this greatly increases the speed in which text, HTML, CSS, XML and JavaScript are downloaded in the browser.

Add this code to your .htaccess file:

<ifmodule mod_deflate.c>

AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript

</ifmodule>

Summary

With the world going mobile, every second counts when you’re hunting that super fast sub-3-second load, these 5 onsite speed optimisations will get you there faster. See how your site stacks up before and after your optimisation with Google PageSpeed Insights. Always remember to backup your site before implementing changes, code may need to be customised to suit your application.