SEO: come ottimizzare le immagini

Ottimizzare le immagini in un sito web, è uno degli aspetti più importanti per quanto riguarda l’attività di SEO (ottimizzazione per i motori di ricerca) on-site.
Vediamo come procedere e quali strumenti utilizzare.

Ottimizzare le immagini (SEO): come scegliere le immagini giuste da inserire sui nostri post

Ottimizzare le immagini: come scegliere

Sottovalutare l’importanza delle immagini in una pagina web è un grave errore, sia per quanto riguarda l’aspetto legato all’ottimizzazione per i motori di ricerca (SEO), sia, e soprattutto, per quello relativo all’esperienza degli utenti: non dimentichiamo che le immagini portano benefici alle persone che leggono un contenuto.

Spesso i blogger (o comunque chi si occupa dei contenuti sui siti web) non danno importanza alla scelta delle immagini: tale fattore, però, potrebbe determinare il successo di un post.

 

Quale emozione vogliamo suscitare?

Ottimizzare le immagini (SEO): è consigliabile inserire nei nostri articoli delle immagini che stimolano emozioni positive per mettere gli utenti a proprio agio.

Ottimizzare le immagini: sensazioni positive

Il primo aspetto da valutare per la scelta delle immagini per un articolo è l’emozione che vogliamo indurre nei lettori. Provate a pensare a cosa accade appena aprite una pagina web… credo che valga per tutti lo stesso schema: prima le immagini, poi il testo.

Le immagini, infatti, catturano immediatamente l’attenzione e suscitano delle emozioni che condizionano le azioni dei lettori.
Proprio per questo motivo, è utile inserire nel testo immagini coerenti ai contenuti e capaci di portare il lettore a sviluppare delle sensazioni positive che lo facciano sentire a proprio agio.

Metaforicamente, possiamo associare  l’accesso al sito web di un utente, al momento in cui una persona entra in in un negozio per  la prima volta: più l’ambiente che trova sarà accogliente, e più aumenteranno le probabilità di acquisto e di ritornare in futuro.

Immagini, ad esempio, di bambini che sorridono possono aiutare a stimolare tenerezza e serenità nei lettori; immagini di persone che esultano, favoriranno l’aumento di energia interiore. Eviterei di utilizzare fotografie “sgradevoli“, o comunque che possono far scaturire emozioni negative, per non far fuggire gli utenti e per non generare un’aumento della frequenza di rimbalzo (la percentuale di utenti che non vanno oltre la prima pagina visitata).

 

Come ottimizzare le immagini in ottica SEO

L’ottimizzazione delle immagini di un sito web e dei tag HTML ad esse connessi, oggi, è fondamentale per un buon posizionamento sui motori di ricerca. Non posso ancora affermare che le immagini abbiano la stessa importanza del testo in un articolo, ma il fatto che statisticamente le “foto-notizie” ricevono più attenzione (CTR / condivisioni / like) di quelle testuali, fa riflettere per il futuro.

Nei punti successivi vediamo quali sono le migliori azioni per l’ottimizzazione perfetta.

 

L’attributo ALT del tag IMG

Ottimizzare le immagini (SEO): come migliorare l'attributo ALT dei tag IMG

Ottimizzare le immagini: l’attributo ALT

ALT sta per “testo alternativo” ed indica l’elemento HTML da associare alle parti non testuali dei contenuti (principalmente le immagini) per fornirne una descrizione, nel caso in cui non potessero essere visualizzate.

Il fatto di saper sfruttare in maniera ottimale l’attributo ALT delle immagini ha molti vantaggi.

  • Il più noto ed immediato è il consolidamento del contenuto testuale dell’articolo.
  • Non sottovalutiamo il fatto di essere trovati su Google Immagini: l’ALT, è infatti, uno degli elementi utilizzati da Google per classificare le immagini.
  • Il vantaggio meno noto è forse il più importante: l’accessibilità delle pagine web. L’attributo ALT, infatti, è l’interpretazione delle immagini da parte dei lettori vocali per non vedenti.

Come deve essere il testo alternativo?
Consiglio di inserire, dove possibile, la parola chiave da valorizzare nel contenuto(una regola di base per la SEO on-site) e di creare dei testi altamente descrittivi.
Nel caso in cui un’immagine non fosse del tutto pertinente con la keyword, si può ricorrere ad una tecnica che spiegherò con un esempio.  Se la keyword da valorizzare in un contenuto fosse “mele” e, per qualche motivo, dovessi inserire una immagine di pere, potrei creare un testo alternativo del tipo: “Vendiamo magnifiche mele, ma anche queste deliziose pere“. In questo modo otterrei un testo alternativo coerente all’immagine ed al testo, e contenente la parola chiave

 

Il nome del file

Ottimizzare le immagini (SEO): perché il nome del file è importante per il posizionamento?

Ottimizzare le immagini: il nome del file

I nomi dei file delle immagini devono essere “parlanti“, ovvero costruiti in maniera da fornirne una ulteriore descrizione (senza esagerare con la lunghezza); i motori di ricerca, infatti, rilevano anche questi dati. Diciamo che la regola è la medesima degli “slug” delle pagine web: parole separate da un trattino (“-“).
E’ meglio non utilizzare spazi sui nomi dei file utilizzati sulle pagine web perché negli URL lo spazio viene sostituito dalla stringa “%20“, rendendo l’URL meno mnemonico e meno immediato.

Consiglio di inserire la parola chiave che ci interessa valorizzare nel nome del file delle immagini contenute negli articoli.

Un esempio
Inserire immagini nominate in questo modo IMG_5216.JPG (ovvero i tipici nomi che le fotocamere assegnano alle fotografie) ha poco senso in ottica SEO. E’ molto meglio utilizzare nomi del tipo come-ottimizzare-immagini-seo.jpg.

 

Le dimensioni del file

Ottimizzare le immagini (SEO): tecniche e strumenti per migliorare le dimensioni delle immagini

Ottimizzare le immagini: dimensione dei file

In che modo la dimensione di una o più immagini può influire sul posizionamento? La risposta è semplice: più aumentano le dimensioni delle immagini, più andrà a diminuire la velocità di apertura delle pagine web; è noto che la velocità di apertura delle pagine web è uno degli elementi che determinano il posizionamento sui motori di ricerca.

Uno degli errori più diffusi è quello di utilizzare immagini molto grandi e non ottimizzate, e di impostare delle dimensioni inferiori attraverso gli attributi “height” e “width” del tag IMG sulle pagine html.
Il risultato di tale gestione è il rallentamento dell’apertura delle pagine web, senza una apparente motivazione.

Vediamo un esempio.
Se io inserissi in una pagina web una immagine 1260 x 1050 pixels, avente dimensioni di 3MB con la seguente sintassi,

<img src=”/la-mia-immagine.jpg” alt=”La mia immagine” title=”La mia immagine” width=”100″ height=”63″ />

sulla pagina web verrebbe visualizzata come segue (100 x 63 px, ovvero le dimensioni indicate dagli attributi del tag IMG):

Ottimizzare le immagini (seo): le dimensioni dei file

 

Il problema è che il browser, per poterla visualizzare, dovrà scaricare 3MB di dati. Una immagine di questo tipo (quella in figura), ottimizzata può avere dimensioni inferiori anche di mille volte, velocizzando enormemente l’apertura della pagina web.

Come ridurre le dimensioni delle immagini?
I software di elaborazione digitale delle immagini più prestigiosi come Adobe Photoshop contengono delle funzionalità specifiche per ri-dimensionare ed ottimizzare le immagini per il web, ma vorrei consigliare uno strumento gratuito e completamente web based: PIXLR.
Pixlr, consente di eseguire ogni tipo di lavorazione sulle immagini, è utilizzabile su tutti i dispositivi, grazie alle applicazioni per Android ed Apple, ed è disponibile anche come estensione per i browser Firefox e Google Chrome. Possiamo dire che è un Photoshop disponibile via web. Per i tecnici, per comprendere la potenza del software, pensiamo che è in grado di aprire ed editare file psd a livelli.

Suggerisco anche due strumenti molto utili in grado di verificare il miglioramento delle prestazioni del sito dopo l’ottimizzazione:

 

I tag Exif

Ottimizzare le immagini (SEO): i motori di ricerca leggono i tag Exif, quindi possiamo sfruttarli per un posizionamento migliore

Ottimizzare le immagini: i tag Exif

I tag Exif (Exchangeable image file format) sono dei metadati che caratterizzano le immagini e che vengono interpretati dai motori di ricerca. E’ anche grazie a tali dati che Google Immagini riesce a filtrare i risultati. Un esempio, è il nuovo filtro per “Diritti di utilizzo” che va a leggere il metadato relativo al copyright.

Andiamo a vedere in dettaglio l’insieme delle informazioni a disposizione.

  • Informazioni di Data ed Ora,
  • dati sulle impostazioni della fotocamera che ha creato l’immagine,
  • una piccola anteprima,
  • descrizioni ed informazioni sul copyright.

Per comprendere meglio il funzionamento dei tag Exif, possiamo fare una analogia con i più noti tag che caratterizzano i file MP3, contenenti l’artista, il titolo del brano, l’album, l’anno, il genere,ecc.. Questi tag, vengono poi utilizzati dai player per dare le informazioni sulle tracce, ma anche per creare dei filtri di ricerca dei brani.

Attualmente non tutti i motori di ricerca sono in grado di interpretare i tag Exif, ma è bene essere pronti nel momento in cui saranno determinanti. Esistono dei software dedicati per modificarli ed ottimizzarli, ma suggerisco di utilizzare i più noti Adobe Photoshop o Google Picasa.

 

L’attributo TITLE del tag IMG

Abbiamo parlato solo del testo alternativo dell’immagine, ma non del TITLE. Ci sono pareri discordanti sulla preferenza dei motori di ricerca tra i due attributi.

 Io consiglio, comunque, visto che non costa fatica, di utilizzarli entrambi, anzi di sfruttare il TITLE come ulteriore possibilità di caratterizzare le immagini.

 

L’utilizzo delle didascalie

Il testo che “circonda” l’immagine contribuisce a contestualizzarla, fornendo una ulteriore fonte di contenuti che i motori di ricerca utilizzeranno per “decifrarne” il contenuto. Per questo motivo, suggerisco di fare sempre uso delle didascalie a supporto delle immagini.

 

Sitemap

Ottimizzare le immagini (SEO): possiamo creare una Google Sitemap dedicata alle immagini per favorirne il posizionamento

Ottimizzare le immagini: la Google Sitemap

Come sappiamo, le Sitemap sono un elemento indispensabile per l’ottimale cooperazione tra un sito web ed i motori di ricerca. Google, attraverso una sintassi ad hoc, permette di creare una sitemap specifica per le immagini.
Il seguente esempio di sitemap è stato prelevato dalla documentazione ufficiale disponibile su Strumenti per i Webmaster.

I dati che compongono il nodo che definisce l’immagine sono i seguenti:

  • <image:image>: tutte le informazioni sull’immagine (il tag contenitore);
  • <image:loc>: l’URL dell’immagine;
  • <image:caption>: la didascalia dell’immagine;
  • <image:geo_location>: la località geografica dell’immagine;
  • <image:title>: il titolo dell’immagine;
  • <image:license>: un URL alla licenza dell’immagine.

 

<?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://example.com/sample.html</loc>
               <image:image>
                    <image:loc>http://example.com/image.jpg</image:loc>
            </image:image>
       </url>
</urlset>

 

Per gli utilizzatori di WordPress

Ottimizzare le immagini (SEO): vediamo i plugin di WordPress per ottenere un miglioramento di prestazioni

Ottimizzare le immagini: plugin di WordPress

Aggiungo una parentesi per gli utilizzatori di WordPress, suggerendo alcuni interessanti plugin per l’ottimizzazione delle immagini.

SEO Friendly Images

Un plugin dalla configurazione semplicissima, ma che offre ottimi risultati. Permette di impostare delle regole di auto generazione degli attributi ALT e TITLE di tutte le immagini del sito web. I tag a disposizione per la creazione delle regole sono %title (il titolo del post), %name (il nome del file senza estensione), %category (la categoria del post), %tags (i tag associati al post).
Per chi desidera approfondire, ho creato una  mini recensione su Medium.

WP Smush.it

Un componente fondamentale per chi non ottimizza i file delle immagini prima dell’upload. Il plugin si occupa, infatti, del miglioramento dei file riducendone le dimensioni, per un conseguente aumento della velocità di apertura delle pagine web. Interviene su vari aspetti: comprime i file JPEG e riduce i metadati non sfruttati, converte il formato GIF in PNG “indexed” per aumentare le prestazioni, rimuove i colori non utilizzati per ridurre le dimensioni.
Per chi desidera approfondire, ho creato una  mini recensione su Medium.

W3 Total Cache

Un plugin che non è direttamente rivolto alle immagini, ma è un elemento che non può mancare quando si parla di ottimizzazione per aumentare la velocità di un sito web in WordPress. W3TC, infatti, è un sistema di gestione della cache delle pagine, del database e del browser. Permette inoltre, attraverso la funzione “minify“, di comprimere il codice.
Per chi desidera approfondire, ho creato una  mini recensione su Medium.

Per ottenere altre informazioni sull’ottimizzazione di WordPress, consiglio il seguente post: Rendere SEO WordPress: consigli per l’ottimizzazione.

 

Loading Facebook Comments ...