Audit HTML con Lighthouse

Lighthouse è uno strumento di audit automatizzato integrato in Chrome DevTools (scheda Audits) che assegna un punteggio a una pagina in base a Prestazioni, Accessibilità, Best Practices, SEO e PWA. Esegue l'audit della pagina nel browser, effettua le misurazioni e produce suggerimenti concreti.

In Chrome DevTools, passi a Lighthouse, scelga le categorie, selezioni Desktop o Mobile e faccia clic su "Analizza il caricamento della pagina". Lo strumento ricarica la pagina in un ambiente pulito e produce un report in meno di un minuto.

Prestazioni misura i Core Web Vitals e altre metriche di velocità. Accessibilità verifica regole allineate alle WCAG. Best Practices riguarda la sicurezza e gli standard web moderni. SEO verifica il markup scansionabile dai crawler. PWA verifica la possibilità di installazione e il supporto offline.

L'audit di accessibilità rileva: testo alt mancante, etichette dei moduli mancanti, contrasto cromatico insufficiente, attributo della lingua mancante, ID duplicati, landmark mancanti, elementi focalizzabili senza supporto da tastiera. Ogni problema rimanda a indicazioni dettagliate per la correzione.

Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), Total Blocking Time (TBT) e Speed Index. Ogni metrica riceve un punteggio e un peso nel calcolo del punteggio complessivo delle prestazioni. Lighthouse mostra quali elementi del DOM contribuiscono maggiormente a ciascuna metrica.

Verifica l'utilizzo di HTTPS, gli errori della console, le proporzioni delle immagini, le API deprecate e i contenuti misti. L'audit delle Best Practices rileva un'ampia gamma di pratiche legacy o non sicure che dovrebbero essere modernizzate.

Rileva la meta description mancante, il tag <title> mancante o duplicato, i problemi di robots.txt, i link senza testo descrittivo, il meta tag viewport mancante e i problemi di hreflang. Affianchi Lighthouse SEO a un vero strumento di audit SEO (Ahrefs, Screaming Frog) per un'analisi a livello di contenuti.

Verifica ogni requisito per la possibilità di installazione: HTTPS, manifest valido con i campi minimi, service worker registrato, tag viewport e icone. Risolva tutti gli errori dell'audit PWA prima di lanciare l'app come applicazione installabile.

La CLI di Lighthouse e lo strumento Lighthouse CI integrano gli audit nella CI/CD. Per ogni PR, Lighthouse viene eseguito sull'anteprima distribuita; l'azione fallisce se i punteggi scendono al di sotto delle soglie. In questo modo si impediscono regressioni non rilevate nell'accessibilità, nelle prestazioni o nella SEO.

I report di Lighthouse possono essere salvati in formato JSON e confrontati a livello programmatico: tenga traccia del punteggio LCP nel tempo per rilevare regressioni, confronti due PR per vedere quale ha modificato ciascuna metrica e configuri avvisi al superamento delle soglie. I dati sono strutturati per essere utilizzati dagli strumenti.

Lighthouse esegue un test sintetico: funziona in un ambiente controllato, non sugli utenti reali. Lo affianchi a strumenti di Real User Monitoring (RUM) che monitorano l'esperienza effettiva degli utenti. I test sintetici rilevano presto le regressioni; il RUM conferma che gli utenti percepiscono realmente i miglioramenti.

Alcuni audit segnalano pratiche inevitabili in determinati contesti. Documenti le eccezioni deliberate, le aggiunga all'elenco di esclusione di Lighthouse CI e le rivaluti periodicamente con l'evoluzione della piattaforma. Eviti "ignora tutto" indiscriminati: vanificherebbero lo scopo dell'audit automatizzato.

Consideri i punteggi di Lighthouse un obiettivo di miglioramento continuo, non una correzione da effettuare una sola volta. Promuova una cultura in cui si controlla il punteggio a ogni PR, si affrontano immediatamente le regressioni e si migliora gradualmente il valore di riferimento. Con questa disciplina, la maggior parte dei team vede i punteggi crescere costantemente nel corso dei mesi.

Perché gli audit sintetici di Lighthouse dovrebbero essere affiancati dal Real User Monitoring (RUM)?

Lighthouse esegue audit su una pagina in relazione a Prestazioni, Accessibilità, Best Practices, SEO e PWA. Lo esegua da Chrome DevTools per controlli occasionali e utilizzi Lighthouse CI per l'integrazione continua. Affronti le regressioni a ogni PR, promuova una cultura del miglioramento basato sulle misurazioni e affianchi gli audit sintetici al Real User Monitoring per verificare che i miglioramenti in laboratorio producano vantaggi anche per gli utenti reali.