Por qué tu web sí o sí debe ser responsive

Diseño responsive: adaptarse o morir

El móvil arrasa. Cada día más gente se conecta y navega por internet mediante smartphones y tablets.

El uso de dispositivos móviles en la navegación por internet está cerca del 80% superando con creces el de los ordenadores de sobremesa.

¿Alguna vez te has encontrado con una web que parece hecha por liliputienses con textos e imágenes diminutas? Esas webs donde, para leer, tienes que ampliar repitiendo el gesto de zoom in y out hasta que se te duermen los dedos. O desplazarte por la pantalla hasta encontrar el botón de compra. Es desesperante… tanto que terminamos por abandonar el sitio a los pocos minutos.

Si no quieres que tu web forma parte de la larga lista de abandonos es imprescindible que tu diseño se adapte a cualquier dispositivo facilitando la experiencia de tu usuario. Es imprescindible que tu web sea responsive.

¿Qué opciones tengo?

Antes de contarte las bondades del diseño responsive (que son muchas) vamos a ver las alternativas:

  • Sitio web móvil. Se trata de crear otro sitio o sitios paralelos exclusivos para móviles. En su diseño se tendrán en cuenta todas las características del dispositivo como el tamaño de pantalla, la interacción táctil (que no tenemos en ordenadores de sobremesa), la velocidad de conexión inferior, etc. Suena bien pero la cantidad ingente de modelos de smartphones y tablets hace que sea imposible crear las suficientes versiones con lo que el diseño nuevamente tiene que ser adaptable.
  • App específica. Si has entrado en grandes plataformas de venta como Amazon o Zara desde tu móvil habrás recibido un mensaje que te sugiere descargar la app correspondiente. Se trata de un software desarrollado específicamente para dispositivos móviles que mejora considerablemente tu experiencia como usuario ya que te permite interactuar con un montón de funciones exclusivas de tu móvil como la cámara, llamadas directas, compartir, etc. La gran desventaja es el coste que además se duplica al tener que funcionar bajo las dos plataformas que reinan en el mercado: Google y Apple.
  • Diseño web responsive. Te permite usar un único sitio web que se adapta automáticamente al tamaño de la pantalla del dispositivo desde que se está visualizando. Da igual el móvil o tablet que uses para acceder. Podrás navegar, leer o comprar de forma cómoda y fácil.

No es que lo diga yo… hasta San Google lo recomienda

Y es que el diseño responsive, como has visto, mejora enormemente la experiencia de usuario, una de las claves que usa el buscador para posicionar nuestras páginas, junto al tiempo de carga (que también se ve favorecido).

Por otro lado con el diseño responsive evitamos duplicar los contenidos de nuestra web como ocurre si elegimos la versión móvil. Cuando Google detecta contenido duplicado selecciona el que considera más relevante y favorece su posicionamiento, pudiendo eliminar del ranking el resto de páginas similares. De hecho, si Google no detecta que la versión móvil se trata de una paralela de tu web puede llegar a penalizarla.

¿Qué pinta tiene un diseño responsive?

Comencemos con lo que no es.

Una web responsive no es una copia en miniatura de tu web de sobremesa donde constantemente tienes que hacer uso del zoom ampliando para conseguir leer algo sin lupa y las imágenes se muestras diminutas.

Tampoco es una copia a tamaño real donde tienes que hacer scroll horizontal y vertical para poder acceder a todo el contenido porque “no cabe todo en la pantalla”.

Comparativa diseño con y sin responsive

Un diseño responsive por el contrario:

  • reestructura el contenido según el tamaño y posición de la pantalla para aprovechar el espacio disponible.
  • apila los distintos bloques de contenido (texto, videos, imágenes…) según esquema jerárquico.
  • sustituye el menú tradicional por otros resumidos (como el llamado de hamburguesa) para facilitar la navegación.
  • Simplifica el contenido para hacer más sencilla la experiencia de usuario.
  • Elimina o modifica algunos ítems para adaptarse a las normas de Google. Este es el caso de los pop-ups invasivos que el buscador penaliza en las versiones móvil (no así en las versiones de sobremesa).

Así es un diseño responsive

Ahorra dinero y tiempo

Aparte de las mejoras para el usuario, el diseño responsive tiene otras ventajas muy muy interesantes para ti:

  • Solo tendrás que diseñar y programar una web con lo que los costes de creación disminuyen.
  • De igual forma necesitarás administrar y promocionar un único sitio con el consiguiente ahorro en tiempo y dinero.
  • Tienes una sola url así que los usuarios no tendrán que esperar a redireccionar la página, lo que resulta útil sobre todo en conexiones lentas.

Visto lo visto el diseño responsive como dirían los modernos no es una opción, es un “must”. ;·)

Resumen

En este artículo has aprendido:

  • La importancia de adaptar tu web a la navegación con dispositivos móviles.
  • Las distintas opciones para conseguirlo.
  • Qué es un diseño responsive y cómo funciona.
  • Cómo un diseño responsive puede ayudarte a mejorar la experiencia tu cliente, posicionar tu web y ahorrar tiempo y dinero.

Y tú ¿ya has adaptado tu web o blog a los dispositivos móviles?