Diseño de página web sigue uno de dos enfoques diferentes:
- Diseños de ancho fijo: Estos son diseños en los que el ancho de toda la página se establece con un valor numérico específico.
- Diseños líquidos: Estos son diseños en los que el ancho de toda la página es flexible según el ancho del navegador del espectador.
Hay buenas razones para usar ambos métodos de diseño, pero sin comprender tanto los aspectos relativos beneficios y deficiencias de cada método, no puede tomar una buena decisión sobre cuál usar para su web página.
Diseños de ancho fijo
Los diseños fijos son diseños que comienzan con un tamaño específico según lo estipulado por el diseñador web. Siguen siendo de ese ancho, independientemente del tamaño de la ventana del navegador que visualiza la página. Los diseños de ancho fijo permiten al diseñador un control más directo sobre cómo se verá la página en la mayoría de las situaciones. A menudo son preferidos por los diseñadores con experiencia en impresión, ya que permiten al diseñador realizar ajustes mínimos en el diseño y mantenerlos consistentes en todos los navegadores y computadoras.
Diseños líquidos
Los diseños líquidos son diseños que se basan en porcentajes del tamaño de la ventana del navegador actual. Se adaptan al tamaño de la ventana, incluso si el espectador actual cambia el tamaño de su navegador mientras ve el sitio. Los diseños de ancho líquido permiten un uso eficiente del espacio proporcionado por cualquier ventana del navegador o resolución de la pantalla. A menudo son los preferidos por los diseñadores que tienen mucha información n para transmitir en tan poco espacio como posible, ya que siguen siendo consistentes en tamaño y pesos de página relativos, independientemente de quién esté viendo el página.
¿Lo que está en juego?
Tu diseño de páginas web afecta tu la capacidad de respuesta y adaptabilidad del sitio. Dependiendo de lo que elija, la capacidad de sus lectores para escanear su texto, encontrar lo que están buscando o, a veces, incluso usar su sitio puede verse mejorada u obstaculizada. La identidad de marca general de su sitio también puede estar en riesgo, especialmente si los estándares de su marca siguen un modelo lógico de impresión primero.
Beneficios de los diseños de ancho fijo
Un diseño de ancho fijo es útil en algunas circunstancias.
- Un diseño de ancho fijo permite al diseñador crear páginas que se verán idénticas sin importar quién las mire.
- Los elementos de ancho fijo, como las imágenes, no dominarán el texto en monitores más pequeños porque el ancho de toda la página incluirá esos elementos.
- La longitud del escaneo no se verá afectada por grandes segmentos de texto, sin importar qué tan ancho sea el navegador.
Beneficios de los diseños líquidos
Un diseño líquido funciona mejor en otras circunstancias.
- Un diseño de ancho líquido se expande y contrae para llenar el espacio disponible.
- Se utiliza todo el espacio disponible, lo que permite al diseñador mostrar más contenido en monitores más grandes, pero sigue siendo viable en pantallas más pequeñas.
- Los diseños líquidos brindan consistencia en anchos relativos, lo que permite que una página responda de manera más dinámica a las restricciones impuestas por el cliente, como tamaños de fuente más grandes.
Inconvenientes de los diseños de ancho fijo
Sin embargo, un formato fijo no está exento de costos.
- Los diseños de ancho fijo fuerzan el desplazamiento horizontal en ventanas de navegador más pequeñas. A la mayoría de las personas no les gusta desplazarse horizontalmente.
- Dejan grandes extensiones de espacio en blanco en monitores más grandes, lo que da como resultado una gran cantidad de espacio no utilizado y más desplazamiento vertical de lo que de otro modo sería necesario.
- Los diseños de ancho fijo no manejan muy bien los cambios de los clientes en los tamaños de fuente. Para pequeños aumentos en el tamaño de la fuente, pueden estar bien, pero para aumentos más grandes, el diseño puede verse comprometido.
Inconvenientes de los diseños líquidos
Los diseños líquidos también tienen sus inconvenientes.
- Los diseños líquidos permiten un control muy poco preciso sobre el ancho de los diversos elementos de la página.
- Pueden dar como resultado columnas de texto que son demasiado anchas para escanear cómodamente, o en navegadores más pequeños demasiado pequeños para que las palabras se muestren con claridad.
- Error de diseño de líquidos cuando un elemento de ancho fijo, como una imagen, se coloca dentro de una columna de líquido. Si la columna se representa sin suficiente espacio para la imagen, algunos navegadores aumentarán el ancho de la columna, ignorando las instrucciones del diseñador, mientras que otros navegadores fuerzan la superposición de texto e imágenes para lograr la correcta porcentajes.
Preferencia de diseño y enfoques mixtos
Algunos diseñadores prefieren combinar estos conceptos. No les gusta usar diseños líquidos para grandes bloques de texto, ya que esa estructura hace que el texto sea ilegible en un monitor pequeño o no se pueda escanear en uno grande. Por lo tanto, tienden a hacer que las columnas principales de las páginas tengan un ancho fijo, pero crean encabezados, pies de página y columnas más flexibles para ocupar el resto de la propiedad inmobiliaria y no perder la capacidad de mayor navegadores.
Algunos sitios usan scripts para determinar el tamaño de la ventana de su navegador y luego cambian los elementos de visualización en consecuencia. Por ejemplo, si abre un sitio de este tipo en una ventana muy amplia, es posible que obtenga una columna adicional de enlaces en el lado izquierdo que los visitantes con monitores más pequeños podrían no ver. Además, el texto envuelto alrededor de la publicidad depende de qué tan amplia sea la ventana de su navegador. Si es lo suficientemente ancho, el sitio lo rodeará con texto; de lo contrario, mostrará el texto del artículo debajo del anuncio. Si bien la mayoría de los sitios no necesitan este nivel de complejidad, demuestra una forma de aprovechar las pantallas más grandes sin afectar la visualización en pantallas más pequeñas.