Z pattern

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.

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.

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.

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

• home page senza barra di scorrimento;
• landing page;
• pop up;
• opt in page.

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

• Web UI Design: best practices
• Attention web designers: You have 50 milliseconds to make a good first impression!

• Progettazione dell'esperienza utente
• Oculometria

• Wikimedia Commons contiene immagini o altri file su Z pattern

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