How to Use to Chrome Lighthouse

by admin admin Date: 14-06-2019 seo Lighthouse Chrome


How would you like to perform a fast SEO audit with a Chrome browser-based instrument? With the Lighthouse extension, you can do that.

If you're not acquainted with Lighthouse, it's an open-source tool used by experts to verify their website's health. It analyzes everything from best practices to performance to accessibility.

As written in Wikipedia, A lighthouse is a tower, building, or other types of structure designed to emit light from a system of lamps and lenses and to serve as a navigational aid for maritime pilots at sea or on inland waterways.

Okay, let's transform it into tech words: Lighthouse is a tower, structure or other building designed to emit light from a device under the "Audits" panel of Chrome Developer Tools and works as a developer guide.

The instrument serves its purpose: it prevents you from "crashing on the rocks." You had to operate Lighthouse on an operating system's command line or as a node module in the past, however. Now, in your browser, you can start it.

Well, in poor words, Lighthouse is a Google-designed instrument that analyzes web applications and web pages, gathers performance metrics and information on best practices for developers.

According to Google Developers Docs:

Lighthouse is an open-source, automated tool for improving the quality of web pages. You can run it against any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, and more.
You can run Lighthouse in Chrome DevTools, from the command line, or as a Node module. You give Lighthouse a URL to audit, it runs a series of audits against the page, and then it generates a report on how well the page did. From there, use the failing audits as indicators on how to improve the page. Each audit has a reference doc explaining why the audit is important, as well as how to fix it.

We're going to go over the Chrome Lighthouse extension in this article, clarify how to install it, and illustrate you how to use it.

 

Installing the Lighthouse Chrome Extension

 

 

You must install it in your browser before you can use the Lighthouse Chrome extension.

Luckily, this is simple to do. First, check the extension page. If it looks like a pop-up in a distinct window. You should see a button in the bottom right corner that states "Add to Chrome" or similar expressions.

Click the button.

You will see a pop-up confirmation asking if you want the Lighthouse extension to be installed.

Click on the button "Add extension."

You should see a notification in the top right corner after some processing time that the extension was added to your Chrome browser. Close the pop-up.

You should see the Lighthouse icon in the browser's upper right corner next to the bar where you type in a URL.

That indicates you installed the extension effectively.

 

Running Your First Lighthouse Report

 

Once the Lighthouse Chrome extension has been installed, it's time to run your first report. You need to go over to the website you want to audit before you can do that.

Let's audit your web site.

Open your tab in a new tab.

Next, in the upper right corner of the screen, press on the Lighthouse icon. A pop-up is going to appear.

You will see the name of the extension (Lighthouse) in the center of the pop-up. You'll see the URL of the page you're about to test just below that: "https:/www.mysite.com.

You will see two buttons at the edge of the pop-up: "Options" and "Generate Report." To view some of your settings, click the "Options" button.

As you can notice, you can choose from five different audit types:

  • Performance – checks how quickly the page loads
  • Progressive Web App – checks PWA qualities such as responsiveness and 3G speed
  • Accessibility – checks website friendliness for non-typical users (such as those who are color-blind)
  • Best Practices – checks for web application development best practices
  • SEO – checks that the page is optimized to perform well in the search engine results pages (SERPs)

Click "OK" on the popup "Audit categories to include." Then press "Generate Report." The report appears in a distinct browser window after a couple of minutes.

If you look at the top, for each audit category you have just chosen, you will see numerical results.

Your statistics may be slightly different.

These results are from  0 to 100, with the 100 being the best 100. As you can see, low scores are red colored, medium scores are yellow, and high scores are green. That's the pattern you're going to see on other instruments like PageSpeed Insights.

 

Performance Reports on Lighthouse Chrome 

 

You will see a timeline at the top in the Performance section. This timeline demonstrates you how it takes the page to load.

As you can see, the extension "draws" a thumbnail version of the site.

You will see some important metrics below the timeline. The First Meaningful Paint status indicates how long it takes to load the page. The Perceptual Speed Index indicates how fast the page content is clearly populated. The Estimated Latency indicates how long the website will take to react to user input.

Lighthouse shows some improvement opportunities below the stats. For instance, it looks like the stylesheets for render-blocking add about 700ms–800ms in page load time.

Lighthouse also checks images, legacy image formats, and CSS rules that have not been used.
So right off the bat, you can see that if SEMRush took care of those issues, the site could cut off its loading time by more than a second. Users would be happy about that.

The Diagnostics section is below the Opportunities section. This provides you information of the Critical Request Chains. Use this information to locate bottlenecks in the load of the website. 
 

Progressive Web App Reports and Accessibility

 

A progressive web app utilizes state-of-the-art technology to provide a wealthy browser experience: Ma-No has it ;-).

Finally, Lighthouse shows you a list of things you need to check manually:

  • Cross-browser compliance
  • Smooth transitions from page to page
  • Unique URLs for all

 

The category of Accessibility audit checks the website to guarantee that it can be used by people with special needs.

And yet again, Lighthouse will tell you stuff you need to manually verify, such as the page's tab order, adequate labeling of custom controls, and the page's visual order.
 

Best Practices Section

 

If you run the audit of best practices toward your site and see some errors, contact your development team is crucial. Most of these issues are too difficult for someone who is not an expert in developing web applications.
 

SEO Score

 

Finally, from a SEO perspective, the SEO category displays the website's health. 

If you run your website's SEO report and see failures in the audit, you may be able to take care of them on your own. Nevertheless, contact your development team is probably a good idea.

The lighthouse has just been released. This means that Google will most likely add to its feature set over time.

So, although the extension seems rather light (especially if compared to more sophisticated tools like Screaming Frog), at this point it is only in its child-like phase. Look for it to conduct a more solid analysis of your website at some point in the future.

Until then, it's a great extension to have in your browser so you can control any site with few clicks.

 

Finally, the SEO category shows the health of the website from an SEO perspective. 

 

Conclusions

 

The lighthouse has just been released.
This means that Google will most likely add to its feature set over time.
So, although the extension seems rather light (especially if compared to more sophisticated tools like Screaming Frog), at this point it is only in its child-like phase.
Look for it to conduct a more solid analysis of your website at some point in the future. Until then, it's a great extension to have in your browser so you can control any site with few clicks.

 
by admin admin Date: 14-06-2019 seo Lighthouse Chrome hits : 1734  
 
 
 
 

Related Posts

    Nofollow and dofollow links, How and when to use?

    Within any website the links are an element that brings dynamism to the experience of navigating through the different sections that make it up allowing us to go from one…

    Crazy SEO Tips For 2019

    Are you interested in learning more about SEO in 2019? Here are the trends you need to follow to improve your search optimization skills. For those who don’t know about SEO,…

    A Guide to the new Google Search Console

    Google Search Console, before known as Webmaster Tools, is a decisive tool created to easily track the performance of your website, but also to improve its visibility and usability. Over…

    Best SEO Tools for 2018

    Search engines are a massive source of traffic for a lot of websites, in fact it can be the primary source. Due to this, it’s important that you make use…

    Social Media Marketing or SEO?

    Want to increase traffic to your site? Driving traffic to your website is no longer a simple or straightforward task. With so much competition, disinformation and misinformation, where are we supposed…

    Increase the Number of Backlinks to Your Site the Right Way

    SEO is important, however, the algorithms used and the techniques you need to use are changing every day. RankBrain is Google’s newest invention that has once again changed the face…

    What You Need to Start a Great Healthcare Blog

    Would you like to start your own healthcare blog? Many people think about setting up this type of resource, but very few of these people eventually make a success of…

    Useful technical SEO checklist for developers

    Nowadays search engine optimization has evolved to such a degree that it very nearly emulates real world marketing; that is, marketing for the people. And there is one great truth on this freak…

    Google updates LocalBusiness Schema

    It seems we may have had a Google structured data update yet again . The next thing they changes was to require the Image and priceRange data fields in the LocalBusiness schema requirements. If you run the…

    How to Optimize Images for SEO

    Images are a vital part of engaging online content. People have short-time attention no one wants to open a page only to find an unbroken wall of text. Photos, infographics and…

    Google ranking factors: user behaviors that make the difference in SEO

    Google has never said that searchers' behavior is a ranking factor. But companies over the years have discussed this, most notably when Amit Singhal told the Wall Street Journal that Google had…

    Google's 200 Most Important Ranking Factors

      Domain Factors   1. Domain Age: In this video, Matt Cutts states that: “The difference between a domain that’s six months old verses one year old is really not that big at all.”. In…