Gutenberg

Diagrama de Gutenberg en diseño web

Este es quizás el patrón de diseño más utilizado en la historia, ya que la estructura que propone se puede ver representada tanto en escritos, carteles, publicidad e inclusive en la televisión. Lo que nos define este diagrama, en principio, es una estructura basada en el movimiento que sigue el ojo humano por inercia, este movimiento hace que se termine presentando más atención a ciertas partes del objeto desplegado, por lo que dichas partes toman más relevancia en el diseño.

Si nos decidimos en utilizar este patrón, entonces a la hora de realizar un diseño web debemos de tener muy en cuenta las siguientes indicaciones para distribuir ordenadamente todos loselementos:

• Nuestra área de exposición estará dividida en cuatro partes.
• Cada cuadrante representa una zona óptica.
• La más importante de ellas es la ubicada en la parte superior izquierda y recibe el nombre de zona primaria.
• La siguiente en la estructura es la zona de barbecho fuerte, que se encuentra ubicada en el extremo superior derecho.
• En la parte inferior izquierda encontramos la zona que presenta menos atención, la zona de barbecho débil.
• Finalmente en la parte inferior derecha se encuentra la zona terminal.

El hecho de utilizar este diagrama para la realización de nuestros diseños, traerá consigo una armonía con la gravedad normal de lectura, permitiendo al usuario seguir una orientación familiar, mejorando de esta manera la comprensión del contenido.

Este resultado se logra gracias a la costumbre, ya que las personas occidentales comúnmente realizan una lectura que va descendiendo por una serie de barridos hasta llegar a la zona terminal.

Para este patrón de diseño las zonas que presentan menor atención son la esquina superior derecha e inferior izquierda, y en caso de querer atraer atención a esas partes es necesario incluir un elemento llamativo que enfatice de alguna manera la zona. Es por esto que el contenido relevante debe seguir la diagonal que va de la esquina superior izquierda a la inferior derecha.

Un uso a este patrón que generalmente se da en los sitios web, es cuando se coloca el logo en la zona principal, el contenido importante se despliega en la zona de en medio y alguna información de contacto o de registro se coloca en la zona terminal.

Es recomendado utilizar este patrón cuando presentamos grandes cantidades de texto, si este no es tu caso y tienes bien definida una jerarquía visual, quizás sea recomendable utilizar otro tipo de patrón.