Metodología de construcción de sistemas grid para web.

Durante mucho tiempo, he estado usando sistemas de cuadrícula prefabricados, como la cuadrícula de base, por ejemplo, que consiste en una cuadrícula de 12 columnas de 70 px y canales de 30 px. Pero como mi pasión por el diseño busca la mejor armonía y proporciones posibles, me gustaría construir mi cuadrícula más adecuada a las necesidades específicas del proyecto.

¿Con qué unidad base debo comenzar mis cálculos?

¿Debo usar la altura de la línea base, la altura x del tipo de letra principal o tal vez algún otro valor significativo? He leído un artículo de tipografía más significativo en A List Apart de Tim Brown, pero él sugiere basarlo en el tamaño de la fuente, pero como señaló Erik Spiekermann, el tamaño real de la fuente depende de su familia.

Para mí, la altura x tiene sentido, ya que afecta mucho el espacio visual y el peso del diseño. Pero por otro lado, la altura de la línea marca el ritmo vertical.

Cuando tenga la unidad, ¿cómo decidir el ancho de la columna y del canalón?

Dado que puedo elegir la restricción del número de columna (dependiendo de la complejidad del contenido, ¿o tal vez debería considerar otros factores también?), Todavía necesito decidir sobre el ancho máximo del sitio web, el canal y el ancho de la columna.

Respuestas (2)

El problema de basarlo en tamaños de fuente es que es una unidad mayoritariamente arbitraria en una página web.

Con eso quiero decir que puede elegir un tipo de letra de 20 puntos.

Pero ¿qué significa eso?

Si es el tipo de letra que especificó, entonces tiene alguna suposición sobre qué tan grandes son los caracteres, pero si el usuario cambia eso por usted, o usa una fuente diferente, o lo que sea, los tamaños reales de los caracteres podrían ser algo bastante diferente.

Además de eso, es bastante trivial para el usuario final cambiar el tamaño de las fuentes en una página web, por lo que no hay garantía de que sea lo que especificó.

Pero, en resumidas cuentas, en realidad no importa cómo decidas construir tu cuadrícula. El punto de una cuadrícula es que tienes una cuadrícula. Aporta algo de orden y consistencia a su diseño. Las medidas reales de la cuadrícula dependen completamente de sus deseos y opiniones sobre lo que se ve mejor para sus necesidades.

Si entiendo esto correctamente, ¿quieres una cuadrícula basada en el tamaño de tu fuente? Personalmente, nunca me he molestado con todo este sistema de cuadrículas, al diseñar sitios, y solo hago las cosas a simple vista y busco lo que se ve mejor.

Creo que si tuviera que intentar basar un sistema de cuadrícula en el tamaño de mi fuente, la mejor manera de hacerlo sería usar valores em en lugar de valores px absolutos. De esa forma, los valores reflejarán su cambio en el tamaño de fuente.

En lugar de tener un objeto con atributos como este:

.myclass{
    width:70px;
    margin:15px;
}

Posiblemente podrías intentar algo como:

.myclass{
    width:10em;
    margin:4em;
}

El 10 y el 2 son solo números aleatorios que arrojé y obviamente tendrás que resolverlo por tu cuenta.

no se... es solo una idea. Como dije anteriormente, no sigo todo el asunto de la cuadrícula.