il valore dell'immagine in un sito web

Nell’anno 2020 avremo più cura delle immagini?

22 Gen 2020    Giacomo Marzolla    23 Gen 2020 10:57 am

Nell’anno 2020 anche le immagini hanno il loro valore, non lo dico solo io piccolo web master di provincia, ma lo dice niente poco di meno che John Muller. Quindi non limitarti esclusivamente a inserirle nella pagina, ma cura alcuni aspetti che possono migliorare l’esperienza dell’utente, che visita la tua pagina web.

  • Inserisci le immagini giuste in giusto contesto e solo se possono aggiungere valore alla pagina, se possibile posizionale vicino al testo pertinente.
  • Non inserire testo sull’immagine, ma utilizza l’attributo alt per inserire un testo descrittivo alternativo.
  • Qualità, qualità e ancora qualità nei contenuti che scrivi, Google tiene conto della qualità della pagina quando genera l’anteprima dell’immagine.
  • Chiaramente il sto deve essere correttamente visibile da tutti i device
  • Non usate i numeri, dai un nome significativo al file

Cura il titolo e la descrizione della pagina

Anche per le immagini Google genera automaticamente titolo e breve snippet descrittivo, per spiegare meglio ogni risultato.
Chiaramente utilizza diverse fonti per generare queste informazioni, tra cui i meta tag della pagina web.

Utilizza i dati strutturati

Includendo i dati strutturati, puoi migliorare i tuoi risultati di ricerca rendendoli più appetibili all’utente e fornendo una miglior risposta, cosi da raccogliere un traffico più mirato al tuo sito.

Google immagini supporta i dati strutturati per:

  • Prodotti
  • Video
  • Ricette

Se sei interessato e vuoi scoprirne di più, leggi articolo dedicato ai dati strutturati. In un video di Giorgio Tave, mostra una ricerca dove solo il 14% dei siti hanno i dati strutturati. Questo fa capire com’è bassa la qualità dei siti ad oggi.

Ottimizzare la velocità

Le immagini sicuramente incidono parecchio nel caricamento complessivo di una pagina, quindi ottimizzatale al massimo mantenendo sempre una buona qualità, poi se hai un sito basato su WordPress, ci sono diversi plugin per convertire le immagini nei nuovi formati, ne gioverà anche il Pagespeed.

Includi titoli esplicativi, didascalie, testo e nomi di file per le immagini

Come accennato prima, Google estrae le informazioni sull’immagine dal contenuto della pagina, dal titolo e sottotitolo. Valuta la posizione dell’immagine se possibile posizionala vicino al testo che la contestualizza.

È molto importante il nome del file, può fornire a Google indizi sull’argomento dell’immagine. Ad esempio se c’è un’immagine che rappresenta un tramonto sul mare, nel nome file puoi scrivere tramonto-sul-mare.jpg, rispetto a img-039484988.jpg.

Utilizza anche il testo alternativo

Nell’attributo alt del tag img inserisci un breve testo descrittivo, migliora l’accessibilità agli utenti che non riescono a visualizzare l’immagine all’interno della pagina web, gli utenti che usano gli screen reader o utenti che hanno una banda di connessione molto limitata.

Chiaramente ci sono alcuni accorgimenti da seguire per inserire un buon testo alternativo, deve essere un contenuto di media lunghezza che sia in un contesto appropriato rispetto alla pagina e che non venga riempito di inutili parole chiavi, rischieresti di essere valutato come spam da Google.

Ti mostro un esempio di testi alternativi a confronto:

  • <img src=”tramonto-sul-mare.jpg”> (Testo alternativo mancante)
  • <img src=”tramonto-sul-mare.jpg” alt=”Un bellissimo tramonto sul mare consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.”> (Testo alternativo pieno di parole chiavi)
  • <img src=”tramonto-sul-mare.jpg” alt=”tramonto sul mare”> (Testo alternativo sufficente)
  • <img src=”tramonto-sul-mare.jpg” alt=”un bellissimo tramonto sul mare di Maratea”> (Testo alternativo efficace)

Metti in condizione Google di far scoprire tutte le tue immagini

Utilizza il giusto markup semantico per le immagini, Google analizza HTML delle tue pagine e le indicizza, ma non indicizza le immagini inserite come background nel div tramite css.

Indicizzabile <img src=”tramonto-sul-mare.jpg” alt=”un bellissimo tramonto sul mare di Maratea” />

Non indicizzabile <div style=”background-image:url(tramonto-sul-mare.jpg)”>Tramonto sul mare</div>

Crea le sitemap immagini

Creando una sitemap immagini, permetti a Google di trovare quelle immagini che probabilmente non troverebbe, le sitemap immagini rispetto alle normali sitemap possono contenere url con altri domini, questo permette di utilizzare CDN per ospitare le immagini.

Utilizza immagini adatte per i vari dispositivi

Come ben saprai oramai i siti web sono fruibili da una moltitudine, quindi le immagini si devono adattare ai vari dispositivi. All’interno delle pagine web si può utilizzare srcset un’attributo del tag <img> oppure il tag <picture> per specificare diverse immagini in base ai dispositivi. Tutta via ci sono sempre i browser più anziani che non supportano tali attributi o tag e quindi è buona norma specificare sempre un’immagine di default tramite l’attributo src.