Monitoraggio di un sito web

Il monitoraggio di un sito web tramite screenshot segue nel tempo i cambiamenti visivi, acquisendo immagini a intervalli regolari e confrontandole per individuare le differenze.

Related workflow terms: Web crawler, Web scraping.

Screenshot e disponibilità a confronto

Il controllo della disponibilità risponde a una domanda semplice: il server risponde? Invia una richiesta e verifica che il codice di stato HTTP indichi successo. Se il server restituisce 200 OK, il sito viene considerato disponibile. Ma la risposta non dice nulla sull'aspetto della pagina, che può caricarsi mostrando un'impaginazione danneggiata, immagini mancanti, contenuti errati o un messaggio di errore nel corpo.

Il monitoraggio tramite screenshot va oltre. Acquisisce il risultato visivo che vedrebbe una persona. Confrontando le immagini nel tempo, rileva ciò che i controlli della disponibilità non possono trovare: spostamenti dell'impaginazione, modifiche ai contenuti, regressioni nello stile ed elementi grafici non caricati.

I due metodi si completano. Il controllo della disponibilità rileva le interruzioni del server; gli screenshot individuano regressioni visive e cambiamenti dei contenuti mentre il server continua a funzionare.

Dove si usa il monitoraggio tramite screenshot

• Controllo della concorrenza — acquisisce a intervalli regolari pagine dei prezzi, elenchi delle funzioni e pagine di destinazione dei concorrenti per rilevare cambiamenti.
• Marchio e conformità — controlla le pagine pubbliche della propria organizzazione affinché contenuti, avvertenze e identità visiva restino corretti e aggiornati.
• Controllo qualità e staging — acquisisce gli ambienti di prova dopo ogni distribuzione, per verificare la resa prima del passaggio in produzione.
• Monitoraggio SEO — rileva modifiche alla struttura, ai titoli e ai contenuti che potrebbero influire sul posizionamento nei motori di ricerca.
• Pagine normative — registra pagine legali, condizioni di servizio e informative sulla privacy per individuare modifiche non autorizzate o involontarie.

Come funziona

Il processo si divide in tre fasi: acquisizione, confronto e avviso.

Nella prima, uno strumento automatico, in genere un browser headless, apre l'URL di destinazione a intervalli programmati e salva uno screenshot. Deve usare sempre le stesse dimensioni della viewport, lo stesso rapporto tra pixel del dispositivo e la stessa strategia di attesa, affinché le differenze dipendano dalla pagina e non dalle impostazioni.

Nella seconda, il nuovo screenshot viene confrontato con un'immagine di riferimento precedente. Il confronto può avvenire a livello di pixel, secondo la percezione visiva o tramite analisi strutturale. Le aree con contenuti dinamici, come annunci, date e contatori in tempo reale, possono essere mascherate per evitare falsi avvisi.

Nella terza, se la differenza supera una soglia prestabilita, viene inviata una notifica via email, Slack, webhook o un altro canale. L'avviso comprende di solito le immagini prima e dopo, più un confronto visivo che evidenzia le aree cambiate.

Gli strumenti automatici possono programmare gli screenshot del sito a intervalli ed eseguire l'intero ciclo senza intervento manuale.

In un processo simile a quello di Shotomatic, spesso basta un modello di acquisizione fisso e un piccolo insieme di aree mascherate. Gli avvisi restano così concentrati sui cambiamenti significativi, senza il rumore di contenuti a rotazione o date.

Errori comuni

• Non mascherare le aree dinamiche. Annunci, banner a rotazione, date e contenuti personali cambiano a ogni acquisizione. Senza maschere, ogni confronto genera un falso avviso e le modifiche reali si perdono nel rumore.
• Usare impostazioni incoerenti. Cambiare dimensioni della viewport, rapporto tra pixel o tempi di attesa introduce differenze che non corrispondono a cambiamenti reali. Uniforma ogni parametro ed esegui le acquisizioni nello stesso ambiente.
• Monitorare troppo di rado. Un'acquisizione al giorno può non rilevare cambiamenti comparsi e annullati nel giro di poche ore. Scegli la frequenza in base alla rapidità con cui le variazioni diventano importanti.
• Ignorare le pagine autenticate. Molte pagine importanti, come pannelli di controllo, impostazioni dell'account e prezzi per utenti registrati, richiedono l'accesso. Se lo strumento non si autentica, acquisisce soltanto la schermata di login.