Google recomienda el diseño web adaptativo para los dispositivos móviles

Por fin Google toma partido públicamente sobre temas del SEO para dispositivos móviles en el SMX Advanced a través de Pierre Far, Google Webmaster Trends Analyst, que ha anunciado unas claras recomendaciones y guías para el SEO móvil.

Básicamente Google recomienda el llamado responsive design siempre que sea posible (utilización de CSS3 que varia el CSS que carga el navegador en función del tipo de dispositivo manteniendo una única URL).

Si no es posible utilizar CSS3, lo mejor sería lo que se viene haciendo hasta ahora de forma mayoritaria, que es detectar con HTML el dispositivo desde el que se carga la página. Google también tiene recomendaciones para móviles.

Tres métodos de diseño para dispositivos móviles

Hay básicamente tres métodos de desarrollar una página web para dispositivos móviles, aunque recomienda el diseño web adaptativo:

  1. Sitios que utilizan el diseño web adaptativo, es decir, sitios que sirven a todos los dispositivos en el mismo conjunto de direcciones URL, con todas las URL que sirven el mismo HTML para todos los dispositivos y utilizando sólo CSS para cambiar la forma en la página en que se representa en cada dispositivo. Esta es la configuración recomendada de Google.
  2. Sitios que sirven de forma dinámica a todos los dispositivos con el mismo conjunto de direcciones URL, pero cada uno sirve una URL y HTML diferentes (y CSS) dependiendo de si el agente es un ordenador de escritorio o un dispositivo móvil.
  3. Sitios que tienen versiones distintas para móviles y para escritorio.

7 opiniones en “Google recomienda el diseño web adaptativo para los dispositivos móviles”

  1. Yo uso tres URL en mis themes, una para los estilos de visión en pantalla normal, ‘screen’ (styles.css), otra para la impresión, ‘print’ (print.css) y otra para dispositivos móviles, ‘handheld’ (mobile.css).

    El caso es que lo hice así cuando la validación automática del CSS era la versión 2.1, ya que si lo ponía en una sola hoja me daba los errores típicos de validación, y eso que parte del código era copiado del theme de Twenty Eleven. Por ejemplo, usando «@media (max-width:800px)», pues daba error en que no soportaba este código.

    Pero ahora que ya se valida con la 3 automáticamente (desde hace un mes i pico), ¿debería poner todos los estilos en una sola la hoja? ¿O lo dejo como está? Ahora ya lo valido todo con CSS3, pero no sé si debería preocuparme por tener los estilos separados y los tres enlaces en el head. De hecho, pienso que puede que así se cargue incluso más rápido la versión para móviles, porque omite la versión de pantalla que es un fichero más pesado (unas mil líneas).

    ¡Un saludo!

Deja un comentario

Tu dirección de correo electrónico no será publicada.