Diseño

088-091 -Diseno web Usr 204.qxp

3/14/08

2:46 PM

Page 88

WEBMASTERS Principios básicos del diseño gráfico en la Web

Rodrigo Galíndez rodrigogalindez@gmail.com

DISEÑO CON GRILLAS
DISEÑADOR WEB, APASIONADO

DESDE HACE UN PAR DE MESES, LA WEB HA VISTO EL RENACER DE UNA TÉCNICA DE DISEÑO TAN ANTIGUA COMO FUNDAMENTAL: EL USO DE GRILLAS TIPOGRÁFICAS O, SIMPLEMENTE, GRILLAS. VEAMOSDE QUÉ SE TRATA ESTA HERRAMIENTA FUNDAMENTAL EN EL KIT DE CUALQUIER DISEÑADOR WEB Y CÓMO SACARLE EL MÁXIMO PROVECHO.

POR TODO LO QUE VAYA DESPUÉS DE HTTP://

▼ Seguramente, los lectores que tienen conocimientos de diseño editorial han oído hablar de ellas. De hecho, son fundamentales para diseñar publicaciones como la revista que tienen en sus manos. Sin embargo, para los diseñadores web, lasgrillas no son muy conocidas, tal vez debido a la poca difusión que tuvieron hasta hace muy poco tiempo. Durante los años '50 las grillas fueron una par-

te fundamental de una corriente de diseño conocida como el Estilo Tipográfico Internacional o Estilo Suizo. La premisa de este estilo está en la búsqueda de la mera función a través de la legibilidad, la objetividad y la simpleza para cadapieza visual, mediante el uso de grillas, experimentando con tipografía y reduciendo los elementos visuales decorativos al máximo posible. Un trabajo inspirado en el estilo suizo es

fácilmente reconocible por el uso de tipografías sans-serif como Helvetica o DIN, una buena utilización del espacio en blanco y, en general, por una sensación de racionalidad y objetividad que se experimenta al ver eldiseño. Hoy, este estilo continúa influenciando el trabajo de muchos diseñadores web modernos. En los Estados Unidos, el mejor ejemplo lo podemos encontrar en el blog de Khoi Vinh, direc-

En busca de inspiración
Aunque una buena grilla ofrece un excelente punto de partida para diseñar un sitio, siempre es bueno tener en mente el trabajo de otros diseñadores y estudiar cómo ellos resolvieronlos mismos problemas de comunicación. A continuación, una lista de sitios recomendados para visitar en esos momentos en que la inspiración se hace rogar. SUBTRACTION (www.subtraction.com). En la Web, Khoi Vinh es el Wim Crouwel del diseño con grillas. Su sitio es una muestra clara de que el diseño con grillas es indispensable, también en la Web. SIMPLEBITS (www.simplebits.com). Recientementerediseñado, Simplebits es un ejemplo de simplicidad, buena tipografía y, claro, grid design. A LIST APART (www.alistapart.com). Tal vez el mejor ejemplo de tipografía bien aplicada y una grilla sólida respaldando todo. Diseñado por Jason Santa María (www.jasonsantamaria.com). THE NEW YORK TIMES (www.nytimes.com). Si tienen que justificar el trabajo con grillas ante un cliente, el sitio de la Gray Lady esel mejor ejemplo para mostrar. INTERNATIONAL TYPOGRAPHIC STYLE (www.flickr.com/groups/intertypostyle). En este grupo de Flickr, los miembros postean imágenes de pósters, sitios y otras piezas de diseño influenciadas por el estilo suizo, que, como vimos, se basa en el uso de grillas.

Tapa del libro Grid Systems in Graphic Design, de Josef Müller-Brockmann (se puede apreciar la grilla utilizadapara diseñar toda la publicación).

88

088-091 -Diseno web Usr 204.qxp

3/14/08

2:46 PM

Page 89

FOROS www.redusers.com/foros/webmasters

tor de diseño del New York Times Online. En Latinoamérica, diarios en la Web como Clarín de Argentina, recientemente rediseñado, demuestran claramente una inclinación al uso de grillas tipográficas para su armado. Las ventajas de diseñar con unagrilla de base son evidentes. El armazón de columnas y filas resultante, contrariamente a lo que se piensa, no limita la creatividad, sino que la anima. La grilla permite una disposición natural y segura de los elementos; como diseñadores, no tenemos que perder mucho tiempo pensando en dónde debemos colocar esa barra de navegación o qué ancho debe tener, ya que la grilla, al darnos una visión...