Principios Universales de Diseño: El Diagrama de Gutenberg

Gutenberg será siempre un nombre de referencia, para cualquier generación, gracias al invento de Johannes. Curiosamente este nombre da el nombre al diagrama de Edmund Arnold, un diagrama que describe el patrón general seguido por los ojos cuando ven información distribuida de forma uniforme y homogénea.

Conocerlo puede ser importante para tu diseño web, y esto es lo que veremos en el artículo de hoy.

¿Cómo funciona el diagrama de Gutenberg?

El diagrama de Gutenberg divide el medio de visualización en cuatro cuadrantes:

1. El área óptica primaria - parte superior izquierda
2. El área de barbecho fuerte - parte superior derecha
3. El área de barbecho débil - parte inferior izquierda
4. El área terminal - parte inferior derecha

Este diagrama dice que los lectores occidentales empiezan en el área óptica primaria moviéndose en una serie de barridos hasta el área terminal.

Cada barrido o escaneo empieza en un eje de orientación y continúa en una dirección de izquierda a derecha. Las áreas de barbecho fuertes y débiles reciben una atención mínima si no hay énfasis visual.

Para que tu diseño web siga el diagrama y funcione en armonía con la gravedad de lectura, mejorando al comprensión de la lectura, deberías tener:

• Elementos clave en la parte superior izquierda (p.e.: logo, propuesta de valor), en el medio y en la parte inferior derecha (p.e: llamada a la acción).

Esa es una de las razones porque el diagrama también se llama “patrón z de procesamiento”. Aplicar este diagrama ayuda a mejorar la velocidad de lectura o la comprensión.

¿Cuándo usar el diagrama de Gutenberg?

Deberías pensar en utilizar el diagrama de Gutenberg en tu diseño web, si los elementos están distribuidos uniformemente y son homogéneos, o existe un uso intensivo de texto.

¿Usas el diagrama de Gutenberg en tus diseños? ¡Coméntalo abajo!

Foto: @kues1  @freepik