4 cosas que todo diseñador debería saber sobre el espacio 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, rellenos y canaletas
- Espacio alrededor de imágenes y objetos gráficos
- Espaciado de línea y espacio entre letras dentro del contenido de texto
Aunque algunas personas pueden considerar que el espacio en blanco es un desperdicio de valioso patrimonio de pantalla, es un elemento esencial en un diseño. De hecho, el espacio en blanco es tan importante como el contenido. Como dijo Jan Tschichold:
El espacio en blanco debe considerarse como un elemento activo, no como un fondo pasivo
Todas las buenas interfaces de usuario incorporan valores adecuados de espacios en blanco en todos los elementos de página de arriba a abajo. El espacio en blanco en 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ás cómo usar espacios en blanco en tus diseños para darle una sensación limpia y despejada:
1. Mejore la legibilidad del texto
El espacio en blanco puede facilitar la lectura al reducir la cantidad de texto que los visitantes ven a la vez. La falta de espacio en blanco (página saturada) no hace que los usuarios quieran leer el contenido. Por otro lado, se ha demostrado que el espacio en blanco correctamente utilizado aumenta 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 los márgenes de párrafo y el espaciado de línea (el espacio entre cada línea en su texto). Esto último puede mejorar drásticamente la legibilidad de un cuerpo de texto. En general, cuanto mayor sea el espaciado, mejor será la experiencia que tendrá el usuario mientras lee (aunque un espaciado de línea demasiado grande puede hacer que las líneas se desconecten).
2. Relaciones aclaratorias
El diseño completo surge de la suma de sus partes y las relaciones de contenido se definen por el espacio en blanco circundante. 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 Gestalt dictan que los objetos en las proximidades aparecerán como una "unidad"; el espacio 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 espacios en blanco que los separa.
Es posible agrupar elementos al disminuir el espacio entre ellos y aumentar el espacio entre ellos y otros elementos en la página.
Para las interfaces de usuario, esto significa que los objetos en las proximidades 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, esto hace que la relación entre ellos sea mucho más clara para los usuarios.
La información se comunica mucho más claramente 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 usar el espacio en blanco para comunicar lo que es más importante de un vistazo. Hay una relación entre distancia y atención; una mayor distancia obliga a la 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: dibujar ojos errantes en ciertos elementos de la página. El relleno extra alrededor de un segmento particular de contenido obliga a la atención de los usuarios a esa área simplemente porque no hay nada más en la pantalla que llame la atención. Por lo tanto, mientras más espacios en blanco esté alrededor de un objeto, más se atraerá hacia él.
4. Crear jerarquía visual
Cuando el espacio en blanco se usa apropiadamente, permite que una página cree un flujo y equilibrio general, lo que a su vez ayuda a comunicar el propósito del diseño. El espacio en blanco puede 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 igualmente derechas e izquierdas.
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 objetos de imágenes, texto u otras interfaces de usuario porque incluso el espacio vacío cumple una función y es compatible con la integridad visual de un diseño.
Aunque parezca 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 se debe usar para crear un buen diseño requiere práctica.