Apri il menu principale

"Spesso è un ottimo punto di partenza per qualsiasi progetto grafico perché contiene i 4 principi di un design efficace."

Brandon Jones[1]

Z pattern (anche z layout, z-pattern layout o z-pattern design) è un tipo di impaginazione web che asseconda la scansione oculare dei contenuti su uno schermo.

È utilizzato dagli sviluppatori e dai grafici per la realizzazione di una landing page o, in generale, di una pagina web contenente poco testo.

Il movimento tracciato dallo sguardo sui contenuti web visualizzati sullo schermo forma una o più z consecutive.

Gli occhi procedono alternativamente da sinistra verso destra in senso orizzontale e dall'alto verso il basso in diagonale. Poi, ripetono il procedimento fino a giungere al termine.

Elementi di un z-pattern layoutModifica

 
Tracciamento della rotta seguita dallo sguardo su una pagina di Wikipedia

Un'impaginazione che usa lo z pattern layout comprende almeno i seguenti 4 elementi:

  1. elemento ottico primario, posizionato in alto a sinistra;
  2. elemento di forte attrazione, posizionato in alto a destra;
  3. elemento di debole attrazione, posizionato in basso a sinistra;
  4. elemento di richiamo finale, posizionato in basso a destra.

Sviluppatori web e grafici solitamente posizionano quali elementi 1 e 4 rispettivamente il logo e la call to action.

Caratteristiche fondamentali degli elementi principali dello z pattern layoutModifica

 
Studio sulla velocità di lettura di un testo.

L'elemento ottico primario è solitamente il primo elemento visualizzato dall'occhio dell'utente. L'elemento ottico primario è visual, cioè la sua caratteristica principale è il risalto dato al contenuto visivo. Può prefiggersi lo scopo di comunicare o confermare l'autore della pagina, sia esso un marchio aziendale o uno personale. Infatti, di solito nella posizione in alto a sinistra troviamo il logo di chi ha realizzato la pagina web.

Gli elementi di attrazione sono esplicativi, cioè spiegano perché rimanere in quella pagina web. Sono in secondo piano, cioè sono di sostegno agli altri elementi della pagina web e accompagnano lo sguardo dell'utente verso la fine della lettura.

Gli elementi di attrazione possono essere positivi, negativi o interrogativi cioè possono affermare o negare un concetto o, perfino, porre una domanda sullo stesso.

Gli elementi di attrazione sono forti o deboli esclusivamente per posizione e possono essere più di 2.

L'elemento di richiamo finale è conclusivo cioè risolve la questione posta prima della navigazione della pagina web o durante la navigazione della stessa.

L'elemento di richiamo finale è solitamente un pulsante con la call to action, che rinvia a un'ulteriore pagina dove compilare un form di contatto, completare l'acquisto di un prodotto o di un servizio, fare il log in in un sistema informatico online.

Applicazioni dello z pattern layoutModifica

 
Z pattern layout in una landing page di Wikipedia per la ricerca fondi

Lo z pattern layout trova applicazione nelle seguenti tipologie di pagine:

In tutti questi casi solitamente si assiste all'evidenza dei due elementi principali dello z pattern: elemento ottico primario ed elemento di richiamo finale. Lo sfondo è solitamente neutrale per evitare che catturi l'attenzione dell'utente.

Il layout z funziona perché contiene tutti i principi base di un design efficace:

  • branding della pagina web;
  • gerarchia dei contenuti;
  • struttura;
  • call to action.

Inoltre, il layout z funziona perché gli utenti concedono meno di 50 millisecondi ai grafici e agli sviluppatori web

NoteModifica

  1. ^ Capire il layout z nel web design, su webdesign.tutsplus.com.

BibliografiaModifica

Voci correlateModifica

Altri progettiModifica

  Portale Internet: accedi alle voci di Wikipedia che trattano di Internet