Google per i Webmaster, sviluppo di siti per cellulari

Di - 6 December 2012 - in
Post image for Google per i Webmaster, sviluppo di siti per cellulari

Nel web moderno ormai la navigazione da dispositivi mobili non è più un trend in crescita: è una realtà quotidiana del traffico di qualunque sito.
Googlab nel momento in cui questo articolo viene pubblicato riceve ben il 20% delle visite da smartphone e 5% dai tablet. Google ha delle raccomandazioni per i webmaster che vogliano curare l’aspetto dell’accessibilità mobile anche sotto il profilo dell’indicizzazione.

I possibili scenari

Esistono diversi modi per fornire un contenuto secondo modalità di visualizzazione specifiche per dispositivi mobili. Per semplificare, possiamo riassumerli come segue.

Design responsivo

Tramite specifiche istruzioni nei fogli di stile, è possibile adattare il layout del sito ad una qualsiasi risoluzione dello schermo. Il sorgente HTML ed i fogli di stile non cambiano a seconda del dispositivo, il compito di adattare la visuale è lasciato al browser.

Template HTML dinamico

Il server riconosce l’User Agent o il dispositivo che sta richiedendo la pagina e fornisce una versione totalmente differente del layout del sito (HTML e CSS), pur lasciando immutati i contenuti per lo stesso URL.

Dominio o cartella separata

La versione mobile viene pubblicata su un indirizzo differente (ad esempio m.sito.it), di fatto duplicando l’intera struttura dei contenuti. Solitamente a questa soluzione è applicato un redirect sulla base dello User Agent o del dispositivo, verso la versione corrispondente.

La soluzione migliore per Google

Google raccomanda esplicitamente l’utilizzo del design responsivo. Pur essendo abbastanza complesso da realizzare, cosa che richiede un costo aggiuntivo in fase di sviluppo del sito, permette di evitare alla radice ogni problema legato all’indicizzazione dei contenuti: il sito è lo stesso da qualunque dispositivo venga visualizzato e la stessa cosa vale per Google. L’esperienza utente cambia solo al variare della risoluzione del browser (o della dimensione della finestra).

Come gestire i template dinamici

Le indicazioni sono di usare l’istruzione header HTTP “Vary: User Agent”, che serve da un lato per segnalare ai server cache degli ISP che esistono versioni differenti di quella pagina che cambiano a seconda dell’User Agent e dall’altro aiuta Googlebot ad attivare la scansione specifica per i siti per cellulari.

Ecco un esempio di come dovrebbe apparire l’istruzione all’interno degli header HTTP:

GET /page-1 HTTP/1.1
Host: www.example.com
(...altre informazioni degli header HTTP...)

HTTP/1.1 200 OK
Content-Type: text/html
Vary: User-Agent
Content-Length: 5710
(...altre informazioni degli header HTTP...)

E nel caso di versioni mobili specifiche?

Come sappiamo, Google identifica il contenuto sulla base dell’URL ed eventuali contenuti identici su URL differente vengono contrassegnati come contenuto duplicato, portando all’esclusione dall’indice di una delle due versioni, scelta autonomamente da Google in assenza di istruzioni specifiche.

Le indicazioni in questo caso sono di segnalare la presenza di una versione mobile alternativa all’interno del tag <head> della versione desktop della pagina, tramite l’istruzione link rel=”alternate”, ad esempio:

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.sito.it/pagina-1" >

E’ anche possibile indicare la versione alternativa all’interno della sitemap.xml:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
  xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>http://www.sito.it/pagina-1/</loc>
<xhtml:link
    rel="alternate"
    media="only screen and (max-width: 640px)"
    href="http://m.sito.it/pagina-1" />
</url>
</urlset>

Mentre sulla versione mobile le indicazioni sono di usare la nota istruzione rel=”canonical”, da utilizzare di consueto in caso di contenuti duplicati:

<link rel="canonical" href="http://www.sito.it/pagina-1" >

Cosa fare nel caso di redirezione per dispositivo

Le cose si complicano ancora se, come spesso accade, l’utente viene rediretto ad una specifica versione del sito sulla base dello User Agent del browser o del dispositivo di navigazione. Googlebot infatti ha una specifica versione che si identifica come dispositivo mobile e occorre tenere presente di diversi dettagli per non ostacolare o confondere inavvertitamente il lavoro dello spider.

In casi come questo occorre necessariamente assicurarsi di utilizzare l’istruzione  “Vary: User Agent” degli header HTTP.

Via | Google Webmaster Central Blog

Leave a Reply

Martino Mosna Articolo scritto da

Specialista di Search Marketing e Web Anaytics, lavora nel campo dal 2006, attualmente come consulente freelance. Appassionato di astronomia e giochi di ruolo, il suo motto è “Non si smette di giocare perché si invecchia, si invecchia perché si smette di giocare”.

Contatta l'autore

Previous post:

Next post: