Web responsiva vs adaptable ¿Cuál es la diferencia?

Seguro que muchas veces has oido hablar de que una web es responsiva o que es adaptable, y podemos llegar a pensar que son lo mismo, pero no es así, por eso hoy vamos a dedicarle un momento para saber qué hace que una web sea responsive y en qué se diferencia de una web adaptable.

Empecemos por ¿Qué son?

Responsive Web Design (RWD) o Diseño Web Responsive es una técnica para desarrollar interfaces que hace uso de media queries y hojas de estilos, estableciendo unas medidas de ancho en tamaños proporcionales para hacer una estructura flexible y que el contenido de la web se adapte a las distintas resoluciones de pantalla. De esta forma la experiencia de usuario no se ve afectada. Por lo tanto, busca una mayor flexibilidad.

Adaptive Web Design (AWD) o Diseño Web Adaptado (no adaptativo, que sería una traducción incorrecta del término “adaptive”) es una técnica que utiliza tamaños de pantalla preestablecidos: 320px, 480px, 760px, 960px, 1200px, 1600px y se crea un diseño a medida para cada uno de esos tamaños. Cuando se detecta el dispositivo, se le suministra el diseño que mejor se adapta de entre los realizados. Por lo tanto, no es tan flexible pero sí más cómodo de realizar.

¿Qué tienen en común?

El objetivo de ambos es adaptar la apariencia de las páginas web al dispositivo que se esté utilizando para visualizarlas. Hoy día las páginas web se visualizan en multitud de dispositivos como tabletas, teléfonos, libros electrónicos, portátiles, PCs… lo que hace necesario que nuestra web se pueda visualizar correctamente en cualquier dispositivo, y es aquí donde entra el momento de elegir cual es la que más nos conviene y cuales son sus diferencias.

La gran diferencia…

Para empezar uno se adapta con un diseño fluido y el otro con un diseño a saltos, como puedes ver en el ejemplo si pinchas en él.

El diseño responsive es fluido porque la estructura se ajusta de manera fluida independientemente del dispositivo en que se esté visualizando.

En cambio, el diseño adaptable se muestra en saltos ya que la página está mostrando algo diferente dependiendo del navegador o dispositivo en que se esté visualizando.

¿Quiere decir esto que el diseño adaptable es peor?

Todo depende del resultado que queramos.

Un diseño web responsive es mejor por su fluidez, por su adaptación suave y flexible, por la simplificación de su código y más eficiente en cuanto a la gestión de recursos, ya que se adaptará a futuros tamaños de dispositivos y pantallas sin tener que modificar tu CSS. También es el que más se ha popularizado, gracias a la existencia de numerosas plantillas en las principales plataformas como WordPress, Joomla, Prestashop…

Pero hay proyectos en los que es mejor definir diseños diferentes y específicos, ofreciendo experiencias distintas según el tamaño del dispositivo desde el que veamos la web.

 

Diseño Web y Programación Marketing Digital