¿En qué consiste el Diseño Web Elástico?
Es una alternativa dentro del diseño web, que surge como solución a los inconvenientes que se presentan en los conocidos diseño web líquido y fijo. Uno de los procedimientos más usados para desarrollar un diseño web elástico, es el de llevar el volumen de los objetos en la página a las dimensiones de letra seleccionada por cada visitante.
Día a día se suman más usuarios que viajan por la web mediante teléfonos celulares, tablets, o a través de una extensa gama de dispositivos; los cuales presentan diferentes resoluciones de pantallas, partiendo de 240 píxeles hasta los 1200 que poseen los PC convencionales de escritorio.
La forma de convertir las webs ajustables a cada dispositivo es que la misma web revele desde cuál se está accediendo y a qué resolución, y se acondicione de acuerdo a esas especificaciones; es lo que se identifica en inglés como "responsive web design" que se traduce como "diseño de páginas web responsive", "elástico" o "flexible".
En este tipo de diseño web se determinan las extensiones de la página mediante unidades “em” de tipografía, que calcula justamente el ancho de la letra «M» mayúscula de una tipografía determinada y a un tamaño definido. Es por ello que un “em” no es una medida fija, es una unidad relativa y su valor está condicionado al tamaño de la fuente escogido en el navegador. Para el momento, la medida de fuente por defecto en todos los navegadores habitualmente es 16 píxeles.
Así, el diseño web se adecuará en el momento en que el usuario del lugar web modifique el tamaño del texto, más no se ajustará de acuerdo a las modificaciones de las dimensiones de la ventana del navegador.
Al ampliar o reducir la ventana del navegador, podrás darte cuenta de la forma en que queda una web elástica, en diferentes resoluciones, así se evidenciará el cambio en las estructuras de la web, ajustándose a las diferentes resoluciones.
En este diseño web el contenido aumenta al ancho de la pantalla. En pantallas pequeñas, puede ser agradable para muchos usuarios, sin embargo, para pantallas más grandes el contenido se distorsiona.
Es una clase de diseño web del cual debemos apartarnos lo más posible. Se podría decir que ya está en desuso.
Ventajas del diseño web adaptivo
- Al contar con una versión en el lenguaje de marcado HTML y el lenguaje de hojas de estilo en cascada CSS, se logran abarcar las resoluciones de pantalla en su totalidad.
- En vista de que se evita configurar la versión móvil y tablet para la página web, hay una reducción de costos.
- En vista de que en los motores de búsqueda solamente figuraría una sola Url, se presenta una optimización de los resultados.
- Se evaden fallas al ingresar al lagar web desde los denominados "social links".
- El espacio web solamente se actualiza una vez, lo que se ve reflejado en todas las plataformas.
- Investigaciones han comprobado que cuando se usa toda la pantalla del usuario se incrementa la conversión.
- Acrecienta la usabilidad y, por tanto, la web alcanza a más cantidad de usuarios.
Si bien el diseño web elástico constituye una tecnología relativamente nueva, que al momento de llevar a cabo un proyecto web agrega un costo adicional, es significativamente menor de lo que valdría realizar la versión móvil, para una página web determinada.
Diseño de
páginas web
Es importante cuidar la imagen que su empresa muestra al mundo, mejorar la imagen y simplificarla aseguran el éxito de su negocio.
Diseno de Páginas webs