Diseño web: ¿Responsive o adaptativo? ¿Cuál es la diferencia?

responisve

Uno de los objetivos más importantes en el diseño de páginas web es garantizar una buena accesibilidad y usabilidad para nuestros usuarios. Esto es un componente tremendamente importante ya que en buena medida determinará cosas tan importantes como la afluencia de visitantes y lo que es más importante la solidez de los lazos que estrechan nuestros visitantes con nuestro site o su fidelidad. Es necesario que echemos un ojo al panorama que existe hoy: Los tipos de páginas que existen, los tipos de usuarios que hay y los tipos de acceso y formas de navegar que hay. Existe una gran variedad de vías de acceso a Internet: Ordenadores, tabletas, smartphones… Así que las páginas que diseñemos deben estar completamente preparadas para ser reproducidas en cualquiera de estos dispositivos.

Se habla mucho de diseño adaptativo y de diseño responsive. Pero, ¿estos conceptos hacen alusión a lo mismo? Realmente no, hay diferencias entre ambos conceptos y es necesario que las conozcamos y escojamos la alternativa que más nos conviene en cada caso.

Al existir diferentes tipos de dispositivos y resoluciones de pantalla, es necesario que seamos capaces de crear sites que sean reproducibles en todos los formatos. Es un hecho que un porcentaje cada vez más elevado accede a la red a través de dispositivos portátiles aunque paradójicamente muchas empresas pasan por alto este detalle de forma que la experiencia de estos usuarios cuando visitan sus páginas es de bastante menor calidad y por lo tanto abandonan la página y además se quedan con una mala impresión del negocio en cuestión. Se dan problemas como un tiempo de carga demasiado dilatado al tratar de reproducir páginas escritorio en dispositivos portátiles, los problemas a la hora de hacer descargas y por supuesto a nivel visual con la deformación o distorsión del diseño original. Para evitar estos problemas se hace imprescindible que los desarrolladores y diseñadores observen cómo se está produciendo el consumo de información online y traten de adaptarse a los nuevos modus operandi porque lo contrario sólo significará un atraso y una posible pérdida de visitantes.

Las alternativas que existen hoy para afrontar este reto son las modalidades de diseño responsive y diseño adaptativo. Ambos consisten en un sistema de programación bastante flexible que proporcionan la posibilidad de reorganizar o incluso reestructurar los elementos que integran nuestra arquitectura web para que finalmente se adapten a cualquier resolución de pantalla y ofrezcan un resultado atractivo y funcional. Sin embargo ambas modalidades no significan lo mismo.

¿Cuáles son las diferencias entre diseño responsive y diseño adaptativo?

  • El diseño web de tipo responsive lo que hace es adaptar la estructura de la web y todos los elementos que lo integran a la pantalla de nuestro dispositivo para ofrecer un excelente aspecto visual y una gran funcionalidad atendiendo a criterios como la accesibilidad a los contenidos. Para lograr este tipo de diseños es necesarios que se establezcan valores de tamaño proporcionales en lugar de establecer valores fijos. Se hace uso de media queries y hojas de estilo para lograr un buen resultado. En muchos casos es necesario modificar la estructura original para favorecer la experiencia del usuario cambiando la disposición de los menús por ejemplo y evitando excesivos scrolls o métodos de acceso poco cómodos desde otros dispositivos.
  • El diseño web adaptativo no resulta tan flexible como el diseño responsive. Éste utiliza tamaños de pantalla fijos y preestabelcidos para cada uno de los dispositivos donde se vaya a reproducir la página en cuestión. Una de sus virtudes podríamos decir que es su sencillez a nivel de código. Crear un diseño adaptativo no necesita de tanto código como un diseño responsive.

Por todo esto lo más recomendable es optar por un diseño web de tipo responsive y aunque pueda llevarnos un tiempo extra en su desarrollo, finalmente merece la pena, todo esto si vamos a ser nosotros quien nos encarguemos del desarrollo integral de nuestra web. En caso de que estemos trabajando a través de una plantilla con CMS como WordPress debemos asegurarnos de que nuestra plantilla sea responsive (las propuestas más actuales lo son por lo que es fácil encontrarlas), de este modo no será necesario trabajar sobre ello. No es una tendencia nueva, tened en cuenta que llevamos inmersos bastantes años ya en un sistema multiplataforma, aunque es algo que muchas empresas no tienen en cuenta, es importante puesto que la calidad y la cantidad de clientes variará notablemente.


Un comentario

  1.   diego lucero dijo

    A mi entender los dos conceptos son Exactamente lo mismo, no existe una traducción literal de lo que significa wav diseño web responsive lo que persigue Esta técnica al español se traduce en diseño web adaptativo Qué es exactamente lo que hacen los elementos adaptarse a los diferentes tamaños de pantalla, por otro lado el diseño web fluido es lo que dice esta nota aseverando al diseño web adaptativo. No confundir a los lectores el diseño web adaptativo y diseño web responsive persiguen el mismo significado

Escribe un comentario