ejemplos code html css layout

code - layout html



¿Los diseños líquidos siguen siendo relevantes? (10)

¡Si si si! Tener que desplazarse horizontalmente en un sitio porque algún diseñador asumió que los usuarios siempre maximizan sus navegadores es un gran motivo de preocupación para mí y estoy seguro de que no estoy solo. Además de eso, como alguien con una visión realmente horrible, permítanme decir que el zoom de página completa funciona mejor cuando el diseño es líquido. De lo contrario, terminas con tu barra de navegación fuera de la pantalla (visible).

Ahora que la mayoría de los navegadores principales admiten el zoom de página completa (actualmente, la única excepción notable es Google Chrome), ¿los diseños líquidos o elásticos ya no son necesarios? ¿Vale la pena el esfuerzo relativo de construir diseños líquidos / elásticos? ¿Hay alguna situación en la que un diseño líquido aún sería beneficioso? ¿El zoom de página completa es la solución real que al principio parece ser?


Creo que todavía se necesitan diseños de líquidos, a pesar de que los navegadores tienen esta función de zoom de página completa, apuesto a que mucha gente no lo sabe o no sabe cómo usarlo.


El zoom de la página es horrible desde una perspectiva de accesibilidad. Es el equivalente a decir "no podríamos molestarnos en diseñar nuestras páginas correctamente [diseñadores], así que tenga una fuente más grande y recorra horizontalmente la página [desarrolladores de navegadores]". No puedo creer que Firefox saltó por el precipicio después de Microsoft y lo convirtió en el predeterminado.


Hacer un zoom de página completa no vale la pena en CSS, especialmente porque la mayoría de los navegadores ahora hacen este tipo de acercamiento de forma nativa (y lo hacen mucho mejor - ref [img] tags).

En cuanto al uso de ancho fijo, hay una característica secundaria con esto ... si aumenta el tamaño de la fuente, se mostrarán menos palabras por línea, lo que puede ayudar a algunas personas con la lectura.

Como en, ¿alguna vez leíste un bloque de texto que es extremadamente ancho, y descubriste que has leído la misma línea dos veces? Si la altura de la línea se incrementó (el mismo efecto a través del tamaño de la fuente), con menos palabras por línea, esto se convierte en un problema menor.


Los diseños elásticos no se refieren tanto al zoom como a la envoltura, lo que permite al usuario colocar más información en la pantalla si la pantalla tiene una resolución más alta y al mismo tiempo hacer que el contenido sea accesible para aquellos con pantallas de menor resolución. El zoom de página no logra esto.


Sí, no sabe qué resolución está usando el lector, o qué tamaño de pantalla, o incluso si se requiere / usa la accesibilidad. Como se mencionó anteriormente, no todo el mundo sabe sobre el zoom de página completa, lo sé, pero casi no lo uso ...


Sí, porque hay una gran variedad de pantallas que suelen oscilar entre 15 "y 32". También hay alguna variación en lo que las personas consideran un tamaño de letra "cómodo". Todo lo cual se suma a una gran variedad de tamaños en los que su contenido deberá encajar.

En todo caso, el diseño de líquidos se está volviendo aún más necesario a medida que escalamos a enormes monitores y descendemos a dispositivos de teléfonos celulares.


Sin embargo, los diseños líquidos pueden causar problemas de usabilidad.

Los contenedores de contenido que se vuelven demasiado anchos se vuelven excepcionalmente difíciles de leer.

Muchos blogs han fijado contenedores de contenido de ancho específicamente por este motivo.

Alternativamente, puede crear contenedores de contenido de varias columnas para que tenga un efecto como un periódico, con sus múltiples columnas de contenedores delgados de texto. Sin embargo, esto puede ser difícil de hacer.


Solo los visitantes de su propio sitio pueden decirle si los diseños de líquido siguen siendo relevantes para su sitio.

Al utilizar un marco como el YUI-CSS y el Optimizador de sitios web de Google, es bastante fácil ver lo que prefieren sus visitantes y dejar de lado la opinión y, en cambio, confiar en resultados fríos y duros.


Tenía un problema del mundo real con esto. El diseño requería una página de ancho fijo dentro de un lindo borde. Cabido dentro de 800 píxeles de ancho menos algunos píxeles para la ventana del navegador. Reste 200 píxeles para el menú de la izquierda y el área de contenido tenía unos 600 píxeles de ancho.

El problema era que parte del contenido del sitio era dinámico, lo que provocaba que los usuarios editaran y exploraran datos en tablas, en sus agradables pantallas de 1280x1024, con tablas restringidas a 600 píxeles de ancho.

Debe permitir el ancho de la ventana del navegador en contenido dinámico, a menos que el contenido dinámico sea predominantemente texto.