Confronto di screenshot

Il confronto di screenshot è il processo che verifica due screenshot della stessa schermata, pagina o finestra per trovare differenze. Il confronto può essere visivo, con le immagini affiancate, sovrapposte con un cursore o miscelate con opacità parziale. Può anche essere calcolato, con un software che produce un'immagine di differenze che evidenzia i pixel modificati e un conteggio o una percentuale di pixel diversi.

Un confronto affidabile richiede input corrispondenti. Entrambe le immagini devono avere le stesse dimensioni in pixel, lo stesso fattore di scala e lo stesso ritaglio. Un cambiamento della dimensione della finestra, della scala Retina o della posizione di scorrimento rende diversi quasi tutti i pixel, anche quando il contenuto è lo stesso.

Confronto manuale e automatico

Il confronto manuale si adatta a poche immagini e a valutazioni soggettive, ad esempio se un restyling si legge meglio. Il confronto automatico si adatta a molte immagini ed esecuzioni ripetute: uno script confronta ogni nuova cattura con una baseline memorizzata e segnala solo quelle cambiate oltre una soglia.

Dove si usa il confronto di screenshot

• Test di regressione visiva dopo modifiche al codice.
• Verifica di cambiamenti di contenuto su una pagina di un concorrente o sulla propria.
• Immagini prima e dopo per revisioni di design e note di rilascio.
• Conferma che un documento o una dashboard corrisponda a una versione precedente.

Come funziona il confronto visivo delle differenze

1. Allinea le due immagini alla stessa dimensione.
2. Confronta i valori di colore di ogni pixel.
3. Ignora le differenze sotto una tolleranza, che assorbe il rumore dell'antialiasing.
4. Marca i pixel modificati con un colore di evidenziazione e riporta il totale.

I metodi percettivi come SSIM confrontano struttura e contrasto invece dei valori esatti, il che riduce i falsi allarmi dovuti a piccoli spostamenti del rendering.

Errori comuni con il confronto di screenshot

• Confrontare immagini di dimensioni o fattori di scala diversi.
• Lasciare nel frame orologi, annunci, carousel o animazioni.
• Fare catture con font diversi installati o con una versione diversa del browser.
• Impostare una tolleranza così alta che le modifiche reali passano inosservate.

Ripeti gli stessi screenshot più volte?

Temposhot Website Capture mantiene le impostazioni Device, Area e Wait per ogni URL, quindi le esecuzioni ripetute producono immagini confrontabili. Per le regioni dello schermo, una Custom Area salvata mantiene lo stesso rettangolo. Vedi opzioni di cattura.

Domande frequenti

Qual è una buona soglia di differenza?

Dipende dalla pagina. Parti da un valore basso, controlla i falsi allarmi e maschera le regioni dinamiche invece di alzare la soglia.

Posso confrontare due screenshot senza installare nulla?

Sì. Lo Compare Images evidenzia le differenze nel browser.

Fonti

• Playwright visual comparisons
• Indice di somiglianza strutturale su Wikipedia

Risorse correlate

• Confronta immagini: confronta due immagini in locale.
• Avvio rapido di Website Capture: cattura insiemi di pagine ripetibili.
• Sorgenti di cattura: aree personalizzate salvate.