Layout z-pattern o Diagramma di Gutenberg

Layout z-pattern è un modo di distribuire contenuti omogenei in una pagina web a schermata unica, senza scroll e divisa idealmente in quattro quadranti secondo il Diagramma o Regola di Gutenberg, che in Occidente asseconda il movimento naturale dello sguardo durante la scansione dei contenuti testuali e multimediali.

Elenco caratteristiche del layout z-pattern:

1. i contenuti della schermata sono omogenei;
2. i contenuti sono scritti per gli occidentali;
3. in caso di contenuti eterogenei il Diagramma di Gutenberg non si applica;
4. in caso di scrittura e lettura da destra verso sinistra il Diagramma di Gutenberg non si applica;
5. la forza gravitazionale della lettura conduce lo sguardo dall’alto verso il basso e da sinistra verso destra;
6. la schermata è divisa in 4 quadranti in successione, da sinistra verso destra e dall’alto verso il basso;
7. il primo quadrante è in alto a sinistra ed è la zona di inizio scansione o area ottica primaria, secondo il Diagramma di Gutenberg;
8. il secondo e il terzo quadrante rispettivamente in alto a destra e in basso a sinistra sono zone di passaggio e ricevono poca attenzione a meno che non siano messe in risalto visivamente;
9. il secondo quadrante è detto forte per la posizione e per l’asse di orientamento della lettura;
10. il quarto quadrante è la zona di fine scansione e la stazione di arrivo della scansione dei contenuti;
11. gli elementi chiave sono posizionati nel primo (logo, titolo) e nel quarto quadrante (informazioni di contatto, call to action);
12. eventuali immagini sono poste al centro;
13. la scansione fatta dagli occhi sui contenuti della pagina web disegna una z, che fornisce il nome alla distribuzione dei contenuti nella schermata.

Il Diagramma di Gutenberg è generalmente attribuito a Edmund Arnold

Esempio di layout z-pattern

Guarda l’Infografica Guida completa allo z pattern layout