loading...

How to beat Lighthouse

BY Christo Mabbs

{Front-End Web Developer}

7 January 2019

Reading Time: 2 minutes

Google recently released their new Page Speed Insights tool, based on the open-source software Lighthouse. Google Page Speed Insights gives some great tips into how to optimise various aspects of your website. It is a tool we use on every website before going live and other websites we deal with on an ongoing basis.

Here are some quick ways to beat the most common issues we see popping up on the new Google’s Page Speed Insights for WordPress Websites.

Eliminate render-blocking resources

This is due to various CSS and Javascript files being loaded at the top of the page when they don’t need to be until later. When these files are loaded at the top of the page it often means any remaining content, such as text or images, must wait.

A caching plugin generally comes with tools that allow you to minify, combine and defer CSS and JS files. Our favourite here are either WP Rocket and W3 Total Cache. Just be sure to complete plenty of testing when you do this, as this can sometimes lead to errors!

Serve images in next-gen formats

Google’s preferred way of serving images is through formats such as webp, JPEG 2000 and JPEG XR. These image types provide better quality and compression for websites than traditional image types such as jpeg and PNG.

For developers, command line tools exist to convert traditional image formats. For others, plugins such as Ewww Image Optimiser and ShortPixel will convert images that have already been uploaded onto your website.

Properly size images

Be sure to use WordPress’s built-in editor to insert images wherever possible. WordPress has built-in functionality that serves images based on browser width. This avoids situations where huge desktop images show on mobile browsers, and vice versa. If this is not possible, ask your developer to utilise WordPress’ in-built image functionality that uses srcset.

Reduce server response times (TTFB)

The two most effective things you can do here are: get better hosting and utilise a caching plugin. Slow response times can either be caused by the server itself having a slow speed and/or your website having to complete a lot of processing before sending out a page.

Better hosting will mean computer processes happen faster and the information can be sent out quicker. A caching plugin will cache (store) pages and operations that occur many times (typically from plugins). This reduces the number of processes that need to take place before a webpage can be sent out.

Finally, chill

Website optimisation tools are great for highlighting issues, but I often see people hung up on getting the perfect score. Google Page Speed scores are harsh and should be used as a guide, not a Holy Grail.

Trying to score a perfect 100% on mobile and desktop is a time waster and will not result in more visitors, higher conversion or a lower bounce rate. Need more proof? Let’s see how Google’s own website fairs against its tools:

 

If you need to chat about optimising your website, or anything digital for that matter, get in touch with the DN team!

Like what you see?
Subscribe now to receive regular updates

MORE ARTICLES LIKE THIS