4 cosas que todo diseñador debe saber sobre los espacios en blanco

El espacio en blanco (o «espacio negativo») es un espacio vacío entre y alrededor de los objetos de una página. Los elementos del espacio en blanco en las interfaces gráficas de usuario son:

• Márgenes, acolchados y canaletas
• Espacio alrededor de imágenes y objetos gráficos.
• Espaciado entre líneas y espaciado entre letras dentro del contenido del texto

Aunque algunas personas pueden considerar el espacio en blanco como una pérdida de valioso espacio en la pantalla, es un elemento esencial en un diseño. De hecho, los espacios en blanco son tan importantes como el contenido. Como dijo Jan Tschichold:

Todas las buenas interfaces de usuario incorporan valores de espacios en blanco adecuados en todos los elementos de la página de arriba a abajo. El espacio en blanco de una página puede ser tan importante como el espacio ocupado por los elementos de la interfaz de usuario porque el texto, los botones, los logotipos y otros objetos necesitan espacio para respirar.

En este artículo, encontrará cómo usar espacios en blanco en sus diseños para darle una sensación limpia y ordenada:

1. Mejorar la legibilidad del texto

El espacio en blanco puede facilitar la lectura al reducir la cantidad de texto que los visitantes ven todos a la vez. La falta de espacios en blanco (página desordenada) no hace que los usuarios quieran leer el contenido. Por otro lado, se ha demostrado que los espacios en blanco utilizados correctamente aumentan la comprensión del texto hasta en un 20%, como lo señala Dmitry Fadeyev.

Dos cosas importantes a tener en cuenta al optimizar su contenido de texto son márgenes de párrafo y Espaciado entre líneas (el espacio entre cada línea en su texto). Este último puede mejorar drásticamente la legibilidad de un cuerpo de texto. Generalmente, cuanto mayor sea el espaciado, mejor experiencia tendrá el usuario mientras lee (aunque demasiado espacio entre líneas puede hacer que las líneas se desconecten).

2. Aclarar las relaciones

Todo el diseño surge de la suma de sus partes y las relaciones de contenido se definen mediante espacios en blanco circundantes. La ley de proximidad establece que los objetos cercanos entre sí parecen similares. El espacio en blanco actúa como una señal visual en este caso. Hecha un vistazo a la imagen de abajo:

Las leyes de la Gestalt dictan que los objetos cercanos aparecerán como una «unidad»; el espacio en blanco actúa como una señal visual.

Casi todos los que ven esta imagen notan dos grupos de círculos, en lugar de simplemente 12 círculos. Los círculos son todos idénticos y la única diferencia entre ellos es la cantidad de espacio en blanco que los separa.

Es posible agrupar elementos reduciendo el espacio entre ellos y aumentando el espacio entre ellos y otros elementos en la página.

Para las interfaces de usuario, esto significa que los objetos cercanos aparecerán como una «unidad». Por ejemplo, en el contexto de los formularios web, es una buena idea colocar etiquetas cerca de los campos relevantes para crear un objeto. Cuando las etiquetas se colocan más cerca de los campos, la relación entre ellos es mucho más clara para los usuarios.

La información se comunica con mucha más claridad cuando las etiquetas se colocan más cerca de los campos con los que se relacionan.

3. Atraer la atención

Los diseñadores pueden utilizar espacios en blanco para comunicar lo más importante de un vistazo. Existe una relación entre la distancia y la atención; una distancia mayor obliga a prestar atención. La falta de otros elementos solo hará que los elementos existentes se destaquen más. Es posible utilizar un espacio en blanco para su ventaja, para atraer miradas errantes hacia ciertos elementos de la página. El relleno adicional alrededor de un segmento particular de contenido fuerza la atención de los usuarios hacia esa área simplemente porque no hay nada más en la pantalla que llame la atención. Por lo tanto, cuanto más espacio en blanco hay alrededor de un objeto, más atrae la atención hacia él.

4. Cree una jerarquía visual

Cuando el espacio en blanco se usa de manera apropiada, permite que una página cree un flujo y equilibrio general, lo que a su vez ayuda a comunicar la intención del diseño. Los espacios en blanco pueden soportar la jerarquía general. Produce simetría o asimetría.

La simetría crea memoria y armonía:

Mailchimp, como puede ver, es un gran defensor del espacio en blanco en sus diseños. Cuando los visitantes escanean la página de inicio, el botón «Registrarse gratis» llama su atención casi de inmediato. Usando la simetría es posible crear un diseño equilibrado con partes derecha e izquierda igualmente importantes.

Mientras que la asimetría llama la atención:

La asimetría es excelente para llamar la atención sobre un área particular de la página.

Cuando un elemento utiliza un espacio asimétrico, se destaca frente a otros elementos circundantes.

Conclusión

El espacio en blanco no es un espacio desperdiciado, es una poderosa herramienta de diseño. Puede ser tan importante como el espacio ocupado por imágenes, texto u otro objeto de interfaz de usuario porque incluso el espacio vacío tiene un propósito y respalda la integridad visual de un diseño.

Aunque parece un tema simple, el espacio en blanco puede ser difícil de dominar porque la aplicación del espacio en blanco es tanto arte como ciencia. Comprender realmente cuánto espacio en blanco debe usarse para crear un buen diseño requiere práctica.