¿A qué resolución de pantalla diseño una web?

Cuando nos planteamos el diseño de una web normalmente el primer paso que tenemos que decidir es la elección de si la página será fluida o fija, y, aún así, en ambos casos muchas veces debemos marcar un tamaño máximo de lienzo como mínimo durante la fase de boceto… Hasta hace unos años, aunque dependía del sector en el que la web fuera a competir, las visitas previas o el manejo del cliente de su propia web, la elección era común: cogíamos como estándar el lienzo de 960px, divisible por los suficientes números como para plantear diseños distintos.

Sin embargo a día de hoy, si cogemos nuestras estadísticas y miramos las resoluciones de las visitas entrantes podemos deducir que cada vez más el planteamiento de hacer el tamaño mínimo a 960px se nos queda corto… Esta mañana me ha dado por comparar las 3 webs con más visitas a las que tengo acceso, de sectores distintos y no competidoras entre ellas.

Calculadora en mano, un 73% de las visitas totales (de una muestra de más de 25.000 visitas) tenían una resolución de más de 1280px de ancho, lo que significa que podríamos ampliar ese lienzo mínimo hasta otra cantidad igual de divisible que 960px sin riesgo a que aparezca scroll horizontal, como por ejemplo, 1200px.

1200-grid-system

Esta nueva resolución nos da la misma divisibilidad y, sobre todo, más espacio para mejorar la disposición de contenidos, aumentar el tamaño de la tipo o hacer contenedores más grandes sin necesidad de hacerlos fluidos. Para las resoluciones restantes siempre podremos adaptar el diseño a medidas relativas pero lo que presentemos al cliente se ajustará a la realidad de la mayoría de visitantes.

Para los que trabajéis con photoshop o illustrator os dejo ambos grids como plantillas ya preparados para trabajar:

960.GS 1200PX