Diseño web responsive

El diseño web adaptable o Responsive Web Design, son una serie de practicas aplicadas al diseño web que le permiten al usuario acceder a un sitio web desde diferentes medios como dispositivos: mobiles, tablets, pantallas wide y diferentes resoluciones en los computadoras. Esto partiendo de la base que todo diseño web debe estar centrado en la experiencia del usuario al momento de acceder a un sitio web, por este motivo es que actualmente muchos sitios web están usando el Responsive Web Design.

Por este motivo Solución páginas web ha querido compartir esta presentación que nos explica mejor las mejores practicas para aplicar el Diseño web responsive, y como aplicar un diseño fluido que se adapte a cualquier pantalla.

diseño web responsiveEl principal concepto en el que se apoya el Diseño Web Adaptable es en abandonar los anchos fijos de nuestra web, estos deberán ser fluidos. En lugar de diseñar nuestra web basándonos en valores fijos (por ejemplo width: 960px), el diseño fluido está pensado en términos de proporciones (por ejemplo width: 99%).

De esta manera cuando veamos nuestra web a través de la pequeña pantalla de un móvil todos los elementos de la web se harán más pequeños guardando la proporción entre ellos. Por ejemplo, para saber ahora el ancho de un elemento tendremos que dividir el ancho inicial del mismo entre el ancho del elemento “padre”, por llamarlo de alguna manera sencilla.