La armonía en una interfaz visual, implica muchas variables en el diseño, pero una de las más importantes es el espacio en blanco o “espacio negativo”, debe ser considerado como un elemento de gran valor.
“El espacio en blanco debe ser considerado como un elemento activo, no un fondo pasivo.” — Jan TschicholdPara ofrecer una buena experiencia a tus usuarios, y si hablamos del espacio en blanco, sabemos que además de dar más claridad (descanso a la vista), aporta claridad y guía los ojos del usuario a la información más importante que ofreces. Recordando que, este espacio no tiene porque necesariamente “llenarse”, tampoco tiene que ser necesariamente banco.
Veamos este listado:
En el ejemplo del listado, el nombre del escritor y la fecha están más próximos que el siguiente elemento de la lista ¿La información no queda más clara en la imagen de la derecha?
La proximidad hace que los objetos parezcan unificados – Ley de Gestalt -, de esa forma el espacio en blanco ayudaría a dar esa sensación de separación.
“El valor de una transparencia no se determina por la cantidad de información que contiene, sino por la claridad con que comunica su mensaje.” — Nancy DuarteEs repetitivo, lo habrás visto en varias imágenes por internet, pero – menos es más – una frase que sigue predominando, un mantra muy eficaz para tu interfaz visual.
Un claro ejemplo de ello, son los espacios negativos del que todos estamos familiarizados: Google. Esta simple y clara interfaz visual nos permite centrar en lo más importante: la búsqueda.
Puedes empezar a analizar hoy mismo y aplicarlos en tu web, app, software y tu blog. ¿cómo puedo reducir los elementos para hacer más agradable mi interfaz?:
- Espacio alrededor de tus gráficos y imágenes
- Márgenes entre listados y menús.
- Interlineado y espaciado de letras en tus contenidos textuales.
- Espacio entre las columnas de tu web: encabezados, pie de página, bloques de textos.
Si los textos de tu web son muy pequeños, ¿crees que estás ofreciendo a tus usuarios la experiencia que esperan? Apunte: no tienen la misma capacidad visual, un usuario que tenga 20 años, que uno de 60 años.
Legibilidad: Vamos a priorizarla.
Tus usuarios van a escanear y leer por encima en búsqueda de información importante en tu web, para ello, lo ideal es que ofrezcas una buena legibilidad, para que pueda diferenciar lo más destacable y que le pueda servir o textos que puede descartar.
Un estudio en el laboratorio de investigación de la Universidad de Wichita, confirma que el aumento de los espacios en blanco aumenta la compresión lectora y disminuye la velocidad de lectura.
“Utilizando adecuadamente los espacios en blanco entre los párrafos y en los márgenes izquierdo y derecho se puede aumentar la comprensión de hasta un 20%.” — Dmitry Fadeyev
¿Y cómo lo aplico?
Hagamos una comparación entre la presentación de Bill Gates – a la izquierda -, y de Steve Jobs – imagen de la derecha-:
En la presentación de Gates, los colores causan ruido visual, las letras son muy pequeñas, casi ilegibles. En cuanto, la presentación de Jobs es clara, tiene elementos visuales atractivos y es minimalista.
Si hablamos de optimización de tus textos…
Destacaremos dos cosas: los márgenes de tus párrafos y el interlineado (espacio entre líneas). Con el interlineado le damos una gran vuelta a la legibilidad, es decir, cuanto más espacio damos, mejor será la lectura, pero ojo, hay que tener un límite, ya que el interlineado en exceso puede romper totalmente la unidad y desequilibrar tu diseño por completo.
Y si hablamos de márgenes…
Espacios elegantes
Al deshacerte de los elementos que causan ruido visual en tu diseño, probablemente puedas dar una sensación de mayor sofisticación y elegancia:
Paninibay
Philip House
Vspicer
Lapka
Jac&
En resumen, el espacio negativo no es un desperdiciar un espacio, es ganar clareza y objetividad. Si ignoramos la importancia de esto en un diseño, también necesitamos saber que ignoramos los beneficios que puede traernos.
Fuentes:
→ A list apart
→ Team tree House
→ Babich