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
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
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
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 privi di attributo ALT
    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.
    Immagini puramente decorative che non portano contributo alla missione della pagina possono essere lasciate con l'attributo alt 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'attributo src del tag IMG dovrebbe essere corretto.
    In caso di errore 5xx il problema dovrebbe essere investigato lato server.
  • Tag IMG privi di 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 HTMLPagina di origine
    Il pannello di destra Contenuto mostrerà il codice HTML della pagina web contenente il tag img selezionato.
    Altri pannelli ausiliari a livello di pagina alla destra o in basso mostreranno contenuti alla stessa pagina web.
  • ImmagineImmagine di destinazione
    Il pannello di destra Contenuto mostrerà un'anteprima del file immagine puntato dal tag img 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 Scegli colonne potrai visualizzare o nascondere colonne dalla tabella.

Esporta

Cliccando il bottone Export Esporta apparirà un menu a tendina con le seguenti opzioni:

  • Esporta in ExcelEsporta in Excel
    Permette di esportare il contenuto delle colonne visibili in un documento Excel.
  • Esporta in CSVEsporta in CSV
    Permette di esportare il contenuto delle colonne visibili in un file CSV.

Analisi delle ricerche

Cliccando il bottone Analisi delle ricerche 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 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 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.