¿Diseño Responsive o Adaptative? Tu decides

responsive 1

Si tenemos en cuenta que el móvil se ha convertido ya en el primer dispositivo que usan los españoles para conectarse a la red y que el consumidor español maneja una media de 6 dispositivos entre móvil, tablet, portátil, vídeo consola…, adaptar nuestra web a cada tipo de dispositivo es fundamental para optimizar al máximo la experiencia de los usuarios, de forma que resulte sencillo navegar por nuestra web sea cual sea el dispositivo desde el que se conecte nuestro público.

¿Cómo saber si nos conviene utilizar un diseño responsive o, por el contrario, crear un diseño adaptative o web móvil?

 ¿Qué es un diseño Responsive?

Un diseño Responsive es aquel que es capaz de adaptarse al dispositivo con el que estamos navegando, reestructurando, en la pantalla del dispositivo, los distintos elementos de la web para optimizar el espacio disponible en cada uno de ellos y, de este modo, ofrecer la mejor experiencia posible a los usuarios.

En este tipo de diseño se envía el mismo contenido siempre y es el propio dispositivo móvil el que realiza el trabajo de adaptar la visualización a la pantalla.

Esta adaptación se suele realizar apilando las columnas o los módulos que forman nuestro sitio, formando una o dos columnas según las dimensiones de la pantalla del dispositivo.

responsive 2

Ventajas:

Las principales ventajas de tener una web con diseño Responsive las podemos resumir en:

  • Sólo es necesario un único diseño web.
  • El hecho de que sea un único diseño favorece de cara a que la web sea reconocida e identificable por los usuarios sea cual sea el dispositivo desde el que accedan a ella.
  • Se mantiene la misma URL, lo cuál es muy importante de cara a nuestra estrategia SEO.
  • Ahorro de tiempo y costes: si tienes tu sitio web realizado con algún gestor de contenidos del tipo WordPress, la mayoría de los temas son diseño Responsive, por lo que no tendrás que realizar ningún tipo de trabajo extra para su implementación.

 Desventajas:

Entre las desventajas que presenta este tipo de diseño web podemos citar:

  • No podemos definir una estrategia de contenidos distinta en función del dispositivo, ya que se cargan todos los contenidos en los diferentes dispositivos.
  • La carga suele ser más lenta y en dispositivos móviles no podemos olvidar que “el tiempo es el rey”.
  • La forma de interactuar con la web desde dispositivos móviles es táctil, por lo que tenemos que asegurarnos de que ciertos elementos como botones Call to Action, enlaces, campos para rellenar… estén optimizados para su uso desde este tipo de dispositivos.

 responsive 7

¿Cómo puedo saber si mi web tiene diseño Responsive?:

Existen algunas herramientas online que nos muestran en tiempo real si nuestro sitio web es o no responsive.

Entre ellas:

responsive 9

¿Qué es un diseño Adaptative?

Un diseño adaptive es aquel que se realiza pensando exclusivamente en cómo quedará nuestro diseño en uno o varios dispositivos móviles, es decir, se trata de un diseño realizado Ad hoc para este tipo de dispositivos.

En este tipo de diseños, el servidor detecta el dispositivo desde el que se accede a la web y le enviará al usuario una web adaptada exclusivamente a su dispositivo.

De esta forma, los usuarios que accedan, por ejemplo, desde su teléfono móvil, recibirán una versión de la página totalmente adaptada, diseñada y programada para funcionar en este dispositivo con el mejor rendimiento posible, con el fin de que disfruten de una experiencia óptima de navegación en su móvil.

adaptative 1

Ventajas:

Las principales ventajas de tener una web con diseño Adaptative son:

  • Al enviar sólo contenido adaptado para el dispositivo, la velocidad de carga de la página mejorará ya que no se tendrá que enviar contenido innecesario y no se obligará al dispositivo a cambiar y adaptar la forma en la que se muestra ese contenido.
  • Nos aseguramos de que la web aparece con una resolución perfecta para cada dispositivo, para cada pantalla.
  • Permite aprovechar todas las funcionalidades presentes en los dispositivos móviles como, por ejemplo, la función de llamada, de forma que puedas incluir un Call To Action con un número de teléfono que al pincharle marque el número directamente, o la función de geolocalización para el caso de empresas o comercios locales.
  • Se pueden crear tantas experiencias como dispositivos existen.

Desventajas:

Por contra, las desventajas de tener una web con diseño Adaptative se resumirían en:

  • La web es distinta para cada dispositivo lo que requiere un cuidadoso planteamiento para no perder la esencia de la misma. Se debe de identificar correctamente que estamos en la misma web sea cual sea el dispositivo de acceso a la misma.
  • Al tener distintos diseños según el tipo de dispositivo, el desarrollo de la web se encarece, lo mismo que su mantenimiento.

responsive 4

 

Entonces, ¿Cuál elijo para mi web?

Esta decisión dependerá de nuestras necesidades y de la experiencia que queramos ofrecer a nuestros usuarios.

Por regla general, para sitios web de contenidos y que no requieren de una gran interacción con el cliente, un diseño Responsive es el adecuado, ya que le permite a los usuarios una satisfactoria experiencia de navegación con sólo adaptar los contenidos a cada formato de dispositivos.

Pero si tu web requiere mostrar gran cantidad de elementos, como por ejemplo en un ecommerce, donde necesitas optimizar al máximo cada uno de ellos, o una web de gestión como la de la mayoría de las entidades bancarias, donde la experiencia de usabilidad de los usuarios ha de estar al máximo nivel, entonces lo más conveniente es utilizar una versión móvil de tu web, o con diseño Adaptative.

adaptative 5

Decidas lo que decidas, debes “movilizarte”.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>