El 2012 fue un año marcado por el aumento en el uso de dispositivos móviles, tabletas y smartphones. No es un secreto que la demanda en aplicaciones es una necesidad que cualquier organización, empresa, ONG, ahora deben suplir. El solo contar con una página web ya no es suficiente, muchos usuarios, ahora con mayor acceso a Internet, ingresan a través de sus redes móviles que claramente cuentan con características distintas en dispositivos, tamaños y navegadores.

Entonces, ¿qué pasa con las páginas que fueron diseñadas para ser visualizadas en pantallas de escritorio y portátiles?

Viendo unos años atrás en el diseño tradicional, el diseñador definía el formato y criterios generales de su obra; sin embargo, con la llegada de la Web 2.0, el control de cualquier diseño web está en manos del usuario, quien decide finalmente qué dispositivo y navegador utilizar. Esta ‘pequeña’ diferencia hace que el diseñador no tenga el control total sobre la forma ‘correcta’ de visualización del diseño.

Un ejemplo para entenderlo no como diseñador, sino como el usuario común es tratar de abrir páginas web ‘normales’ en smartphones o tabletas, las cuales abren; pero presentan dificultades en su navegación ya que se escalan automáticamente al tamaño de la pantalla, generando un zoom interminable y muy difícil de usar. Esto ocurre porque dichas páginas tienen un ancho fijo.

La solución a este problema fue el diseño de varias versiones para los diferentes dispositivos móviles y navegadores, pero esta terminó siendo una tarea lenta y tortuosa que acarrea muchos más costos y tiempo en desarrollo, teniendo en cuenta la gran variedad de dispositivos, navegadores y sistemas operativos.

La gran conclusión es que actualmente no se puede pensar en un único aspecto final a la hora de diseñar contenidos, es decir, los usuarios no deben acomodarse a nuestros diseños; los contenidos se deben adaptar a la forma del dispositivo.

Aquí nace el diseño líquido o receptivo, en inglés ‘responsive design’, que abarca la posibilidad de generar un diseño que se acomodará automáticamente al dispositivo en el cual se está visualizando, bien sea portátil tipo PDA, Palm, navegadores de teléfono móvil, televisores, sistemas de navegación de carros, videoconsolas, etc.; respetando escalas coherentes de imágenes, fuentes y colores, adaptando el sitio web al entorno del usuario.

El concepto hace referencia a la idea de construir una web para todos y accesible desde cualquier tipo de dispositivo.

Otra de las ventajas del diseño líquido es la optimización en los motores de búsqueda ya que la URL es la misma, con lo cual se ahorran re-direccionamientos y fallos en el proceso, al igual que la relación en el diseño y unidad gráfica.

Sin embargo también hay desventajas. El diseño líquido funciona muy bien para sitios con un volumen de información pequeña y mediana, pero al hacerlo con sitios con información considerable termina siendo muy complicado simplificar los elementos, causando muchas veces un ‘desparrame’ de contenidos.

Lo más importante de este proceso es entender que las tendencias en Internet apuntan hacia el acceso a través de tecnologías móviles; ¡que no lo coja la noche! Incluya dentro de sus planes de desarrollo diseños basados en las necesidades y dinámicas de sus usuarios, no olvide que de esto depende el éxito y el impacto de cualquier negocio en la web.

 Artículos relacionados:

• 30 Herramientas útiles de Diseño Web Responsive

• 7 consejos para hacer buen responsive design

Imagen tomada de: http://www.genbetadev.com/desarrollo-web/7-consejos-para-hacer-buen-responsive-design

Laura Ayala
Coordinadora Gestión del Conocimiento