DEV Community

Cover image for SEO Cheat Sheet #2: Page Speed & Image Optimization
Thomas P. Fuller for Coherent Logic Limited

Posted on • Updated on • Originally published at thospfuller.com

SEO Cheat Sheet #2: Page Speed & Image Optimization

TL;DR: Nobody likes being kept waiting, and that includes search engines. In this article we cover upsides and downsides of the Google PageSpeed Module and the W3 Total Cache Pro plugin (for WordPress-based websites) along with a brief explanation of some basic performance tests that were conducted using the WebPagetest.org website.

In the article entitled "On Page SEO Checklist 2018 : A Comprehensive Guide on ‘How To Make Your Website SEO Friendly’" two of the nine numbered items pertain to making your website as fast as possible. Put in simple terms: neither people nor search engine bots like to wait around for your server to respond to a request. People won't wait and you'll end up with a high bounce rate and that means no visitors for you :-( ; search engines may assume your site has heavy traffic and adjust accordingly -- this may or may not make much difference if your site is small enough but even if Google, Bing, and any other search engine of interest can crawl your website, if it's slow enough it will frustrate visitors and they'll eventually spend their valuable time elsewhere.

There are a multitude of content management systems (CMS) available however the focus for this series of articles is on WordPress, which powers around ~ 27% of the Internet.

There are several factors which can slow down a website and we're going to assume here that the connection between the server and the Internet is fast enough and that the server itself doesn't have any issues. We are then left to focus on WordPress and either the NGINX or Apache web servers (others won't be covered). In WordPress the plugins, JavaScript, CSS, and images are going to impact the load time for a page; embedding videos can as well.

There isn't much that can be done with the plugins aside from simply making sure we only use what's required and that what is in use are high quality plugins-- if a plugin results in a slow website, so much so that this appears on the performance radar, then it likely needs to be removed or the performance issue needs to be resolved, possibly by modifying the code directly and that may not be possible if the plugin is proprietary or desired.

The following two tools used in tandem should improve WordPress performance considerably in most cases.

Google PageSpeed Module (Apache, NGINX)

Upsides

  • Can be used to optimize existing images on-the-fly and supports the webp image format. This is a significant selling point for websites which have many existing images.
  • Open-source software which can be found on GitHub.
  • Written by Google specifically for the purposes of speeding up websites.
  • Works with both Apache and NGINX.
  • Can be used to optimize CSS, JavaScript, etc.

Downsides

  • Requires direct access to the server or VM.
  • Not exactly easy or straightforward to set up.
  • Requires repeat testing (see WebPagetest.org, for example) to ensure settings are having the desired effect.

W3 Total Cache Pro plugin for WordPress

Upsides

Downsides

  • Requires a license.
  • Not exactly easy or straightforward to set up.
  • Requires repeat testing (see WebPagetest.org, for example) to ensure settings are having the desired effect.

Testing

In this section we briefly demonstrate using WebPagetest.org to test changes made to a WordPress website which is using both W3 Total Cache and Google PageSpeed.

The image below (SEO_CS_2_WPT_1.png) includes pointers to two concerns: the grade at the top right, in green, indicates some important performance considerations which, in this example, are enabled and working well. The blue arrow points to the page load time, which should be lower once performance improvements have been made.

Web Page Performance Test For

In the image below (SEO_CS_2_WPT_2) we can see that images are being returned in webp format and that the images are being served via the CDN.

Waterfall View

See also: Assess Your Website Performance in under Ten Minutes

Conclusion

There are a multitude of methods available for improving site performance so if you have other options and feel like sharing, please add them to the comments below and we can discuss them; include your performance metrics too.

Finally, Amazon Web Services has a number of options for deploying a WordPress website which I'd like to try eventually -- if you've been down this path already, add a comment explaining what you used and what the performance metrics look like.

See Also

1.) Google explains what “crawl budget” means for webmasters
2.) Website Performance and the Crawl Budget
3.) Learn How To Speed Up WordPress Site Like A Pro [COMPLETE GUIDE][2019 Edition]
4.) Crawl budget explained
5.) SEMRush Audit your site!
6.) WPMU DEV WP-Checkup
7.) Average Page Load Times for 2018 – How does yours compare?
8.) Image SEO -- Search Engine Optimization Tool for and through images

Top comments (1)

Collapse
 
seoforlondon profile image
Flycast Media

For speed performance a decent cache plugin is usually a good idea to help with minifying files, gzip compression, browser caching, deferring javascript and so on. Switching to a faster host or hosting plan can also make a difference along with using a lazy load plugin.