How to Run a Lighthouse Report in Google Chrome

a lighthouse with a red roof, this one happens to be perched on a cliff on the Oregon Coast, another place we once lived before moving to Durango

Interested in how Google scores your website?

Want to see if a web design company takes care of their website, in order to determine if they’d likely take the same care with your own?

Google Chrome has a tool called Lighthouse, which you can use to test the quality of your website as per Google’s four categories, Performance, Accessibility, Best Practices and SEO.

See How Google Rates Your Website

Firstly, you’ll want to use Google’s Chrome browser. If you don’t have it, you can download it here. It’s also the best browser, and available on smartphones as well, but in any event you’ll need it for today’s purposes.

Once you’ve opened Chrome, load up the page you want to test. Today we’ll test https://wandrlymagazine.com/

Note: If it’s your own website, and say it’s a WordPress website or some other CMS, be sure to log out first, or open the site in an Incognito browser, like so on a Mac:

screenshot showing how to open a new incognito tab

We do this so that we’re seeing what everyone else does, not what may be cached on your local machine. This gives the fairest result, as many websites don’t run perfectly when caching is turned off…such as is appropriate when you’re logged into a WordPress website to edit it.

Now that you’re loaded up in an Incognito window, right click anywhere on the page, and choose Inspect from the menu that appears.

screenshot showing how to right click on a web page to show the Inspect option

Once you do that, you’ll see a pane like so appear at the top or side of your browser.

screenshot of Chrome's inspect panel

Depending on how webtacular you are, you may or may not have all of those tabs. The important one here is the Lighthouse tab. Give that a click, and you’ll see this:

the Lighthouse tab in Chrome Inspector

There are a lot of options there, but I suggest:

  • Ignore Mode, as the Default is the proper setting for most use cases.
  • Under Device, make sure Mobile is selected. While there are loads of conflicting reports on this, I find that most of my clients get far more mobile traffic than desktop. Plus, mobile is a more strict test, so you won’t get as good of scores, as easily.
  • Categories should have all but Progressive Web App ticked. Unless your website is actually a web app, which most are not..
  • Leave Plugins unchecked, unless you run ads on your site.

You’re now ready to click Analyze page load. The process takes a little while, and you shouldn’t navigate away from the page – otherwise the Lighthouse test may fail, and you’ll need to start over.

Here’s how that Wand’rly Magazine site stacks up (I built that by the way):

Lighthouse scores for https://wandrlymagazine.com, all 98 or above.
Performance: 97, Accessibility: 100, Best Practices: 100, SEO: 99

Here’s how this website scores:

Performance: 99, Accessibility: 98, Best Practices: 100, SEO: 100
Performance: 99, Accessibility: 98, Best Practices: 100, SEO: 100

About the Scores

There is a ton to digest with each section, and you can scroll down to get more information on each. A lot of it is web development and design jargon, but I’ll touch on each a bit here.

Performance

This is how quickly your site loads, and how well it works when it does. Many, many websites these days take no responsibility for their performance. Even WordPress, my CMS of choice, right out of the box doesn’t seem all that concerned with performance. Which is unfortunate. Personally, I look at building a website like building a home or an automobile. At a minimum, it should be awesome, but is awesome even really good enough? A pimped out Honda Civic is kind of awesome, but do all of those flashy lights under the chassis and slick screen on the dash mean it can drive up a steep road in the winter?

In the Performance section, these stats are the most important. Failing these will clue Google in that your site needs some work.

screenshot of core web vitals in Google Lighthouse report

These are called Core Web Vitals and I won’t get into them today, but most sites will be in the red for many, if not all, of these. They’re the key measurements of your site’s performance and missing one is like having faulty brake lines or a loose steering wheel. Another way to think of it, when these are not running optimally, people are leaving your slow-loading, wonky website.

A list of specific action items can be found below these. Here are those which could be cleaned up on Wand’rly:

List of performance issues listed in a Lighthouse report

Accessibility

This is all about how well your website can be used by those visitors with visual impairments. Failing this is like not having a wheelchair ramp at your 7/11. It may not seem important to you, but it is to a good web developer, and people get sued over sites that aren’t accessible all the time.

Best Practices

Is the front end of your website vulnerable to hacks? Is it secure? Is it annoying? Is it at least built with some modicum of care in mind? This report will provide the answers to those questions.

SEO

Do you want to show up on page 32 of Google’s search results? This number hints at how well you’re likely to do there.

How to Improve Lighthouse Scores on Your Website

This could be an entire website, and no doubt is. But here are the key points:

  • Avoid using “website builders” like Squarespace, Wix and certain WordPress plugins like Elementor, Divi and Beaver Builder.
  • Pay for a great hosting provider, like SiteGround (affiliate link, because I use them personally).
  • If you’re creating your website yourself, test new themes you might add to WordPress before investing too much time in them, and then test some more as you continue to build. Do this after you add plugins, too, as almost all plugins add some or a ton of bloat.
  • Hire an actual web developer, not just a company or dude in his aunt’s basement who learned how to ignore all of the above advice.

Questions? You’re always welcome to drop me a line here! In addition to building really, really great websites, I also sometimes offer free advice (time permitting, of course!)