¿En qué casos se recomienda diseñar una página con dimensiones fijas y cuándo, con porcentuales?

Si ingresamos en www.w3counter.com/globalstats.php, podremos

conocer estadísticas actualizadas, mes por mes, sobre los navegadores

y resoluciones de pantalla más utilizadas por los usuarios.

Hace algunos años, el estándar de monitores estaba dado por pantallas de 14”, que, por lo general, se configuran en resoluciones de 640x480 pixeles o en 800x600 pixeles. La llegada de los monitores de 17” impuso el estándar de 1024x768 pixeles, respetado por muchos sitios web hoy en día. Los nuevos monitores ya han superado la marca de las 17” y también el formato. Las dimensiones estándares de pantallas con relación 4:3 (como los televisores antiguos), están dando paso a los modelos wide screen de relación 16:9. 

Estas características, sumadas a que, en la actualidad, se encuentran pantallas de 19”, 20”, 22”, entre otras alternativas, hace que exista una gran variedad de tamaños y, por ende, de resoluciones de pantalla, ya que cada una de estas opciones tiene asociada una resolución recomendada. 

El dilema de tener que diseñar un sitio sin saber en qué pantalla será visualizado influye en el diseño que vamos a realizar. Quienes deciden inclinarse por un diseño con dimensiones fijas utilizan como unidad de medida el pixel. Para lograr mayor compatibilidad, se puede optar por diseñar en una medida de 800x600 pixeles, sin embargo, en la actualidad, cada vez más diseñadores toman como estándar la resolución 1024x768, impuesta por los monitores estándares de 17 pulgadas. 

Cualquiera sea la opción que tomemos en el diseño, es recomendable poner un color o una imagen de fondo que logre armonía con el sitio, ya que en las pantallas de más resolución se verá en mayor extensión, en especial hacia los costados. 

El lenguaje HTML nos permite trabajar con medidas porcentuales en diversos elementos, como puede ser en tablas y capas. Por ejemplo, es posible establecer que una tabla ocupe el 80% del espacio que tiene disponible en su contenedor (por ejemplo un) en lugar de definir su medida exacta en pixeles. Como podemos darnos cuenta, la ventaja de utilizar un valor porcentual para los elementos que componen una página web es que se adaptarán según las dimensiones que les ofrezca la pantalla. Además, con un diseño adecuado, utilizando valores porcentuales, se puede aprovechar el máximo espacio disponible en cada una de las resoluciones. 

En cambio, al hacerlo fijo, desaprovechamos parte del área de pantalla si el usuario no tiene configurada la resolución para la cual fue optimizado el sitio. La desventaja de utilizar medidas porcentuales en el diseño reside en que los elementos pueden modificarse de tal forma que aparezcan movidos en la pantalla, si no contemplamos todos los aspectos del diseño. Al igual que las dimensiones expresadas en pixeles, el porcentaje puede aplicarse a las propiedades width (ancho) y height (alto) de los elementos que lo admitan. 

Dentro de una misma página web, pueden utilizarse medidas en pixeles o en porcentaje, aunque hay que evaluar con cuidado en qué casos puede ser útil optar por esta alternativa. Para indicar que un valor está expresado en pixeles, se utiliza px, por ejemplo: height=”100px”. Para establecer que el valor es porcentual, se usa el símbolo %, por ejemplo: width=”10%”. Es fundamental que el sitio se muestre centrado en todas las resoluciones de monitores ya que, de lo contrario, el diseño no lucirá de la mejor manera.