Diseño Sensible - Responsive layaut

Si quieres que tu web, se visualice tanto en pcs como en smartphones, tienes dos opciones. La primera: crear dos versiones de la pagina y utilizar un script de carga para seleccionar la versión a mostrar dependiendo del dispositivo o usar responsive layaut.

El diseño sensible (responsive layaut) es un estilo que nos permite desarrollar páginas web que se visualicen de forma correcta en cualquier dispositivo y resolución. Las páginas se redimensionan, ajustan, cambian de imágenes y se acoplan la resolución disponible en el dispositivo en el que se visualiza. Esto reduce el tamaño total del la web en el servidor y minimiza las tareas de mantenimiento.

Ventajas:

1- No hay que rediseñar la misma página para cada dispositivo: pc, Tablet, Smartphone.

2- No hay que crear versiones ajustables a los porcentajes de resolución (diseño fluido).

3- Mejor adaptación al dispositivo final y al usuario.

4- Sitios más escalables y fáciles de mantener.

Técnicas

Grid fluidos: tablas que mantienen sus porcentajes de ancho en diferentes resoluciones.

Imágenes flexibles: imágenes en capas móviles, que se recortan o imágenes con fondo escalable.

CSS3 media querys: capases de obtener la anchura del dispositivo, su resolución u orientación.

Cambios de contenido: mostrar u ocultar imágenes, columnas u otros objetos dependiendo del espacio en pantalla a través de la propiedad “display: none”.


Si te ha gustado esta entrada, comenta es gratis!!! o Suscríbete a nuestro blog.