URL independientes

Al usar esta configuración, las páginas para ordenadores y móviles tienen URL diferentes.

Un ejemplo de configuración habitual sería el siguiente: las páginas de www.example.com se muestran a los usuarios de ordenadores y las páginas equivalentes de m.example.com se muestran a los usuarios de móviles. Google no tiene preferencia por ningún formato de URL en concreto, siempre y cuando todos los user-agent del robot de Google puedan acceder a ellas.

TL;DR

  • Señala la relación entre dos URL con una etiqueta <link> que incluye los elementos rel="canonical" y rel="alternate".

  • Detecta las cadenas de user-agent y redirige correctamente.

Anotaciones para las URL en ordenadores y en móviles

Para ayudar a nuestros algoritmos a entender las URL independientes para móviles, recomendamos utilizar las siguientes anotaciones:

  1. En la página para ordenadores, añade una etiqueta rel="alternate" que dirija a la URL para móviles correspondiente. Así, ayudas al robot de Google a detectar la ubicación de las páginas para móviles de tu sitio web.
  2. En la página para móviles, añade una etiqueta rel="canonical" que dirija a la URL para ordenadores correspondiente.

Estas anotaciones pueden incluirse en dos sitios distintos: en el código HTML de las propias páginas o en sitemaps. Por ejemplo, supongamos que la URL para ordenadores sea http://example.com/page-1 y que la URL para móviles correspondiente sea http://m.example.com/page-1. Las anotaciones de este ejemplo se harían de la forma siguiente:

Anotaciones en el código HTML

En la página para ordenadores (http://www.example.com/page-1), añade la siguiente anotación:

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

En la página para móviles (http://m.example.com/page-1), la anotación necesaria sería esta:

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

Es obligatorio incluir la etiqueta rel="canonical" en la URL para móviles y dirigirla a la página para ordenadores.

Anotaciones en los sitemaps

Puedes incluir la anotación rel="alternate" en las entradas de sitemaps correspondientes a páginas para ordenadores de la siguiente manera:

<?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.example.com/page-1/</loc>
    <xhtml:link rel="alternate" media="only screen and (max-width: 640px)"
    href="http://m.example.com/page-1" />
  </url>
</urlset>

Sigue siendo obligatorio añadir al código HTML de las páginas para móviles la etiqueta rel="canonical".

Anotación detallada

Ten en cuenta los atributos de la etiqueta de enlace que hay en la página para ordenadores:

  • El atributo rel="alternate" indica que, con esta etiqueta, se especifica una alternativa a la página para ordenadores.
  • El valor del atributo "media" es una cadena media query de CSS en la que se especifica en qué situaciones Google tiene que utilizar la URL alternativa. En este caso, utilizamos una media query que se suele emplear para dirigirse a dispositivos móviles.
  • Con el atributo "href" se especifica la ubicación de la URL alternativa, que suele ser la página de m.example.com.

Con esta anotación bidireccional, el robot de Google puede detectar el contenido y nuestros algoritmos pueden determinar la relación entre las páginas para ordenadores y para móviles, y así procesarlas de forma adecuada. Al usar URL diferentes para proporcionar el mismo contenido en diferentes formatos, la anotación informa a los algoritmos de Google de que las dos URL tienen un contenido equivalente y, por lo tanto, se deben tratar como una sola entidad y no como dos. Si se tratan como entidades distintas, ambas URL pueden aparecer en los resultados de búsqueda de ordenadores, y puede que aparezcan en posiciones inferiores que si Google entendiera la relación. A continuación se indican algunos de los errores habituales en esta configuración:

  • Al utilizar las etiquetas rel="alternate" y rel="canonical", intenta que a una página para móviles solo le corresponda una página para ordenadores. En especial, evita que muchas páginas para ordenadores hagan referencia a una sola página para móviles (o viceversa).
  • Comprueba las redirecciones y asegúrate de que las páginas para ordenadores no redirijan por accidente a una sola página para móviles que no tenga relación con su contenido.
Si decides incluir un sitio web independiente para móviles, ten en cuenta los errores habituales como, por ejemplo, redirigir de forma errónea a los usuarios de móviles.

Redirección automática

Cuando un sitio web está configurado para mostrar contenido en navegadores de ordenador y de móvil con diferentes URL, es posible que los webmasters quieran redirigir automáticamente a los usuarios a la URL adecuada. Si tu sitio web utiliza la automática, procura tratar a todos los robots de Google igual que a cualquier otro agente de usuario y redirecciónalos adecuadamente.

Técnicas de redirección admitidas

El robot de Google es compatible con las dos implementaciones de redirecciones siguientes.

  • Redirecciones HTTP
  • Redirecciones en JavaScript

Uso de redirecciones HTTP

Las redirecciones HTTP son un método habitual para redirigir a los clientes a URL específicas de dispositivos. Normalmente, se redirige a los usuarios en función del user-agent que hay en las cabeceras de solicitud HTTP. Es importante que la redirección lleve a la misma URL alternativa que se indica en la etiqueta rel="alternate" de la página o en el sitemap.

Para ello, no importa si se redirige con un código de estado HTTP 301 o 302 desde el servidor, pero se recomienda usar el 302 siempre que sea posible.

Redirecciones en JavaScript

Si es difícil implementar una redirección HTTP, puedes redirigir a los usuarios a las URL a las que apunte la etiqueta rel="alternate" con JavaScript. Si optas por utilizar esta técnica, ten en cuenta la latencia causada por la redirección en el cliente, puesto que hay que descargar primero la página para después analizar y ejecutar el JavaScript y, finalmente, activar la redirección.

Hay muchas más formas de implementar redirecciones basadas en JavaScript. Por ejemplo, puedes usar JavaScript para ejecutar las consultas sobre medios que ya se utilizan en tu sitio web con las anotaciones de enlace de la página mediante la función matchMedia() de JavaScript.

Redirecciones bidireccionales o unidireccionales

Se implementan diferentes políticas de redirección en función de los sitios web. Algunos sitios web solo redirigen a los usuarios de dispositivos móviles que visitan una página para ordenadores (redirecciones "unidireccionales"). En cambio, en otros sitios web se redirige a los usuarios de dispositivos móviles y a los de ordenadores si visitan, respectivamente, páginas para ordenadores o para móviles (redirecciones "bidireccionales").

En el caso del robot de Google, no tenemos ninguna preferencia, así que recomendamos que los webmasters tengan en cuenta a los usuarios a la hora de decidir sobre su política de redirección. Lo más importante es proporcionar redirecciones correctas y coherentes; es decir, redirigir al contenido equivalente del sitio web para ordenadores o para móviles. Si la configuración es incorrecta, puede que algunos usuarios no puedan ver ningún contenido tuyo.

Asimismo, te recomendamos que proporciones a los usuarios una manera de anular la política de redirección; es decir, que permitas que los usuarios de móviles puedan ver la página para ordenadores si quieren, y viceversa.