Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Tendenze grafiche 2.0

Il look and feel di un sito nell'era del Web 2.0 e oltre
Il look and feel di un sito nell'era del Web 2.0 e oltre
Link copiato negli appunti

L'aspetto più evidente di un sito agli occhi di utenti esperti e non è l'aspetto grafico, il cosiddetto “look and feel”, che, come dice il termine stesso, indica la cosa che più immediatamente colpisce
nell'entrare in un sito internet.

La grafica si è evoluta insieme alle tecniche XHTML e CSS oltre che con le più moderne techiche Ajax che permettono una maggiore interazione dell'utente con il sito nella cosiddetta era del Web 2.0. Si è evoluta perché maggiori sono diventate le possibilità di implementare aspetti grafici che senza l'uso dei CSS erano pressoché impossibili.

L'era del Web 2.0, inoltre, è stata affiancata, casualmente o meno, da una moda grafica piuttosto
definita e che andremo qui ad evidenziare insieme ad altre tecniche recenti. Per meglio capire gli aspetti di questa tendenza (ebbene sì, anche nel web esistono le mode) procederemo per esempi:

Figura 1 - DesignBits, esempio di design 2.0 (click per ingrandire)
DesignBits - esempio di design 2.0

La luce come elemento primario

Come Caravaggio, che ne sapeva qualcosa, anche i moderni web designer hanno capito che i punti luce sono quelli che richiamano attenzione e danno risalto ed emozione agli elementi di una rappresentazione grafica. Ed ecco un fiorire di:

  • fonti luminose (vedi l'alone più chiaro nella fascia centrale azzurra);
  • luci ed ombre (il logo stesso ha una sfumatura da chiara a più scura dall'alto verso il basso e
    la fascia inferiore bianca ha una leggera ombratura nella parte superiore);
  • riflessi più o meno realistici, soprattutto su superfici lucide (le tre immagini di anteprima dei siti nella fascia azzurra);
  • bottoni e “call to action” tondeggianti o dal lettering evidente ma elegante al tempo stesso.

Notate inoltre come un buon lettering renda elegante e al tempo stesso chiaro un titolo, un paragrafo, una lista, se dietro c'è un minimo di studio della tipografia. Usare due tipi di font, ad esempio, aiuta in questo, e in questo sito è infatti evidente come l'uso di un Georgia, non appesantito dal bold di default dei titoli h1, h2, etc, renda più armonioso il rapporto con l'Arial/Helvetica del resto del sito.

Tutto è ancora più evidente e tondeggiante in quest'altro esempio:

Figura 2 - Quaffs Labs - Web 2.0 alla massima potenza (click per ingrandire)
Quaffs Labs - web 2.0 alla massima potenza

Oltretutto, in casi estremi di “webbite 2.0” i pulsanti, i titoli, i menu diventano esageratamente grandi, forse a causa di un'evoluzione delle risoluzioni dei browser dei designer, a cui sembrava tutto troppo piccolo? O ancora perchè, affiancandosi a prodotti molto interattivi, era necessario rendere più accessibile il click o il trascinamento degli elementi della pagina?

Fatto sta che questo tipo di grafica ha preso piede anche per prodotti molto semplici e poco interattivi, rendendo molto “giocoso” e brillante il web di questi ultimi tempi.

Poi c'è chi gioca molto con il proprio gusto estetico e non si uniforma a mode e tendenze estemporanee, o personalizza a suo modo prendendone solo spunto. Ed ecco che fioriscono migliaia di designer dal gusto davvero personale e piacevole.

Il vettoriale, gli illustratori e il “grunge”

Primo fra tutti Nick La, web designer e illustratore di Toronto che con le sue illustrazioni ha colpito l'attenzione di molti del settore, diventando capillarmente noto anche per alcuni suoi template di WordPress e set di icone free molto usati ovunque.

Oltre al suo blog personale gestisce anche un progetto che molti conosceranno e che è diventato un punto di riferimento e di ispirazione per molti, Webdesignerwall, di cui vedete di seguito un'anteprima:

Figura 3 - Webdesignerwall - Ispirazione per molti web designer (click per ingrandire)
Webdesignerwall - ispirazione per molti webdesigner

La grafica è una mixture fortunata di illustrazioni e grunge, una nuova tendenza che si va affermando sempre più e che si riassume in pochi elementi grafici che vanno dall'uso di pennellate “sporche”, di texture “cartacee” e di colori opachi e talvolta tenui, al contrario del trend 2.0, e con caratteri tipografici calligrafici. Talvolta questa grafica viene associata da amanti degli anni '50 a illustrazioni o riproduzioni di elementi tipici delle pubblicità illustrate dell'epoca: dal viso entusiasta di un personaggio a 36 denti all'elettrodomestico o automobile d'epoca. Ovviamente dove l'uso degli stessi c'entri qualcosa con il tipo di sito o sia una metafora di ciò che si vuole rappresentare.

Il nuovo web

Quali saranno le tendenze del 2009? Solo il tempo potrà dircelo. Certo è che quando qualcuno tira fuori un'idea graziosa e funzionale tutti cominciano a copiargliela, e ben presto si può scoprire se essa funzioni o meno perché prende a diffondersi su larga scala su migliaia e migliaia di siti. Volete mettere la soddisfazione di aver creato qualcosa di unico e da imitare? Non illudetevi, perchè nel web tutto si copia e si riadatta a proprio gusto, e alla fine ogni sito è una piccola creazione unica e a sé stante... e forse proprio per questo è ancora più unica e soddisfacente.

Siti di riferimento:

Ti consigliamo anche