Resoluciones de pantalla y diseño web

Diseña tu página web para 1024x768 píxeles: es la resolución actual más común

octubre de 2006

Una de las preguntas más frecuentes es: ¿Cuál es la mejor resolución para diseñar mi web? La respuesta completa es compleja, pero hay unos consejos claros:

• Optimiza para 1024x768 píxeles. Es la resolución actual más común. En principio hay que optimizar para tu audiencia, así que esta resolución cambiará en el futuro.
• NO diseñes únicamente para una resolución. El tamaño de pantalla cambia entre los usuarios. Las variaciones son incluso mayores, desde el momento en que no siempre se maximizan los navegadores.
• Utiliza una estructura líquida. Que se ajuste a la visualización del usuario.
  

Actualmente el 60% de todos los monitores están configurados a 1024x768 píxeles, y un 17% usan 800x600 píxeles. Otro 18% de usuario utiliza resoluciones iguales o mayores a 1280x1024 píxeles.

El porcentaje de grandes resoluciones está creciendo. A partir de 1600x1200 píxeles, los usuarios raramente amplían su navegador completamente, porque muy pocas páginas web, están optimizadas para esas dimensiones.

Las grandes resoluciones son perfectas para trabajar con hojas de cálculo o para diseño gráfico, pero no para la web actual.

Optimizar para 1024x768

Tu página debería funcionar y tener su mejor imagen con la resolución más común. También significa que debe funcionar adecuadamente en otras resoluciones, razón por la cual recomiendo estructuras líquidas.

Hay tres razones principales para optimizar el diseño a una resolución:

• Visibilidad inicial: ¿Está la información visible sin que los usuarios deban utilizar la barra de scroll?
• Lectura fácil: ¿Cómo se puede leer el texto?
• Estética: ¿Qué imagen tienen los elementos? ¿Se ajustan bien todos ellos?
  

Tu página debería funcionar y verse bien al cambiar entre resoluciones.

Los diseños para móviles son especiales: hay que diseñar de nuevo, proporcionando menos funciones, y redactar de forma aún más concisa.

Fuente: Nielsen, J. (2006) Screen Resolution and Page Layout, www.useit.com/alertbox/