Grafica  »  Articoli  »  Teoria grafica 

I principi della Gestalt e l'impaginazione di una pagina Web

di: Rossella Facchini     05 Settembre 2003

Chiusura:Linee e forme familiari vengono percepite come chiuse e complete, anche se graficamente non lo sono.

Chiusura

Descrivendo la figura dell'esempio, diremmo che vi sono rappresentati un cerchio e un quadrato con tratto non continuo, ma la forma percepita e riconosciuta è quella della figura completa. Allo stesso modo possiamo leggere la parola 'PRO' anche se nessuna delle lettere è chiusa e completa.

Questo principio ha molti riscontri nell'impaginazione. Primo fra tutti l'allineamento: organizzare lo spazio secondo linee e rettangoli invisibili aiuta il lettore a capire la strutturazione e l'organizzazione della pagina. Per questo motivo, in molte occasioni, è sconsigliabile l'uso dell'allineamento centrato.

Ci si può avvalere di questo principio anche per sfruttare 'virtualmentÈ lo spazio che realmente non abbiamo a disposizione. Come si è detto, la nostra percezione di un'immagine va oltre ciò che è rappresentato sulla pagina, così quando lo spazio a disposizione è poco, possiamo sfruttare anche quello 'immaginato' da chi guarda. Eccone un esempio:

Anche se l'immagine della bicicletta nella prima figura è molto più grande dello spazio a nostra disposizione, la ricosciamo perfettamente e la 'vediamo' completa, come nella seconda figura.

Figura-sfondo: Le figure vengono percepite prima di tutto dal proprio contorno, il resto viene inteso come sfondo.

Figura-sfondo

Nell'esempio è rappresentato un classico delle illusioni ottiche. Possiamo vedere inblu due visi, uno di fronte all'altro, su sfondo bianco o anche un vaso bianco su sfondo blu.
A seconda di cosa percepiamo come 'figura' classificheremo gli elementi restanti come 'sfondo'.

Questo principio si trasforma in grafica nel più famoso principio del contrasto. Proprio perchè le figure vengono riconosciute grazie al loro contorno, con più la figura sarà in contrasto con lo sfondo (e con gli altri elementi), più facile sarà riconoscerla e ricordarla, e maggiore sarà l'importanza che le verrà quindi data.

Si può perciò utilizzare questo criterio per rafforzare i titoli e dare risalto aglielementi che gerarchicamente hanno più importanza degli altri.

Ecco alcuni esempi:

Nella figura 1. e 2. il testo è in contrasto sia con lo sfondo che con la sua 'ombra'. Nella figura 3. e 4. il testo e l'ombra non hanno contrasti fra di loro e l'ombra non viene percepita come tale ma l'occhio tenta di leggere il testo specchiato come fosse un sottotitolo (è infatti percepito come tale per la differenza di dimensione).

Guide Grafica

3D Studio Max - Guida alla modellazione

Dall'interfaccia alla creazione e modellazione di oggetti...

Guida Photoshop CS5

Modifica e ottimizzazione dell'immagine, strumenti di disegno e...

Guida Photoshop CS4

Disegno, fotoritocco, effetti con Photoshop CS4: impariamo a usare...

Altre guide

Newsletter @Grafica e Web Design

Ogni settimana, direttamente nella tua e-mail: guide, articoli, tutorial e FAQ su Web Design e grafica per il Web.

Iscriviti alla newsletter

Altre newsletter

Corsi in aula

Corso Google AdWords Base

25 Giugno 2012 a Milano
Disponibilità: 7 Posti

Corso Google AdWords Base

05 Giugno 2012 a Roma
Disponibilità: 7 Posti