Diseño responsive y versión móvil ¿Qué dice Google?

Según el tipo de negocio, en España podemos hablar que el tráfico web móvil puede rondar el 50%%, e incluso ser superior según la industria.

Por tanto, construir un sitio adaptado a móvil es ya una prioridad para cualquier negocio. Según Google, sólo en los 2 años anteriores, el tráfico web móvil se ha multiplicado por 5. Tus clientes pueden estar buscándote ya a través de sus teléfonos móviles, y has de ser capaz de proveerles una experiencia móvil completa, usable y que le permita completar cualquiera de los objetivos que tu cliente tuviera en mente.

En los inicios del desarrollo web móvil, el estándar parecía claro. Desarrollar un sitio web móvil suponía crear una página web prácticamente desde cero y aparte de la principal con las medidas adaptadas a las pequeñas pantallas, y tomando el tamaño del iPhone como principal referencia.

Lo que decía Google en 2011 sobre el diseño responsive

Pero desde hace ya unos años, y aunque al principio Google recomendaba crear sitios móviles exclusivos, ahora la propia Google apuesta por el Responsive Design. Aún así, Google indica y deja claro que no es erróneo crear una página web exclusiva y diferenciada de la web de escritorio

Matt Cutts empezó a dar algunos consejos sobre cómo optimizar tu web desarrollada para móviles en 2011, y decía lo siguiente:

It can be nice to have the content on a separate URL so maybe m.whatever-your-site-is.com can be a very good practice

Es decir, “puede estar bien tener el contenido en una URL separada de modo que m.mi-sitio.com puede ser una muy buena práctica“

comparativa web responsive y movil 2011

Esto decía Google en 2011 acerca de web responsive y versión móvil

En cambio, ahora Google se decanta por el Responsive Design. El Responsive Design es una técnica que te permite crear un único sitio web que se adaptará al aparato en el que está siendo visualizada sin importar si es un PC, un portátil, un smartphone o una Tablet.

Un desarrollo responsive adaptará su tamaño automáticamente al del aparato en el que está siendo visualizado, aunque siempre dependerá de ti indicar cuál es el contenido más importante, apropiado o prioritario para tus visitantes.

Así, un usuario de un smartphone puede estar buscando en tu página web y teléfono para ponerse en contacto contigo, mientras que el usuario de Tablet está navegando desde su sofá por tus productos. Un sitio que usa Responsive Design podría priorizar botones del tipo click-to-call o click-to-map, mientras que el sitio para tablet se centraría más en simplificar el acceso a la ficha de los productos y el funnel de compra.

Desarrollando páginas webs móviles. Dos enfoques

Aunque ya hemos abordado las distintas opciones que tenemos para crear sitios webs para móviles en un post dedicado a SEO para móviles, vamos a hacer un rápido repaso visual.

Desarrollando web móvil al estilo tradicional

Desarrollo móvil “tradicional”. Una web distinta, con distinta URL a la principal. En realidad son dos páginas web. La página web para escritorio y la página web construida para móvil. El usuario será redirigido automáticamente al mejor sitio según su dispositivo.

Ahora en 2020, nadie o casi nadie utiliza una versión móvil distinta a la principal sino que se apuesta por el diseño responsive.

SEO móvil, responsive design

Responsive design o diseño adaptativo. Un desarrollo, una página para todas las pantallas. Una página web que se adaptará de forma correcta a cualquier dispositivo y ancho de pantalla.

Responsive design es mi decisión. ¿He de construir mi sitio desde cero?

La mayoría de plantillas actuales son responsive pero si quieres adaptar un sitio en concreto necesitarás ayuda externa con casi toda seguridad. Es decir, un desarrollador o empresa de desarrollo que se dedique a ello, y te costará tiempo y dinero.

Dependiendo de lo bien (o mal) que esté construido tu actual sitio, el gestor de contenidos que hayas elegido o lo bien pensada que esté la actual arquitectura de información, así te costará más o menos.

Recuerda una de las premisas del responsive. Tanto la web de escritorio como la de móvil o tablet tendrán exactamente la misma URL. En tu sitio responsive para móvil podrás ocultar páginas, priorizar un contenido o una caja sobre otras, pero no crearás URLs distintas o adicionales. De lo contrario, rompes la premisa del Responsive.

Diseño web Responsive si o si en 2020

Una de las grandes ventajas del Responsive Design y una de las razones por las que lo recomiendo es porque a medio y largo plazo, como también afirma Google, te saldrá más barato y económico el mantenimiento de un solo sitio adaptado para todo tipo de dispositivos que dos sitios independientes para cada dispositivo.

Además, siempre te encontrarás con la dificultad que suponen las tablets. No dejan de ser dispositivos móviles, con sistemas operativos móviles y navegadores móviles y tratados como tales. Por tanto si creas un sitio para móvil, adaptado para la pantalla de, por ejemplo un iPhone, cuando alguien entre con un iPad el user-agent le enviará al site móvil, cuando la forma ideal de ver tu site desde un iPad sería la versión escritorio.

Pero si creas un site de escritorio pensando en un PC y olvidándote de la navegación móvil (porque para eso tienes tu página dedicada y construida para móvil), seguramente y sin darte cuenta abusarías de los “mouse-over”, de los menús o botones desplegabes y demás técnicas que son simplemente imposibles de reproducir en una tablet.

Así que, salvo que tengas recursos suficientes y tenga todo el sentido el crear una página móvil diferente, única y aparte a tu sitio de escritorio, mi consejo sería que tu página web siguiera o se adaptara al desarrollo Responsive Design. De hecho, si vas a hacer tu site en breve, piensa primer en móvil y construye a partir de ahí. Te será más fácil.

Un último secreto sobre el Responsive Design

¿Sabes por qué realmente le gusta a Google más el Responsive? Porque… ¡sus arañas y sus servidores tienen que trabajar menos!

Imagínate que todos los desarrollos fueran sólo Responsive. ¡Habría muchas menos páginas y subdominios que indexar! ¡Menos tiempo de las arañas indexando el universo Internet! ¡Y menos trabajo para los servidores de Google!

Bingo… menos trabajo para los servidores de Google, menos energía gastada, más dinero ganado (o menos gastado)… así que ayuda a Google a hacer dinero y él te ayudará a tu posicionamiento 😉