Creare siti web mobile ottimizzati

 

 

Google, tramite il blog ufficiale di Google webmaster tool, ha comunicati quali dovrebbero essere le linee guida da seguire per creare siti web mobile ottimizzati in ottica seo.

Oggi i seo e webmasters non possono ignorare gli smartphones come devices di connessione internet in quanto è stato dimostrato che oggi più del 45% dei cellulari degli italiani è caratterizzato da smartphone e la quasi totalità dei possessori di smartphone lo utilizzano costantemente per navigare su internet.

Quali sono, secondo Google, i principi cardine del seo per la navigazione mobile?

1. Utilizzare lo stesso url per tutte le versioni del sito web (sia per pc sia per devices Apple sia per cellulari);
2. Creare una grafica css ad hoc per ciascuna device che dovrà essere attivata in automatico al riconoscimento della device utilizzata;
3. La grafica css deve essere adattata a ciascuna device ma deve essere basata sulla stessa scelta di colori ed altri elementi grafici in modo da creare associazione tra le diverse versioni del sito web;

Per realizzare i tre punti precedenti Google consiglia di utilizzare il "Responsive web design":

"Responsive web design is a technique to build web pages that alter how they look using CSS3 media queries. That is, there is one HTML code for the page regardless of the  device accessing it, but its presentation changes using CSS media queries to specify which CSS rules apply for the browser displaying the page…

Using responsive web design has multiple advantages, including:

• It keeps your desktop and mobile content on a single URL, which is easier for your users to interact with, share, and link to and for Google’s algorithms to assign the indexing properties to your content.

• Google can discover your content more efficiently as we wouldn't need to crawl a page with the different Googlebot user agents to retrieve and index all the content."

Nei casi in cui non sia possibile utilizzare il Responsive web design il consiglio di Google è quello di creare un file html per ciascuna device facendoli risalire ad un unica url ("dynamic serving") o se necessario a più url, creando un header ad hoc per ciascuna device:

"Dynamic serving is a setup where the server responds with different HTML (and CSS) on the same URL depending on the user-agent requesting the page. As it is not immediately apparent in this setup that the site alters the HTML for mobile user-agents (the mobile content is "hidden"), we recommend that the server send a hint to request that Googlebot-Mobile should crawl the page, too, and thus discover the mobile content. This hint is implemented using the Vary HTTP header.

The Vary HTTP header has two important and useful implications:

1. It signals to caching servers used in ISPs and elsewhere that they should consider the user-agent when deciding whether to serve the page from cache or not. Without the Vary HTTP header, a cache may mistakenly serve mobile users the cache of the desktop HTML page or vice versa.
2. It helps Googlebot discover your mobile-optimized content faster, as a valid Vary HTTP header is one of the signals we may use to crawl URLs that serve mobile-optimized content."