Esperimento SEO: immagini nel Responsive Web Design

A seguito del workshop di Andrea De Carolis sulle immagini nel Responsive Web Design ho provato ad effettuare un esperimento SEO ai fini di comprendere quale elemento grafico viene indicizzata meglio da Google, nella SERP dedicata alle immagini.

Molti consulenti SEO infatti provano a posizionare meglio le immagini, sfruttando un utile espediente per raggiungere più utenti, attraverso Search alternative e, in alcuni casi, meno competitive.

Le immagini nel responsive Web Design

I tag dedicati al responsive web design permettono di ottimizzare il layout di un sito internet per i diversi dispositivi con cui viene visualizzato. Utilizzando alcuni attributi del tag IMG o il tag PICTURE possiamo definire quale immagine far visualizzare quando l'utente utilizza un determinato device.
Così facendo dobbiamo però creare diverse immagini, di dimensioni e risoluzione diversa, ottimizzandole in funzione del dispositivo su cui vorremo farle visualizzare. Possiamo così scegliere delle immagini leggere e di minore dimensione (sia in termini di pixel/risoluzione che di dimensione e peso in kb) per i dispositivi mobile, come smartphone e table, e immagini più grandi per la visualizzazione su dispositivi desktop come computer e notebook.

Come ho condotto l'esperimento SEO

Per effettuare questo veloce esperimento ho creato due articoli, uno scritto mediante l'editor di Wordpress, di carattere più generale e per spiegare quel che ho imparato durante il workshop e all'interno del testo ho inserito un capitolo dedicato ad un mio interrogativo su quale elemento grafico verrà indicizzata da Google, nella SERP dedicata alle immagini. Questo articolo ha un link ad una pagina html, impaginata in maniera pietosa e decisamente brutale con un layout anni 1990 (ma in html5), priva di contenuto se non una immagine in cui il tag IMG ha gli attributi sizes e srcset, dedicati al responsive web design. Mediante questi attributi la pagina fornisce una immagine diversa in funzione della risoluzione con cui viene visualizzata.
Le diverse immagini sono identiche, se non per una label, in modo da comprendere quale di queste immagini "piace di più" a Big G.

Le immagini che ho utilizzato:

Ho creato tre immagini a partire da una foto, ottimizzando la dimensione per tre diversi dispositivi: smartphone, tablet e computer. Per riconoscerle ho inserito una label "esperimento SEO - RWD 1" per quella dedicata ai tablet e "esperimento SEO - RWD 2" per quella dedicata agli smartphone.

Il codice HTML con gli attributi dedicati al RWD della pagina esperimento:

Il codice html utilizzato per incorporare l'immagine, nella pagina approntata per l'esperimento, è il seguente:

<img sizes="(max-width: 480px) 100vw, (max-width: 600px) 100vw, (max-width: 1200px) 100vw"
srcset="https://www.posizionamento-seo.com/wp-content/uploads/2015/09/seo-responsive-web-design-esperimento-small.jpg 320w,
 https://www.posizionamento-seo.com/wp-content/uploads/2015/09/seo-responsive-web-design-esperimento-medium.jpg 640w,
 https://www.posizionamento-seo.com/wp-content/uploads/2015/09/seo-responsive-web-design-esperimento.jpg 1280w"
src="https://www.posizionamento-seo.com/wp-content/uploads/2015/09/seo-responsive-web-design-esperimento-small.jpg"
alt="seo responsive web design esperimento">

I risultati dell'esperimento SEO per le immagini nel RWD

A distanza di una settimana ho provato ad effettuare una ricerca su Google Immagini, con una finestra nascosta del mio browser, per la parola chiave "seo responsive web design esperimento" e questo è il risultato che mi è comparso: Google, delle tre immagini fornite ha indicizzato solo quella più piccola, definita come immagine standard mediante attributo html src, dedicato ai browser (e a quanto pare allo spider di Google) che non riescono ad interpretare gli attributi sizes e srcset.

Immagine nella SERP di Google

Come possiamo notare, nella figura a seguire, in prima posizione è stata indicizzata l'immagine con il label "Esperimento SEO - RWD 2", definita come immagine standard mediante l'attributo src.

Dato che l'immagine ha dimensioni 280x187 px è ovvio che se andiamo a segmentare la ricerca su Google Immagini, definendo in Strumenti di Ricerca come Dimensioni Grandi o Media, la nostra immagine non comparirà.

Conclusioni

Google non riesce ad interpretare i tag dedicati al responsive web design #RWD Condividi il Tweet

Ad oggi mi sembra di capire, dai risultati di questo esperimento, che Google non riesce ad interpretare gli attributi sizes e srcset e di conseguenza non indicizzerà le immagini alternative che andiamo a fornire, ma solo quella standard, che andiamo a definire con il classico attributo src.