Come ottimizzare le immagini per il web in ottica SEO

Anche le immagini, per poter essere mostrate nei risultati di ricerca, devono rispettare alcuni requisiti tecnici specifici. A differenza dei contenuti testuali, richiedono accorgimenti particolari perché vengano scoperte e comprese dai motori di ricerca. Il modo in cui le immagini sono integrate nella pagina, così come la struttura del sito, può incidere direttamente sulla loro indicizzazione e sulla possibilità di essere associate alle giuste parole chiave.

Inserire correttamente le immagini nel codice HTML

Per fare in modo che le immagini del tuo sito vengano trovate e indicizzate dai motori di ricerca, è importante usare il tag HTML corretto. Il metodo consigliato è incorporare le immagini direttamente con il tag img specificando il percorso nel parametro src.

Google non considera le immagini inserite tramite CSS (ad esempio come sfondi), quindi queste non contribuiscono alla SEO delle immagini.

<img src="puppy.jpg" alt="Un cucciolo di golden retriever" />

<div style="background-image:url(puppy.jpg)">Un cucciolo di golden retriever</div>

Per migliorare la visibilità delle immagini su Google, puoi usare una Sitemap dedicata alle immagini. Questo strumento permette a Google di rilevare anche file che altrimenti potrebbero sfuggire alla scansione.

A differenza delle sitemap standard, quella per le immagini consente di inserire URL provenienti da altri domini, come nel caso delle immagini ospitate su una rete CDN (Content Delivery Network). Se utilizzi una CDN, è consigliabile verificare il dominio in Google Search Console per ricevere eventuali notifiche sugli errori di scansione.

Immagini responsive: come adattarle ai dispositivi

a realizzazione di siti adattabili è fondamentale per offrire un’esperienza fluida su ogni dispositivo, dallo smartphone al desktop. Per gestire correttamente le immagini responsive, puoi usare i tag HTML dedicati:

<img srcset="immagine-320w.jpg 320w, immagine-480w.jpg 480w, immagine-800w.jpg 800w" sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px" src="immagine-800w.jpg" alt="Descrizione dell’immagine">

<picture> <source type="image/webp" srcset="immagine.webp"> <source type="image/jpeg" srcset="immagine.jpg"> <img src="immagine-di-riserva.jpg" alt="Testo alternativo descrittivo"> </picture>

Questo approccio permette di ottimizzare le prestazioni, servendo immagini più leggere ai dispositivi mobili e mantenendo comunque alta la qualità visiva.

Formati di immagine compatibili con Google

Per essere sicuro che le tue immagini vengano indicizzate correttamente nella Ricerca Google, è importante utilizzare formati di file supportati. Tra i principali ci sono:
BMP, GIF, JPEG, PNG, WebP, SVG e AVIF.

Assicurati che l’estensione del file sia coerente con il suo contenuto (ad esempio, un file JPEG non dovrebbe avere l’estensione .png).

Incorporare immagini tramite URI

Un’alternativa è quella di inserire immagini direttamente nel codice HTML usando gli URI di dati (Data URI). Questo approccio permette di incorporare l’immagine come una stringa codificata in Base64, all’interno dell’attributo src del tag img.

<img src="data:image/svg+xml;base64,[dati_base64]" /> 

L’uso di immagini incorporate può ridurre le richieste HTTP, migliorando la velocità di caricamento per piccole immagini. Tuttavia, attenzione: se le immagini sono grandi o numerose, l’aumento del peso complessivo della pagina può penalizzare le prestazioni in termini di caricamento pagina.

Quando si parla di immagini sul web, qualità e leggerezza devono andare di pari passo. Le foto ad alta definizione sono più accattivanti e possono aumentare il tasso di clic, soprattutto quando vengono mostrate come anteprime nei risultati di ricerca.

Tuttavia, immagini troppo pesanti possono rallentare il caricamento della pagina, influendo negativamente sull’esperienza utente e sul posizionamento. Per questo è fondamentale applicare le tecniche più aggiornate di ottimizzazione e sfruttare strumenti per la gestione delle immagini responsive.

L’importanza delle pagine in cui l’immagine è inserita

Anche se non sempre evidente, il contesto in cui è collocata un’immagine ha un ruolo cruciale per la sua visibilità nei risultati di Google.

Se una pagina contiene testi pertinenti, titoli coerenti e metadati ben scritti, Google sarà più propenso a mostrare quell’immagine nella SERP, magari proprio come miniatura associata al risultato.

Titolo e descrizione contano

Quando Google visualizza una pagina nei risultati, genera automaticamente il titolo cliccabile (tag title) e una descrizione (snippet tag description) che riassume il contenuto. Entrambi gli elementi aiutano l’utente a capire se il contenuto è rilevante rispetto alla propria ricerca.

Per far emergere le immagini del tuo sito nei risultati avanzati di Google Immagini, è fondamentale implementare correttamente i dati strutturati. Queste informazioni, inserite nel codice della pagina, permettono a Google di comprendere meglio il contenuto e, se ben configurate, possono attivare elementi extra come i badge informativi visibili direttamente nei risultati.

Assicurati di rispettare sia le linee guida generali di markup, sia quelle specifiche in base al tipo di contenuto (ricette, prodotti, articoli, ecc.). In quasi tutti i casi, è necessario indicare esplicitamente l’immagine tramite un attributo obbligatorio all’interno del markup.

Per aiutare i motori di ricerca a comprendere meglio le immagini del tuo sito (e per migliorare accessibilità e visibilità nella SERP), è essenziale prestare attenzione a nome file, didascalie e attributo alt.

<img src="cucciolo-dalmata.jpg" alt="Cucciolo dalmata che gioca nel prato">

<img src="IMG0001.jpg" alt="">

<img src="cucciolo.jpg" alt="cucciolo cane cagnolino cucciolo dolce tenero cucciolo carino cagnolino cane retriever">

<img src="cucciolo.jpg" alt="Cucciolo di golden retriever che dorme su una coperta">

<svg aria-labelledby="svgtitle1"> <title id="svgtitle1">Robot Googlebot che cucina pancake</title>
</svg>

Se non vuoi che le immagini a dimensione intera vengano visualizzate nei risultati di Google Immagini, puoi limitare l’accesso disattivando il collegamento diretto.

Per farlo:

• Verifica l’intestazione HTTP del referrer ogni volta che un’immagine viene richiesta.
• Se il dominio di origine appartiene a Google, restituisci un codice di stato HTTP 200 o 204 senza includere il contenuto dell’immagine.

In questo modo, Google continuerà a rilevare e indicizzare l’immagine, ma nei risultati mostrerà solo una miniatura temporanea creata durante la scansione. Non si tratta di una pratica di cloaking e non comporta penalizzazioni manuali.

Se preferisci, puoi anche escludere completamente l’immagine dai risultati di ricerca, utilizzando le impostazioni adeguate nel tuo file robots.txt o attraverso tag noindex.

SafeSearch è una funzionalità che consente agli utenti di filtrare o oscurare contenuti espliciti (come immagini o video sensibili) nei risultati di ricerca su Google. Per assicurarti che il tuo sito venga gestito correttamente da questo filtro, è fondamentale che Google comprenda con precisione il tipo di contenuti che offri.

Se i tuoi contenuti possono essere soggetti a restrizioni, assicurati di applicare correttamente le etichette e i metadati previsti dalle linee guida ufficiali. In questo modo, Google sarà in grado di applicare i filtri SafeSearch in modo coerente con la natura del tuo sito.