Skip to content

ucla-ux/site-audit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 

Repository files navigation

Site audit

Performance and accessibility review to help design a better user experience

Google Lighthouse

Google Lighthouse is an open-source, automated tool for improving the quality of web pages. It can be run in Chrome DevTools or installed locally and run from the command line.


Cheatsheet

Install

npm install -g lighthouse

See all options

lighthouse --help

To run an audit, use --output flags to export json, html or both. use --view to view report in browser.

lighthouse https://mysite.ucla.edu --output html --view

lighthouse https://mysite.ucla.edu --output html --output json --view

lighthouse https://mysite.ucla.edu --output html --emulated-form-factor=none --throttling-method=provided --view

lighthouse https://mysite.ucla.edu --output html --emulated-form-factor=none --view

Test on a site with authentication

When installed globally via npm i -g lighthouse or yarn global add lighthouse, chrome-debug is added to your PATH. This binary launches a standalone Chrome instance with an open debugging port.

  1. Run chrome-debug. This will log the debugging port of your Chrome instance
  2. Navigate to your site and log in.
  3. In a separate terminal tab, run lighthouse http://mysite.ucla.edu --port port-number using the port number from chrome-debug.
  4. ex. lighthouse https://mysite.ucla.edu --port portnumber --output json --output html --view

View and share reports

Reports are saved in the directory command is run. If you want to output path to another folder use --output-path

ex: lighthouse --output json --output-path <path/for/output.json>

To view a report that's been saved as a Gist:

Add ?gist=<ID> to the Viewer's URL, where <ID> is the ID of the Gist.

https://googlechrome.github.io/lighthouse/viewer/?gist=<ID>

Open the Viewer, and paste the URL of a Gist into it. Or upload the json file.


Google links for study


Accessiblity


Online Courses


Lighthouse reports

You can use this section to save reports and publish them on the web in this repo.

About

Using google lighthouse

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published