Cuando se trata de diseño web, a veces hay que decidir cual sera la mejor opción para la visualización del sitio en distintos dispositivos, si es mejor hacer un diseño responsive o adaptativo, a pesar de ser métodos muy parecidos y pueden causar confusion, por eso te aclararemos las diferencias entre cada uno y cuales son sus ventajas y desventajas.
Diseño web responsive o responsivo:
Este tipo de diseño consiste en hacer que todos los elementos de nuestro diseño se redimensionan y se recoloquen dependiendo del ancho y alto de la pantalla. Se caracteriza porque los contenidos son fluidos y para esto se usa código media-queries de CSS3.
El responsive design permite reducir los tiempos de desarrollo y que no hayan contenidos duplicados haciendo que nuestro sitio sea mas fluido. Se caracteriza por responder siempre al ancho de pantalla en cualquier punto, no importa el tamaño el sitio ajusta los contenidos y posiblemente su funcionamiento en la manera que sea mas optima para la pantalla.
Diseño web adaptativo.
El diseño web adaptativo se caracteriza por cambiar la disposición de el contenido dependiendo del ancho de pantalla, esto quiere decir que hay que determinar en puntos específicos del ancho de pantalla como y cuando se van a visualizar los elementos, esto quiere decir que habrá contenido que se repetirá pero que se mantendrá oculto dependiendo del ancho del área de visualización.
Este toma mas tiempo de desarrollo debido a que hay que planificar y determinar una por uno las disposiciones de los elementos de nuestro sitio, pero permite una web mas ordenada. Esencialmente tienes que planificar tres tamaños específicos de pantalla:
1) Computadora de escritorio
2) Tablets
3) Celulares
Ventajas
Responsive:
- Los tiempos de desarrollo son menores debido a que se diseña un solo contenido que se redimenciona
- Contenido mas fluido
- La página web se ajusta automáticamente al tamaño de la pantalla
Adaptativo:
- Tiempos de carga mas rápidos porque solo se cargan los contenidos requeridos para el tamaño de pantalla del usuario
- Contenido mas organizado
Desventajas
Responsive:
- Los tiempos de carga son mayores debido a que se cargan todos los contenidos así no estén visibles
- Requiere mayor tecnología
- Se carga todo el contenido, es decir puede ser que interese diferenciar el contenido en la versión PC que en un móvil. Actualmente también se puede realizar, pero depende de la
tecnología usada.
Adaptativo:
- Disposición del contenido menos fluido
- Mayor tiempo de desarrollo debido a que hay que preparar un template dependiendo del tamaño del dispositivo
- La web es diferente en cada dispositivo , un cambio implica hacerlo en cada plantilla de cada dispositivo
Decidiendo entre DWR (Diseño Web Responsivo) y DWA (Diseño Web Adaptativo)
Como saber cuando utilizar DWR o DWA? se recomienda usar DWR cuando se esta realizando un sitio desde el inicio ya que se podrá establecer una estructura mas fluida del contenido, y utilizar DWA cuando se tenga que modificar una web ya existente cuyo contenido no se adapte a otros dispositivos. Por eso no se puede decir que uno sea mejor que otro, cada uno tiene sus ventajas dependiendo sea el caso y los 2 son herramientas disponibles para el diseñador web.