Guía para diseñadores gráficos

Guía para diseñadores gráficos > Adaptación de la estructura... > Ejemplos: páginas web sensibles > Ejemplo 1

Ejemplos: páginas web sensibles

http://colly.com

 

NOTA: Todos las medidas en pixeles son aproximadas. Algunas medidas pueden ser diferentes si el usuario amplia o disminuye el tamaño de la tipografía con Ctrl+ o Ctrl- .

La imagen muestra la página web en una pantalla grande, a partir de 1024px de resolución:

La página web mantiene una estructura fija centrada hasta los 980px:

A partir de los 980px, los bloques se redistribuyen de 4 a 2 columnas, manteniendo el diseño de cada bloque (bloques de diseño fijo):

La nueva estructura se mantiene fija y centrada hasta los 500px:

A partir de los 500px, los bloques se redistribuyen de nuevo, de 2 a 1 columnas, pero esta vez los bloques ensanchan un poco el tamaño (excepto la cabecera y las imágines que se mantienen con el mismo tamaño para todas las resoluciones):

La nueva estructura se mantiene fija y centrada hasta los 320px, la mínima resolución de esta página web:

JAVAJAN [somos maquetadores y programadores web]. Webs for designers & you. www.javajan.com © 2012 | Avís legal
TwitterFacebookRSSe-mail