What It Is & How to Use It

What Is Google Lighthouse?

Google Lighthouse is a free Google device that helps you enhance the standard of webpages in your web site.

The device audits your pages for efficiency, accessibility, search engine marketing, and extra. And affords recommendations so you’ll be able to enhance these points.

It’s open-source software program—anybody can apply it to any webpage.

Whether or not you’re an online developer, search engine marketing, or web site proprietor, Google Lighthouse can assist you improve your web site’s total expertise and efficiency.

On this publish, we’ll cowl how Google Lighthouse works and the way you should utilize it to audit your webpages.

Let’s dive in.

How Does Google Lighthouse Work?

Google Lighthouse works by performing audits for 5 major web site optimization classes.

1. Efficiency

On this audit, Lighthouse measures how rapidly an internet site hundreds and the way rapidly customers can entry it.

It experiences your efficiency for 5 pace metrics, every measuring some side of page speed:

• First Contentful Paint (FCP): Measures the time at which the primary textual content or picture turns into seen to customers
• Largest Contentful Paint (LCP): Calculates the time a web page takes to load its largest ingredient for customers
• Complete Blocking Time (TBT): Measures the period of time {that a} web page is blocked from reacting to person enter, like a mouse click on
• Cumulative Format Shift (CLS): Measures the format shifts that happen as customers entry a web page
• Pace Index (SI): Exhibits how rapidly the content material of a web page is loaded

Lighthouse assigns an total efficiency rating to a web page primarily based on how your web page carried out for all these metrics. The rating might be something from 0 to 100.

In case your rating is between 90 and 100, it signifies that your web page is nicely optimized for person expertise.

Something under 90 means a major variety of sources in your web page are slowing issues down, affecting the general web page expertise.

Lighthouse additionally affords recommendations. Which you’ll implement to enhance your efficiency. 

2. Accessibility

Lighthouse’s accessibility check analyzes how nicely individuals who use assistive applied sciences can use your web site.

Particularly, it appears at components like buttons and hyperlinks to see whether or not they’re described nicely. 

It additionally analyzes pictures to see whether or not alt text is specified. So when customers with restricted or no imaginative and prescient use display screen readers, they perceive what the picture is all about.

Much like a efficiency audit report, the accessibility report provides you a rating out of 100. The upper the rating, the higher.

The device additionally highlights alternatives to enhance your total accessibility.

3. Finest Practices

The perfect practices audit in Lighthouse checks whether or not your web page is constructed on the trendy requirements of net improvement.

Lighthouse examines whether or not:

• Assets load from safe servers with HTTPS.
• All pictures seem with the right side ratio and in acceptable decision
• All JavaScript libraries are secure and free from any vulnerabilities.
• Web page has the HTML doctype
• Content material Safety Coverage (CSP) is efficient towards cross-site scripting (XSS) assaults
• Web page is free from all browser errors
• Web page is free from deprecated frameworks and APIs
• Web page has legitimate supply maps
• Web page is free from points showing in Chrome DevTools panel, corresponding to community request failures, inadequate safety measures, and different browser points
• Web page’s character encoding is ready with the meta charset tag
• Web page permits customers to stick password in password subject
• Web page creates a very good person expertise by blocking geolocation and notification permission requests on web page load

All these components resolve your rating out of 100.

The Lighthouse report on greatest practices additionally highlights particular components that require your consideration. Which may enhance your rating. 

4. search engine marketing

Lighthouse runs a check to research your webpage for some technical aspects of SEO. 

Particularly, it checks whether or not:

• Your webpage is mobile-friendly
• Web page has a legitimate structured knowledge
• Inner hyperlinks are crawlable
• Web page has a legitimate hreflang attribute
• Title and meta description tags are set
• Web page is indexable
• Robots.txt is legitimate
• Web page is returning HTTP 200 (OK) standing response code
• Web page has a legitimate “rel=canonical” tag set
• Web page content material is impartial of plugins
• Hyperlinks on a web page are launched with descriptive textual content
• Photos on a web page have picture alt texts specified
• Web page has a viewport meta tag with width or initial-scale set

After which assigns a rating out of 100.

It additionally highlights any search engine marketing points it detected when operating an audit.

However the device doesn’t provide you with a full image of your search engine marketing.

If you’d like your web site to rank higher in Google, you have to guarantee it’s optimized for all points of search engine marketing. Be sure that no points are affecting your rankings.

That’s the place instruments from Semrush can come in useful.

For instance, Site Audit checks your web site for over 140 points of search engine marketing. Like duplicate content material, redirects, inner hyperlinks, URL construction, and extra.

To make use of the device, set up a project and run your audit.

As soon as the audit is full, you’ll get a high-level overview of your web site’s search engine marketing well being.

You too can see particular points which can be affecting your efficiency. Simply go to the “Points” tab.

For every challenge detected, the device affords recommendation on the right way to repair it.

Resolve every challenge the device detects to your website. So your web site’s search engine marketing stays in a wholesome state.

5. Progressive Net App (PWA)

The PWA audit in Lighthouse validates whether or not your net software makes use of fashionable net capabilities to supply an optimum person expertise.

It checks whether or not your net app is:

• Quick and dependable on cell networks and affords offline performance
• Installable on a number of machine varieties and has options like offline performance and push notifications
• PWA-optimized by redirecting HTTP site visitors to HTTPS, configuring a customized splash display screen, sizing webpage content material to suit on cell screens, and implementing all of the other best practices listed by Lighthouse

The check runs your net app towards these components and assigns one of many PWA badges.

Because of this, not like the primary 4 experiences, you’re assigned a badge (not a rating of 100) once you run a PWA audit in Lighthouse.

Like this:

The audit report will even present recommendations for enhancing your total PWA efficiency. Together with particular points that must be addressed.

How you can Use Google Lighthouse

Now that you understand what Google Lighthouse is and the way it works, let’s take a look at the alternative ways you should utilize it to audit your pages.

Utilizing Lighthouse with Chrome DevTools

In your Chrome browser, you’ll be able to run a Google Lighthouse audit with Chrome DevTools. 

Open the webpage you wish to audit.

Then right-click anyplace on the web page and choose “Examine.”

The Examine function will open a DevTools panel on the best aspect of the webpage.

Choose “Lighthouse” from the panel’s toolbar. (In the event you can’t discover the Lighthouse choice, click on on the 2 arrows on the finish of the toolbar. You’ll see it there.)

From right here, you’ll be able to choose one, extra, or all classes, relying on which points of your web site you wish to analyze. And click on “Analyze web page load.”

Then the device will generate a report for you. You’ll discover your audit scores for every class on the high. 

You may click on on a particular class to be taught extra. On this instance, we clicked “Efficiency” audit.

Word: You’ll discover Lighthouse measuring your efficiency for six pace metrics (as an alternative of 5) once you run a efficiency audit with DevTools.

That additional metric is Time to Interactive (TTI). Which calculates the time it takes for a web page to turn into totally interactive for customers.

This metric is one of their retired metrics. It’s unclear why it’s nonetheless being accounted for once you run Lighthouse audits in DevTools.

Utilizing Lighthouse with Chrome Extension

Lighthouse has a Chrome extension that may carry out audits for you.

In your Chrome browser, set up the Lighthouse Chrome extension.

Go to the webpage you wish to check.

Then open the Chrome extension menu and choose “Lighthouse.”

Then click on on the cog icon. 

You will notice settings the place you’ll be able to choose or deselect particular classes primarily based on the experiences you wish to generate.

Then begin the audit by clicking the “Generate report” button.

Lighthouse will generate a report for you in a brand new tab.

Utilizing Lighthouse in PageSpeed Insights

Lighthouse can be out there by way of Google’s PageSpeed Insights device.

Open the device. Enter your web page URL, and click on “Analyze.”

The device will generate experiences for all classes, besides PWA. PageSpeed insights doesn’t carry out PWA audits.

Utilizing Google Lighthouse by way of Node Module

You too can use a Node JavaScript module to run Lighthouse audits.

Set up the current Node in your system.

Then run the next command line to put in Lighthouse:

npm set up -g lighthouse

As soon as Lighthouse is put in, use the command line under to generate experiences.

lighthouse <url>

(It’s good to exchange the “url” with the net handle of the web page you wish to check.)

FAQs

How Is Lighthouse Completely different from PageSpeed Insights?

Lighthouse is completely different from PageSpeed Insights in that Lighthouse solely makes use of lab knowledge to measure the efficiency of your pages. Whereas PageSpeed insights makes use of each lab and subject knowledge.

Lab knowledge displays how hypothetical customers might expertise your website. In distinction, subject knowledge displays how actual customers skilled your web site.

Why Are My Scores Completely different Every Time I Check?

The scores you see in Lighthouse can fluctuate every time you run the check. 

Community situations, browser extensions that modify community requests, and adverts displayed on the particular web page have an effect on your rating every time you conduct the check.

Do Lighthouse Reviews Embrace Core Net Vitals Metrics?

Sure. The efficiency audit in Lighthouse analyzes your web site for the next Core Web Vitals metrics: