Si seguono tante tecniche per ottimizzare un sito web, dalla link building, ai testi ottimizzati, alla velocità di caricamento al cms perfetto per la SEO e spesso i meno avvezzi all’ottimizzazione lasciano in disparte le immagini.
Ci si dimentica spesso dei motori verticali di Google, cioè quei motori secondari che Big G mette a disposizione per effettuare le ricerche.
Prendiamo il caso di una sposa che vuole cercare ispirazione per l’abito più importante della sua vita. Andrà sicuramente su Pinterest o userà il motore Google Immagini per soddisfare le sue richieste.
Le immagini che Google Images mostrerà non saranno messe li a caso, ma verranno mostrate da Google perché sono state ottimizzate da un bravo SEO.
Quindi, se sei interessato ad ottenere dei buoni risultati non dimenticare mai di ottimizzare le immagini prima di pubblicarle sul tuo sito.
Semplici passaggi possono migliorare il tuo posizionamento e adesso ti spiego come.
1. Il nome dell’immagine
La macchinetta fotografica salva il file JPG con un nome sequenziale per comodità ma caricare l’immagine in questo modo in un post o su una pagina web del sito web di certo non aiuta i motori di ricerca a trovarti.
Tornando alla ragazza che sta cercando il suo abito da sposa, dobbiamo assolutamente aiutarla. Una buona abitudine per sapere come rinominare le proprie immagini prima di usarle per il web è quello di “spulciare” Analytics e controllare come i visitatori arrivano sul nostro sito o blog.
- Abito Sposa rosso
- Abito da sposa brand
- Abito sposa bianco con pizzo
Oltre che inserire le parole chiave nel testo, queste dovrebbero essere utilizzate per rinominare le immagini e cercare di posizionarle.
2. Alt e dimensioni. Usali bene
Il testo alternativo che viene mostrato quando l’immagine per qualche problema non viene caricata o quando si passa il mouse sulla foto è un altro metodo per ottimizzare le immagini.
L’aggiunta di opportuni tag alt per le immagini del tuo sito web può aiutare a migliore il posizionamento nei motori di ricerca nelle ricerche organiche e soprattutto nelle ricerche verticali.
Ma come deve essere scritto il codice per il tag alt?
<img src=”abito-sposa-pizzo-bianco.jpg” alt =”Abito da Sposa per la collezione 2013”>
Descrivi l’immagine come la descriveresti a voce. Non forzare le parole chiave per non incappare in penalizzazione da sovra ottimizzazione. Per ottenere un risultato ottimale invece di sovra ottimizzare una sola immagine, puoi inserire più immagini nello stesso articolo o pagina.
Sempre per aiutare la nostra amica che sta cercando un abito da sposa, potresti inserire la foto dell’abito integrale e poi i vari dettagli dell’abito con i relativi ALT Tag descrittivi per includere altre parole chiave.
<img src=”coda-abito-sposa-2013.jpg” alt =”Uno strascico di pizzo per un abito da sogno”>
<img src=”copri-spalla-abito.jpg” alt =”Il copri spalla per entrare in chiesa”>
Oltre che a fornire al cliente tutti i possibili dettagli del lavoro che andremo a fare per raggiungere l’obiettivo, stai fornendo anche a Google dei dati aggiuntivi e per questo ti premierà sicuramente.
Altra accortezza per gestire al meglio le immagini del sito web è applicare l’altezza e la larghezza al codice html.
<img src=”coda-abito-sposa-2013.jpg” alt =”Uno strascico di pizzo per un abito da sogno”> width=”90″ height=”190″ />
Questo permette al browser che sta caricando la pagina di sapere in anticipo quanto è grande l’immagine che sta per essere mostrata e non scoprirlo solamente alla fine, accelerando il caricamento della pagina stessa.
3. Grande è bello…però!
E’ vero che un’immagine grande rende molto meglio l’idea e colpisce, però è anche vero che più è grande più tempo ci vuole. L’errore più comune è quello di inserire immagini molto grandi e poi ridimensionarle tramite codice HTML.
Perché è sbagliato inserire immagini molto grandi? Il problema è che la velocità di caricamento di una pagina è un fattore che Google tiene molto in considerazione in un sito web e i lettori non aspettano oltre i 3 secondi il caricamento completo di una pagina web.
Il consiglio è quello di caricare l’immagine ridotta per farla pesare poco e quindi permettere il caricamento veloce della pagina e linkare l’immagine magari utilizzando anche un effetto realizzato con Jquery o CSS.
4. Quanto grande?
Abbiamo capito che grande è bello ma non efficace. Ma quanto deve essere pesante un’immagine per non creare problemi durante il caricamento di una pagina web?
Ormai con le ADSL i problemi di caricamento non ci sono più, posso caricare immagini di qualsiasi peso. E il mobile?
A parte che le ADSL così veloci sono ancora poche, ma poi non pensi a chi naviga da tablet o smartphone? Guarda che sono in continua crescita, quindi torniamo a ottimizzare anche il peso delle immagini come se si navigasse con il modem 56k.
Un file di 70Kb potrebbe essere più che sufficiente, poi come già detto se vogliamo fornire l’immagine più grande possiamo linkarla e farla aprire su una pagina a parte o in una box in sovraimpressione.
5. Quale è il formato giusto?
I formati file per il web li conosciamo bene tutti, sono il Gif, il Jpeg e il Png, ma quali tra questi è il migliore per il web? Io continuo a sostenere il JPEG almeno che la mia immagine non debba contenere trasparenze, in quel caso punterei sul formato PNG.
Potrei suggerire, leggendo le linee guida di Google, di utilizzare i formati così:
- Immagini di illustrazioni piane, per esempio vignette
utilizzare il formato PNG o GIF a 8 bit - Immagini grandi e dettagliate
utilizzare il formato JPG e PNG a 24 bit
Ma se quindi le immagini devono essere “piccole” e “leggere” ma Google preferisce immagini di grandi dimensioni come posso fare? Questo è il dilemma. Allora, Google preferisce i siti che si caricano in pochi secondi ma predilige le immagini “in alta risoluzione”.
Possiamo ovviare in questo modo. Nel post o nella pagina web del nostro bellissimo abito da sposa possiamo caricare le immagini di piccole dimensioni e con una risoluzione “ottimizzata per il web”.
Questa immagine come abbiamo detto punterà con un link a quella in HD, magari salvata in una directory diversa. E Google come fa a scovarla? Possiamo aiutarci con una sitemap per immagini.
Per aiutare Google a scovare immagini che non sono contenute in una pagina web, possiamo creare una sitemap per immagini e poi sottoporla tramite Webmaster Tools. Ecco un esempio di Sitemap per immagini:
<?xml version=”1.0″ encoding=”UTF-8″?>
<urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″
xmlns:image=”http://www.google.com/schemas/sitemap-image/1.1″>
<url>
<loc>http://www.miosito.it/collezione-2013.html</loc>
<image:image>
<image:loc>http://www.miosito.it/collezione-2013/abito-sposa-pizzo-bianco.jpg</image:loc>
<image:title>Abito da sposa per la collezione 2013</image:title>
</image:image>
</url>
</urlset>
Image:title è una riga facoltativa, ma se vogliamo fornire un servizio completo dobbiamo fare uno sforzo in più.
Adesso che sai come ottimizzare le immagini per il web, non hai voglia di andare a ricontrollare tutti i tuoi file per vedere se stai lavorando nel modo giusto?