Manuale: Ispezione Immagini
La funzione "Ispezione Immagini" di Visual SEO Studio, documentata in dettaglio.
Ispezione Immagini
Image search optimization - una branca della SEO che mira a migliorare il traffico organico dalla ricerca per immagini - necessita una buona comprensione del patrimonio di immagini del tuo sito web.
Ispezione Immagini è uno strumento per fare l'audit SEO di tutte le immagini del tuo sito web; ti assisterà con un'analisi approfondita dei tag img
e delle immagini di destinazione.
Per ottenere il massimo dalla funzione ti raccomandiamo di selezionare le opzioni "Esplora immagini" e "Salva immagini" prima dell'esplorazione del sito web, così che il programma possa computare dimensioni e pesi delle immagini, e mostrare anteprime delle immagini.
Sommario
La scheda Sommario ti fornisce una prospettiva d'insieme dei report disponibili in Ispezione Immagini.
Puoi selezionarla velocemente quando vuoi, anche se non è visibile, cliccando sul link Mostra Sommario.
Tag IMG trovati
Il numero totale di tag IMG trovati tra tutte le pagine della sessione di esplorazione corrente.
Contenuto scheda
La scheda Sommario ti fornisce una vista d'insieme dei tag IMG analizzati con un insieme di grafici a torta in 3D, ognuno a dare evidenza di un aspetto particolare:
Pagina sommario di Ispezione Immagini
- Pagine per immagine
- Immagini per dominio
- Immagini per protocollo
- Immagini per Codice di Stato
- Tag IMG e attributo ALT
- Tag IMG e attributo TITLE
Come tutti i grafici a torta in 3D in Visual SEO Studio, i diagrammi possono essere zoomati, ruotati, copiati e salvati a piacere.
Visualizza dettagli
Quando un grafico del sommario ha una scheda corrispondente, sotto di esso un link Visualizza dettagli, una volta cliccato, selezionerà la scheda corrispondente.
Lista tag IMG
La lista di tutti i tag IMG è il cuore dello strumento: non solo fornisce una lista completa di tutti i tag IMG nel tuo sito, ne dettaglia anche il peso (KB) e le dimensioni (pixel) delle immagini puntate.
Un comodo visualizzatore di immagini sulla destra ti fornirà una comprensione immediata dell'immagine.
Tabella principale di Ispezione Immagini (diverse colonne sono nascoste)
Lista tag IMG: Barra degli strumenti
Tag IMG trovati
Il numero totale di tag IMG trovati tra tutte le pagine della sessione di esplorazione corrente.
Mostra
Talvolta è meglio "vedere di meno" così da concentrarsi su un singolo aspetto che vuoi analizzare.
Questa opzione ti permette di filtrare i tag IMG e mostrarne solo un sotto-insieme che corrispondono a scenari comuni da investigare per trovare casi che potrebbero migliorare la SEO generale del sito.
Commutare questa opzione è istantaneo perché stai solo filtrando l'insieme dei risultati non stai facendo di nuovo la ricerca.
Lista tag IMG, opzioni di filtraggio
-
Tutti i tag IMG
È l'opzione predefinita: non è applicato alcun filtro e la tabella elenca tutti i tag IMG. -
Tag IMG senza attributo ALT
L'attributoalt
dovrebbe contenere un testo alternativo che i browser possano mostrare quando il file di risorsa immagine non può essere scaricata, e per utenti con deficit visivi che usano dispositivi di lettura dello schermo.
Detto questo, l'attributoalt
è anche una buona opportunità dal punto di vista SEO per fornire ai motori di ricerca un breve testo descrittivo dei concetti (o "parole chiave" e alias) per cui desideri posizionare l'immagine nella ricerca per immagini.
Immagini puramente decorative che non portano contributo alla missione della pagina possono essere lasciate con l'attributoalt
vuoto. -
Tag IMG con attributo SRC che punta verso immagine non-'200 OK'
Questo filtro ti permette di trovare facilmente immagini mancanti a causa di URL errati o per la mancanza di file, e immagini redirezionate, spesso passano inosservate, o problemi di mixed-content dopo una migrazione da HTTP a HTTPS perché gli indirizzi delle immagini sono cablati. In tutti questi casi significa che l'attributosrc
del tag IMG dovrebbe essere corretto.
In caso di errore 5xx il problema dovrebbe essere investigato lato server. -
Tag IMG senza attributo WIDTH o HEIGHT
Se il browser conosce in anticipo le dimensioni del file immagine in pixel, può velocizzare la costruzione della pagina pre-calcolando le dimensioni richieste dal rettangolo da mostrare per l'immagine. -
Tag IMG con valore WIDTH o HEIGHT errato
Se le dimensioni in pixel dell'immagine sono diverse da quelle fornite negli attributi HTML, il browser dovrà ridimensionare l'immagine visualizzata. Ciò costa tempo di calcolo, il risultato finale non sarà il massimo, e stai probabilmente scaricando un'immagine più grande del necessario. -
Tag IMG che puntano verso immagini ospitate su server esterni
Immagini esterne possono essere lecite, come le tue immagini ospitate sul una CDN, o pixel di tracciamento come quello di Facebook, ma a volte possono essere causate da hot linking. Altre volte potrebbe trattarsi di immagini temporanee su spazi come DropBox e poi dimenticate.
Mostrati
Il numero totale di tag IMG trovati che corrispondono al fitro selezionato nell'opzione "Mostra".
È mostrato come il rapporto di due numeri: il numero di tag IMG elencati, sul numero di tutti i tag IMG.
Quando il filtro selezionato è l'opzione "Tutti i tag IMG", è normale che i due numeri siano uguali tra loro, e uguali al primo numero mostrato nel campo "Tag IMG trovati".
Contenuto
Cliccando il bottone Contenuto apparirà un menu a tendina con le seguenti opzioni:
-
Pagina di origine
Il pannello di destra Contenuto mostrerà il codice HTML della pagina web contenente il tagimg
selezionato.
Altri pannelli ausiliari a livello di pagina alla destra o in basso mostreranno contenuti alla stessa pagina web. -
Immagine di destinazione
Il pannello di destra Contenuto mostrerà un'anteprima del file immagine puntato dal tagimg
selezionato.
Altri pannelli ausiliari a livello di pagina alla destra o in basso NON mostreranno alcun contenuto.
Affinché l'anteprima appaia, l'opzione di esplorazione "Salva immagini" deve essere stata selezionata prima della visita al sito.
Scegli colonne
Cliccando il bottone Scegli colonne potrai visualizzare o nascondere colonne dalla tabella.
Esporta
Cliccando il bottone Esporta apparirà un menu a tendina con le seguenti opzioni:
-
Esporta in Excel
Permette di esportare il contenuto delle colonne visibili in un documento Excel. -
Esporta in CSV
Permette di esportare il contenuto delle colonne visibili in un file CSV.
Analisi delle ricerche
Cliccando il bottone Analisi delle ricerche apparirà una finestra di dialogo che ti permetterà di aggiungere colonne per i dati "Analisi delle ricerche" di Google relativi all'URL della pagine contenente il tag IMG.
Bing/Yahoo
Cliccando il bottone Bing/Yahoo apparirà una finestra di dialogo che ti permetterà di aggiungere colonne per i dati "Traffico pagine" di Bing/Yahoo relativi all'URL della pagine contenente il tag IMG.
Mozscape
Cliccando il bottone Mozscape apparirà una finestra di dialogo che ti permetterà di aggiungere colonne con dati da Moz relativi all'URL della pagine contenente il tag IMG.
Lista tag IMG: Intestazioni di colonna
URL pagina
L'URL assoluto indirizzo della pagina web dove il tag img
dell'immagine è stato trovato.
URL immagine
L'URL assoluto indirizzo del file di risorsa immagine puntato dall'attributo src
.
Valore SRC
Il valore dell'attributo src
nella definizione HTML dell'immagine. L'attributo src
può contenere un attributo relativo o assoluto.
Valore ALT
Il valore dell'attributo alt
nella definizione HTML dell'immagine.
L'attributo alt
dovrebbe contenere un testo alternativo che i browser possano mostrare quando il file di risorsa immagine non può essere scaricata, e per utenti con deficit visivi che usano dispositivi di lettura dello schermo.
Detto questo, l'attributo alt
è anche una buona opportunità dal punto di vista SEO per fornire ai motori di ricerca un breve testo descrittivo dei concetti (o "parole chiave" e alias) per cui desideri posizionare l'immagine nella ricerca per immagini.
Non sbatterci semplicemente una serie di parole chiave, deve essere un testo breve e descrittivo.
Immagini puramente decorative che non portano contributo alla missione della pagina possono essere lasciate con l'attributo alt
vuoto.
title
Il valore dell'attributo opzionale title
nella definizione HTML dell'immagine. I browser di solito usano il valore dell'attributo title
come tooltip. I motori di ricerca possono occasionalmente usare il valore di title
per associare un testo all'immagine, in particolare quando nessun attributo alt
è presente.
Valore WIDTH
Il valore dell'attributo opzionale width
nella definizione HTML dell'immagine.
Deve essere un intero senza unità di misura. L'attributo width
dice al browser la larghezza in pixel desiderata per mostrare l'immagine. Una buona pratica è indicare la misura reale senza cercare di ridimensionare l'immagine perché rallenterebbe il tempo di rendering e distorcerebbe l'immagine. Al contrario fornire prima al browser le dimensioni corrette permette di accelerare il tempo di rendering. Usare un'immagine con le dimensioni appropriate permette anche di ridurre il tempo di download.
Valore HEIGHT
Il valore dell'attributo opzionale height
nella definizione HTML dell'immagine.
Deve essere un intero senza unità di misura. L'attributo height
dice al browser l'altezza in pixel desiderata per mostrare l'immagine. Una buona pratica è indicare la misura reale senza cercare di ridimensionare l'immagine perché rallenterebbe il tempo di rendering e distorcerebbe l'immagine. Al contrario fornire prima al browser le dimensioni corrette permette di accelerare il tempo di rendering. Usare un'immagine con le dimensioni appropriate permette anche di ridurre il tempo di download.
Larghezza immagine
La larghezza effettiva in pixel dell'immagine, letta dal file immagine.
Le immagini devono essere scaricate con l'opzione di esplorazione opportuna (valore predefinito per una normale esplorazione di sito) affinché tale informazione possa essere raccolta.
Altezza immagine
L'altezza effettiva in pixel dell'immagine, letta dal file immagine.
Le immagini devono essere scaricate con l'opzione di esplorazione opportuna (valore predefinito per una normale esplorazione di sito) affinché tale informazione possa essere raccolta.
Byte
La dimensione dell'immagine in byte.
Dimensione file
La dimensione dell'immagine, espressa con un formato facile da leggere (in byte, o KB, o MB... a seconda dalla dimensione effettiva in byte).
Stato (immagine)
Il codice di risposta HTTP ricevuto dal web server in seguito alla richiesta del file immagine.
I codici di risposta si possono riepilogare con le seguenti cinque classi standard:
- 1xx Risposta informativa – la risorsa richiesta è stata ricevuta e il suo processamento continua (i codici 1xx non vi capiteranno praticamente mai)
- 2xx Successo – la risorsa richiesta è stata ricevuta con successo, compresa e accettata, e servita (è il codice di risposta vorresti vedere normalmente)
- 3xx Redirezione – la risorsa cercata non è più all'indirizzo richiesto
- 4xx Errore Client – la richiesta contiene un errore di sintassi o non può essere onorata
- 5xx Errore Server – il server non è riuscito a onorare una richiesta apparentemente valida
Codice di Stato (immagine)
Descrizione del codice di risposta HTTP ricevuto dal web server in seguito alla richiesta del file immagine.
Linea
La linea nel file HTML dove il tag immagine è stato trovato.
La cella è un link attivo; cliccandovi sopra si evidenzierà nel pannello laterale Contenuto o DOM (dipende da cosa sceglierai nel menu di contesto che apparirà) il tag immagine.
Posizione
La coordinata orizzontale nel file HTML dove il tag immagine è stato trovato.
La cella è un link attivo; cliccandovi sopra si evidenzierà nel pannello laterale Contenuto o DOM (dipende da cosa sceglierai nel menu di contesto che apparirà) il tag immagine.
Lista tag IMG: Menù di contesto
La tabella Lista tag IMG è provvista di un menù contestuale che puoi invocare cliccando con il tasto destro del mouse su una riga di pagina:
-
Copia URL pagina
Copia nella memoria degli appunti l'URL della pagina contenente il tag IMG selezionato. -
Naviga pagina
Naviga con il browser predefinito l'URL della pagina contenente il tag IMG selezionato. -
Copia URL immagine
Copia nella memoria degli appunti l'URL dell'immagine puntato dal tag IMG selezionato. -
Naviga immagine
Naviga con il browser predefinito l'URL tag IMG puntato dal tag IMG selezionato. -
Mostra nel codice
Seleziona il pannello laterale Contenuto e lì evidenzia il tag IMG. -
Mostra nel DOM
Seleziona il pannello laterale DOM e lì evidenzia il tag IMG. -
Ottimizza immagine...
Apre l'immagine puntata dal tag IMG con lo strumento "Ottimizza immagine".
Pagine per immagine
Supponi di dover rimuovere o ritagliare un'immagine, ti serve sapere quali pagine la usano. Questo è lo strumento di riferimento per scoprirlo. Raggruppa tutte la pagine per immagine usata in un tag img
.
Tag IMG per dominio
Questo report raggruppa tutte i tag img
per dominio - più precisamente per "proprietà", include protocollo e sottodomini - per permetterti di individuare facilmente tag img
per casi come:
- Tag IMG che puntano ancora un URL di immagine con il protocollo errato dopo una migrazione HTTP->HTTPS
- Tag IMG che puntano ancora un URL di immagine con il dominio errato dopo una migrazione di dominio
- Tag IMG che puntano a un URL in spazi temporanei come DropBox, che non sono concepiti per a molte richieste concorrenti così che gli utenti spesso potrebbero non visualizzare l'immagine
- Tag IMG che puntano a risorse esterne
- Tag IMG che puntano a sottodomini temporanei
Tag IMG per protocollo
Questo report raggruppa tutte i tag img
per protocollo, per permetterti di individuare facilmente tag img
che causano problemi di mixed content (ossia in un sito web HTTPS, alcune risorse sono servite con il non sicuro protocollo HTTP).
Tag IMG per codice di stato
Questo report raggruppa tutte i tag img
per Codice di Stato HTTP, includendo le risorse che non sono state esplorate.
Possibili chiavi di raggruppamento sono:
- Non scansionata - risorsa non visitata per vari possibili motivi: risorsa esterna, immagine Data URI, risorsa bloccata da robots.txt, etc.
- 1xx Risposta informativa – la risorsa richiesta è stata ricevuta e il suo processamento continua (i codici 1xx non vi capiteranno praticamente mai)
- 2xx Successo – la risorsa richiesta è stata ricevuta con successo, compresa e accettata, e servita (è il codice di risposta vorresti vedere normalmente)
- 3xx Redirezione – la risorsa cercata non è più all'indirizzo richiesto
- 4xx Errore Client – la richiesta contiene un errore di sintassi o non può essere onorata
- 5xx Errore Server – il server non è riuscito a onorare una richiesta apparentemente valida
Immagini distinte
Questa lista di URL univoci di immagini è particolarmente utile per ordinare le immagini per peso, per larghezza dell'immagine in pixel, e per altezza dell'immagine in pixel.
Affinché tali proprietà siano computate, l'opzione di esplorazione "Esplora immagini" deve essere stata selezionata prima della visita al sito.
Come in tutte le griglie di Visual SEO Studio, il contenuto della tabella può essere esportato usando il menu contestuale che si ottiene cliccando (su Windows) nell'angolo in alto a sinistra della tabella, o (su Mac) cliccando col tasto destro su di una qualsiasi cella della tabella.