6 Tips From Experts on Optimizing Websites for Google’s Lighthouse 3.0 Speed Tests

So much SEO advice focuses on aspects of optimization around content strategy, outreach, and competitor tracking. But even the best backlinks can’t replace a fast and easy-to-use website. Even though site speed has been considered a ranking factor for nearly a decade, the technical side of SEO tends to get ignored.

While WordPress does have some features that make SEO easier, it also has several aspects of it that need adjustment for each site. And depending on your setup, you could be sabotaging your own site load speeds. Indeed, the content management system you use is only the beginning of the crucial decisions you need to make to optimize your website for search rankings.

Thankfully, Google has created resources to help you with these decisions.

Since it’s their main goal to keep clicking through the search engine, it’s in Google’s best interest for the sites they list on page one to be fast and friendly for users, regardless of what device they’re using or where they’re browsing.

Because of this, Google’s built lots of tools to help us optimize things, like PageSpeed Insights and Chrome DevTools. But as different measurement tools have been built in order to focus on different aspects of speed optimization, they sometimes gave conflicting or inconsistent information. This left site owners, designers, developers, and marketers with gaps in their knowledge and a lack of actionable insights.

At least, that was true until the release of Lighthouse 3.0, most recently updated this past May. With the latest Lighthouse rollouts, it’s easier to identify the most burning ways you have to improve your site speed, and therefore your search positioning.

Here’s how a few top experts recommend optimizing websites for Lighthouse 3.0.

Know Your Needs and Stick to Them

One of the most common killers of your website’s speed is bloating it with unnecessary features. Without a strategic approach to implementing them, you can easily slow down your site without adding any benefits in exchange. 

To prevent this, here’s what Gaetano DiNardi, Director of Demand Generation at Nextiva, recommends: 

“When evaluating potential website features to implement, here are the four questions you should be asking. First, what exactly are we trying to solve for? This should be a hard number, such as driving an increase in monthly email newsletter signups. Next, why now? Is this even a real priority right now? For example, why do you need email newsletter signups now? You may need more website traffic first, before even making the case for more email newsletter signups.

Three, why can’t you use existing solutions? For example, you may already have a component in your tech stack that can execute what you’re trying to solve for, but you probably haven’t exhausted all your options. 

And finally, what are the risks or tradeoffs involved, and what’s the impact? This is precisely where site speed comes into play. Every time you add weight to your load, site speed is affected. You should ask if this is absolutely necessary, and if so, how can you deploy the technology in a way that won’t harm load times too much. An example of this would be deploying scripts via Google Tag Manager, rather than hardcoded.”

Choose Themes With Clean Code

If you go through the above questions for your website and confirm you indeed need to add a tool or plugin, realize that this is like adding a technology partner to your business. Research and vet them appropriately.

Even if you have been using the same theme for several years, if you really want to get serious about optimizing for speed, you might be better off starting fresh with a different one and only adding plugins and customizing CSS once that’s in place. Otherwise, you’ll just be doing patchwork on top of patchwork.

Natasha Lane recommends that you tackle your theme selection process extremely carefully since this will determine the code that your site needs to function and render properly. 

On the Devrix blog, Lane explains:

“A WordPress theme is more than a splash of color, and plugins are more than just an added bit of functionality. Neither of them affects just a single isolated part of your website, and as such, there is no room for errors in their coding.”

Optimize Heavy Elements

Other than themes and plugins, another common site speed problem is heavy media elements like images, gifs, and videos. While multimedia can improve the overall site experience when done right, the files and their hosting solutions need to be optimized carefully. You’d do well to use a third-party video host like Wistia, for example, and a CDN for your image files.

And be sure to either compress those visuals well before uploading them to WordPress, use a WordPress plugin to optimize them on upload, or host them externally and embed the content as needed.

Portent’s Ian Lurie recommends that you use a tool named Squoosh, or he might need to hound you with follow-up reminders:

“Compress your images. Don’t roll your eyes at me. I’ve looked at your site. Do it. Try Squoosh. The name alone makes it worth it. 

Use Lazy Loading

Another way to optimize images and heavy elements is to take advantage of lazy loading. 

Duda CEO Itai Sadan explains:

“Lazy loading is important because it prioritizes content, specifically images, that are at the top of a page when a visitor first accesses a web page. As a user scrolls down the page, additional site elements will load. 

We’ve tested several sites that have implemented lazy loading and saw an average of a 10 point bump in Lighthouse score. 

The reason this is so important for Lighthouse is, Google is trying to offer a real-world, comprehensive view of how a website performs and lazy loading is a positive factor in this equation. Most other website speed checkers just look at a site’s total download size and time to load.”

Let Plugins Handle Important Functions

Yes, plugins can weigh your site down, but some can also make it easier to implement changes that help with speed.

Some of the features worth turning to third-parties for are the most important ones. This is because it can be easier to turn to a trusted third-party than for developers to do it themselves. 

Cybersecurity plugins can make sure that your hosting isn’t receiving too many queries from malicious bots, while cache management plugins can keep the most commonly accessed visuals in your host’s RAM for faster access.

Albacross Marketing Specialist Oksana Chyketa explains:

“Even though WordPress comes with thousands of free and useful plugins, there is no need to install all of them. Choose the basic ones, such as for SEO, security, and cache, and try to avoid those that you can successfully do without.

Plugins are a good thing, but many plug-ins can negatively affect your website’s performance, such as reducing its speed.”

Remove Unused CSS

Finally, minifying your JavaScript, HTML, and CSS files is one of the most commonly cited ways to shorten load times. 

But as Nick Braithwaite, the founder ChooseWP, explains, minifying CSS is just the tip of the iceberg:

“You’ve minified your CSS and it’s not too big! But before you put your project live, it’s worth asking how many of those CSS rules are actually being used?

At the easier end of the spectrum, let’s say you’re using a CSS framework like Bootstrap for your new site, but you’re only really using the buttons and grid. In this case, using the @import rule, you can select which parts of Boostrap you need

CSS bloat happens a lot with WordPress themes, as they need to account for a number of different layouts. To avoid this, use a lighter theme or one that comes with dependency management capabilities. Understrap is a good example and one to which you can apply the @import rules mentioned above. 

Once the easy wins are out of the way, there are tools out there that can go through your CSS on build and see if there are any unused rules, if you’re using the NPM JavaScript package manager, then UnCSS is a neat little tool for this.”

Does Your Site Make Lighthouse Happy?

If you’ve never optimized for site speed before, your first results from a Lighthouse audit might be disappointing. But following the above advice from experts who know WordPress inside and out should get you closer to the grade you want.

Ananda Projapati

Ananda is a freelance front end developer and CSS expert from India. He writes about front end development in his blog designtheway.com

The post 6 Tips From Experts on Optimizing Websites for Google’s Lighthouse 3.0 Speed Tests appeared first on Torque.

Sharing is Awesome, Thank You! :)

Share this Blue 37 post with your friends