Tal vez una de las cosas más olvidadas en el diseño web es el diseño con grilla, esto es algo muy utilizado en los medios tradicionales (revistas y periódicos) pero apenas hace poco tiempo que se ha estado haciendo popular entre los diseñadores web. También se le conoce cómo grilla o retícula editorial.
Empecemos por definir que es una grilla (grid): En el contecto del diseño gráfico una grilla es un instrumento para ordenar elementos gráficos del texto y de las imágenes, aunque muchas personas pueden pensar que diseñar con grillas limita la creatividad pero no te preocupes que esto es un mito. Y no es por eso que no se ha adoptado por todos los diseñadores, es más bien porque la técnica de diseñar sitios web con grillas aún es desconocida por muchos diseñadores web.
Un ejemplo de diseño con grilla es el anterior que pertenece a vivaestudio, otro ejemplo práctico puede ser el sitio de OC Vision.
Recursos para diseñar con grids
- Design by Grid una de tantas galerías de sitios hechos con CSS pero enfocada más a los sitios que respetan el diseño con grilla aquí lo reseñan.
- Grid Calculator es una herramienta que nos crea una retícula basada en un tamaño de la letra, el número de columnas, el ancho de la columna y el ancho de canal.
- Grid Generator se trata de un generador de cuadrículas para guiarnos a la hora de diseñar, la cuadrícula generada es un archivo PNG descargable.
- Phiculator esto es simplemente una calculadora de secciones áureas Φ además la puedes descargar para Windows, Mac o en un SWF de Flash.
- Grid se trata de una imagen genérica que sirve cómo guía para la mayoría de los diseños web, creada por Cameron Moll.