Rendere le immagini di un sito web SEO friendly

Le risorse infografiche sono una componente fondamentale di un sito web moderno: rendono la pagina più interessante, colorata e iterattiva. È importante farne uso sia nei siti web vetrina che soprattutto negli e-commerce, dove mettere in mostra il proprio prodotto con immagini di impatto è un punto imprescindibile per incrementare le vendite. È necessario tuttavia prestare attenzione a diversi aspetti legati alle immagini, per questioni riguardanti l’accessibilità, la SEO, nonchè all’esperienza utente finale. Vediamo dunque quali sono le buone prassi per rendere un’immagine seo friendly.

Inserire testi all’interno delle immagini può essere utile ma allo stesso tempo è necessario considerare che non tutti possono accedere a quel contenuto, in particolare i crawler dei motori di ricerca. Per assicurare la massima accessibilità meglio riportare le informazioni importanti direttamente nell’html.

I motori di ricerca utilizzano il nome del file dell’immagine per identificarne il soggetto, per cui è molto importante dare un nome sensato alle proprie immagini e nel caso di siti web multilingua crearne ciascuno per ogni lingua definita e con il proprio nome tradotto. Questo aiuta l’indicizzazione delle immagini e migliora il posizionamento delle proprie pagine. Ad esempio, meglio preferire panorama-monte-bianco.jpg a IMG000001.jpg.

Questo punto è fondamentale sia per l’accessibilità che per la SEO, in quanto questo attributo descrive il contenuto dell’immagine, fornendo ai motori di ricerca informazioni circa il contenuto delle immagini. L’attributo alt inoltre fornisce importanti informazioni per utenti che hanno impedimenti visivi.

È importante cercare di essere il più descrittivi possibili, questo attributo non corrisponde ad un titolo ma ad un testo vero e proprio, dovrebbe quindi includere possibilmente tutti i dettagli dell’immagine. Meglio evitare di fare keyword stuffing sul valore di questo attributo, in quanto potrebbe portare a penalizzazioni lato SEO.

Esempio negativo:

Esempio intermedio:

Esempio ottimizzato:

Da evitare:

Sebbene non strettamente correlato alla SEO l’attributo title può risultare molto utili in termini di usabilità ed esperienza utente. Molti plugin che utilizzano le immagini per creare gallerie, slideshow o quant’altro utilizzano questo attributo per aggiungere la didascalia all’immagine, ovvero un titolo breve e rappresentativo. A differenza dell’attributo alt quest’ultimo non deve essere descrittivo ma fornire una sorta di slogan per l’immagine.

Se si dispone di un sito multilingua è molto importante prendersi cura di tradurre gli attributi alt e title, nonchè provvedere ad una copia del file con nome tradotto. Questa operazione, sebbene possa risultare noiosa e ripetitiva, è in realtà molto importante per avere una buona indicizzazione dei propri contenuti in lingue diverse.

I motori di ricerca tengono in considerazione i tempi di caricamento della pagine web, ritenendoli un fattore di ranking molto importante. Parallelamente, con l’aumento delle prestazioni di un sito web aumenta anche la qualità dell’esperienza utente, il quale ne uscirebbe frustrato da un caricamento lento di una pagina. Ecco perchè è necessario ottimizzare le immagini per il web, prestando attenzione alle dimensioni, al numero di pixel per pollice e al formato. A chiunque piacerebbe vedere immagini perfettamente nitide e definite nel proprio sito web ma è necessario considerare che gli utenti navigano nelle condizioni più disparate possibili, dallo smarphone in metropolitana fino alla connessione di casa, spesso lenta. Bisogna cercare il giusto compromesso tra qualità e dimensione, attuando alcuni espedienti:

• Preferire immagini jpeg a png nel caso di foto o comunque risorse che non richiedono livelli di trasparenza
• Considerare una dimensione massima di 800px (orizzontale o verticale) o in generale non inserire immagini più grandi del contenitore dell’elemento immagine o del contenitore del sito
• Considerare una densità di pixel per pollice di 72.000
• Creare diverse versioni della stessa immagine con dimensioni diverse, utilizzabili in contesti diversi. Ad esempio se si visualizza una griglia di immagini è preferibile mostrare una miniatura nella griglia per poi mostrare la relativa immagine grande nella visualizzazione di dettaglio
• Non superare i 500Kb di spazio su disco per immagine

Esistono diversi programmi, gratuiti e non, che si occupano dell’ottimizzazione delle immagini per il web. È opportuno dotarsi di questi strumenti e cercare di automatizzare il più possibile l’ottimizzazione delle immagini, in modo da velocizzare il processo.

Prendersi cura delle immagini inserite in un sito web è dunque uno dei passi fondamentali per l’ottimizzazione SEO e costituisce un fattore di ranking molto importante, oltre a fornire una migliore esperienza utente. Tutti i maggiori CMS, compresi Drupal e WordPress, permettono una facile e autonoma gestione di tutti gli aspetti analizzati in questo articolo.