SEO para otros dispositivos móviles

Tablets

Cuando se piensa en cómo configurar un sitio web para mostrarlo en dispositivos móviles, se suele pensar en los usuarios que acceden con un tablet. Aunque no tenemos recomendaciones específicas para crear sitios web optimizados para tablets que tengan un buen posicionamiento en los resultados de búsqueda, sí podemos proporcionarte algunos consejos sobre cómo crear sitios web que satisfagan las necesidades de los usuarios de ordenadores, de smartphones y de tablets.

Diseño web adaptable

Nuestra recomendación general es que uses un diseño web adaptable. De este modo, tu sitio web servirá el mismo código HTML a todos los dispositivos, pero proporcionará diferentes reglas de estilo CSS para optimizar su interfaz en ordenadores, smartphones y tablets.

Si usas un diseño web adaptable en tu sitio web, pruébalo en diferentes tablets para asegurarte de que se renderice correctamente, ya que, tal como sucede con los smartphones, los tablets presentan una gran variedad de tamaños y de resoluciones de pantalla.

Contenido en función del dispositivo

Los sitios web pueden devolver páginas distintas (por ejemplo, con HTML, CSS y JavaScript diferentes) según el dispositivo con el que se acceda a ellas. Estas páginas se pueden publicar en la misma URL, mediante la publicación dinámica, o en URL independientes específicas.

Si tu sitio web proporciona páginas distintas a los usuarios en función de si utilizan un ordenador o un smartphone, pero no tiene ninguna página específica que mostrar a los usuarios de tablets, te recomendamos que les muestres el sitio web para ordenadores, puesto que, según nuestra experiencia, esa es la versión que esperan ver.

Si tienes versiones de tu sitio web optimizadas para tablets, estas directrices te pueden ayudar a configurarlo:

  • Publicación dinámica: en la misma URL se muestran archivos HTML y CSS distintos a los usuarios de ordenadores, smartphones y tablets en función del user-agent. Tal como se describe en nuestras recomendaciones para sitios web móviles, te sugerimos que utilices la cabecera HTTP Vary.
  • URL independientes específicas para tablets: en este caso, te recomendamos que permitas que el robot de Google rastree las URL para tablets y que incluyas en cada una de estas URL una etiqueta rel="canonical" que dirija a la URL equivalente para ordenadores.

Teléfonos básicos

Recomendamos que, en los sitios web dirigidos a usuarios de smartphones, se utilice el diseño web adaptable si es posible. Sin embargo, como los teléfonos básicos no pueden seguir las media queries de CSS, los webmasters que quieran mostrar contenido a los usuarios de estos teléfonos tienen que configurar sus sitios web de modo que muestren el contenido dirigido a teléfonos básicos mediante la publicación dinámica o en URL independientes.

Recomendamos, además, que las páginas que vayan a aparecer en teléfonos básicos incluyan la etiqueta <link rel="alternate" media="handheld">, tal como se describe más abajo.

En esta sección se muestra cómo implementar la publicación dinámica y las URL independientes.

Publicación dinámica

Si quieres mostrar de forma dinámica contenido optimizado para teléfonos básicos en la misma URL donde se proporciona el contenido dirigido a otros dispositivos, configura tu servidor tal como lo harías para publicar contenido en smartphones. El servidor debe incluir la cabecera HTTP de respuesta Vary: User-Agent. Asimismo, ten en cuenta las dificultades que suelen surgir cuando se detectan user-agent. Además, tienes que incluir la siguiente etiqueta en la página:

<link rel="alternate" media="handheld" href="[current page URL]" />

URL independientes

Los webmasters tienen a su disposición tres configuraciones para publicar contenido en ordenadores, smartphones y teléfonos básicos en diferentes URL. Utilices la configuración que utilices, también debes incluir las anotaciones que se han descrito más arriba necesarias para crear sitios web optimizados para smartphones y teléfonos básicos.

URL distintas

En esta configuración, el procedimiento sería el siguiente:

  • http://www.example.com/page-1 muestra contenido a los usuarios de ordenadores.
  • http://m.example.com/page-1 muestra contenido a los usuarios de smartphones.
  • http://phone.example.com/page-1 muestra contenido a los usuarios de teléfonos básicos..

En esta configuración, se recomienda añadir las siguientes anotaciones para que nuestros algoritmos interpreten la relación entre las páginas equivalentes dirigidas a diferentes dispositivos:

En www.example.com/page-1, añade:

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page-1" />
<link rel="alternate" media="handheld" href="http://phone.example.com/page-1" />

En m.example.com/page-1, añade:

<link rel="canonical" href="http://www.example.com/page-1" />

En phone.example.com/page-1, añade:

<link rel="canonical" href="http://www.example.com/page-1" />

Una URL para ordenadores y otra para todos los dispositivos móviles

Con esta configuración, los sitios web muestran contenido a los usuarios de ordenadores en una URL concreta, y publican el contenido dirigido a los usuarios de móviles (tanto smartphones como teléfonos básicos) en otra URL distinta. Por ejemplo:

  • http://www.example.com/page-1 muestra contenido a los usuarios de ordenadores.
  • http://m.example.com/page-1 muestra contenido tanto a los usuarios de smartphones como a los de teléfonos básicos.

En este caso, la anotación incluida en http://www.example.com/page-1 sería:

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page-1" />
<link rel="alternate" media="handheld" href="http://m.example.com/page-1" />

En la página m.example.com, hay que incluir la siguiente etiqueta:

<link rel="canonical" href="http://www.example.com/page-1" />

Es necesario incluir rel="canonical", independientemente de que sean páginas para teléfonos básicos o para smartphones.

En las respuestas del servidor, se debería incluir la cabecera HTTP Vary: User-Agent. De este modo, se indica a los sistemas de caché de Internet y al robot de Google que el servidor puede enviar respuestas distintas según el user-agent. Además, esta señal sirve al robot de Google para rastrear las distintas versiones.

URL distintas para teléfonos básicos

En esta configuración, un sitio web se muestra en ordenadores y smartphones mediante una URL con diseño web adaptable o con publicación dinámica, y en teléfonos básicos con una URL independiente. Por ejemplo:

  • http://www.example.com/page-1 muestra contenido a los usuarios de ordenador y de smartphone.
  • http://m.example.com/page-1 muestra contenido a los usuarios de teléfonos básicos.

En este caso, la anotación incluida en http://www.example.com/page-1 sería:

<link rel="alternate" media="handheld" href="http://m.example.com/page-1" />

En http://m.example.com/page-1, la anotación sería esta etiqueta:

<link rel="canonical" href="http://www.example.com/page-1" />

Redirecciones y la cabecera HTTP Vary

Si tu sitio web redirige automáticamente a los usuarios de dispositivos móviles que llegan a la versión para ordenadores al sitio web móvil o viceversa, incluye la cabecera HTTP Vary en tu servidor.

Sitemaps

Seguimos recomendando lo mismo en cuanto al uso de sitemaps con teléfonos básicos y de sitemaps con URL alternativas para smartphones.