Prima di iniziare, a percorrere alcune fasi importanti della grafica, mi occorre fare una premessa sul mio sito: Questo sito, nasce con l'intenzione di esporre al meglio i miei lavori, attraverso un cv elettronico, farli conoscere alla gente, affinchè si possa affidare a me se ritiene giusto che io sia all'altezza di realizzarli, qualunque esso sia. Al giorno d'oggi la grafica è strettamente legata all'uso del computer. E' difficile trovare grafici che lavorino alla vecchia maniera, con squadre, compassi, pastelli o matite, per il semplice fatto che l'uso del computer facilita e velocizza il processo di produzione. Permette di sbagliare, cancellare, provare e riprovare. Chiunque potrebbe realizzare uno stampato, grazie ad un computer e qualche software di grafica diventati ormai alla portata di tutti. Chiaramente si distingueranno grafici cosiddetti "amatoriali" del biglietto da visita creato in word e grafici professionisti che lavorano con software professionali, soprattutto con un bagaglio di studi grafici alle spalle. Il rischio, cosi come oggi accade spesso è quello di imbattersi in progetti grafici; discutibili e oggettivamente poco comunicativi. Per fare grafica ad un certo livello, occorre sì un computer con cui lavorare e dei buoni software professionali, ma prima di tutto è necessario ottenere risultati gradevoli dal punto di vista estetico, ed efficaci per quanto riguarda l'aspetto comunicativo.

Fatta questa premessa possiamo dire chel’impatto visivo di una pagina web è importante: è la prima informazione che riceviamo, prima ancora di poterne valutare i contenuti, i servizi offerti, la facilità di navigazione, etcc. Due elementi essenziali; a dare la prima impressione al navigatore è l’aspetto e la velocità di caricamento.

Estetica: Un sito web ben fatto graficamente conferisce identità all’azienda oltre che al sito stesso. La grafica di norma deve essere leggera, non deve distrarre il navigatore, ne appesantirlo con contenuti pacchiani e poco utili. Fate delle immagini un uso parsimonioso (rallentano il caricamento della pagina) e armonico al contenuto. Non esagerate con le animazioni: sono tanto carine, ma, oltre a conferire un aspetto da paginetta web vecchio stile, distraggono il navigatore, ricordate che anche i banner che ormai troviamo dappertutto, sono in genere immagini animate.

Impostazione: Per decidere che impostazione grafica dare al sito è bene avere chiari in mente i contenuti e il target dei navigatori. Ad esempio se decidiamo di realizzare un sito; con molto testo scritto, sarà il caso di usare un fondo chiaro (bianco o al massimo una sfumatura leggera di un colore pastello). Mentre se avrà poco testo ma molte immagini, sarebbe meglio usare uno sfondo scuro (nero o blu notte) che dia risalto alle immagini fotografiche. Sfondi di colori vivaci (tipo rosso, verde, etcc.) rendono faticosa la lettura. Naturalmente, testatine, bottoni, barre di navigazione e altri elementi grafici possono essere invece colorati. Ma è importante anche distinguere fra diversi tipi di contenuto.

Contenuti: Per esempio, il sito di una rivista letteraria avrà un impatto grafico diverso da quello di una banca o una compagnia di assicurazioni. Nel primo caso bisogna rievocare concetti quali cultura, piacere della lettura, ecc. Nel secondo bisogna comunicare sensazioni quali affidabilità, serietà, solidità. Quindi, per esempio, fregi floreali e la gamma dei marroni e dell’avorio per la rivista letteraria; geometrie astratte giocate sul bianco e la gamma dei blu per il secondo; o ancora, foto che fanno sognare, unite a frasi invitanti per un sito turistico.

Navigatori: L’altro elemento da tenere in considerazione è il nostro pubblico potenziale. Prima di cominciare è bene chiedersi: a chi si rivolge il mio sito? Chi può trovarlo interessante/utile?Se si tratta di un target molto preciso ciò può determinare l’impostazione grafica: per esempio, disegni a volontà e scritte grandi e coloratissime se ci rivolgiamo a bambini, ricercatezza grafica ed effetti speciali per un pubblico di “addetti ai lavori” (grafici, artisti, ecc.), essenzialità e ricchezza di informazioni, senza troppi fronzoli decorativi, se il nostro navigatore tipo è un professionista alla ricerca di informazioni. Se stiamo progettando l’impostazione grafica di un sito aziendale è bene che questa sia coerente con l’immagine coordinata aziendale. Prendete la carta intestata, i bigliettini da visita, le brochure, l’insegna, la targa sul portone, le scritte sui furgoncini, le etichette e le confezioni dei prodotti, ecc. Immaginate di disporli su un grande tavolo: notate un’armonia visiva? Una ripetizione di elementi grafici, di colori, di stile, di caratteri tipografici usati? In caso affermativo, quell’azienda ha un’immagine coordinata ed è bene che anche il sito web sia in armonia con essa.

Da evitare: Anche se è impossibile rifarsi a una preesistente immagine coordinata, è importante che una coerenza grafica caratterizzi il sito. Quindi è bene scegliere un’impostazione grafica che sia adatta a tutte le parti del sito, presenti e future; evitare che gli eventuali sfondi e/o cornici cambino a ogni pagina e che ci siano, invece, degli elementi grafici ricorrenti (questa caratteristica si rivelerà doppiamente utile, come vedremo in seguito). Donerà al sito anche un tocco di eleganza e professionalità.

Risoluzione: Un’altra considerazione preliminare riguarda la peculiarità grafica di una pagina web. Siamo tutti facilmente portati a immaginare e a definire un progetto grafico come qualcosa di preciso e determinato, come una pagina a stampa. Scelgo il carattere, il colore, la posizione precisa di testo e immagini, imposto gli allineamenti, ecc. Le migliaia di copie stampate di quel progetto (rivista, brochure, o volantino che sia) saranno tutte perfettamente identiche.Per una pagina web non è così. Io preparo delle pagine in un codice chiamato html, che “dice” al browser cosa visualizzare e come farlo. Ma il come visualizzare varia, e non poco. Tali variazioni dipendono dal:

* sistema operativo: Windows, MacOS, Linux, Unix
* dimensioni del monitor (14’, 15’, 17’, 19’…)
* risoluzione (640 x 480, 800 x 600, 1024 x 768…)
* browser (Netscape, Explorer, Mozilla Fire fox, Opera etc..)

È bene partire dal fatto che il nostro sito non sarà mai assolutamente identico se visto su piattaforme diverse, e quindi dovrà essere adattabile, avere una struttura flessibile. Consideriamo, poi, che la maggior parte degli utenti usa una risoluzione 800 x 600, e possiede un monitor 15’: quindi progettiamo il sito in quella gabbia. Chi usa una risoluzione maggiore, e/o un monitor più grande lo vedrà comunque bene; se ha il browser aperto a tutto schermo, ci sarà più sfondo ai margini.

Font: Altro elemento molto importante sono i caratteri (font). Il browser interpreta il codice html in cui può essere specificato il carattere, ma potrà visualizzarlo solo a condizione che quel carattere sia installato sul computer dell’utente. Se proprio vogliamo usare delle font diverse (magari per i titoli, o per il menu), dobbiamo ricorrere a un programma di grafica prepariamo delle immagini che abbiano lo stesso sfondo su cui andranno a inserirsi, oppure uno sfondo trasparente, e il testo scritto nel carattere prescelto. Questa soluzione è a volte usata anche per comporre lunghi pezzi di testo, che risulta così fisso e magari anche formattato. C'è un altra cosa molto importante da sapere sull'arte grafica, ne esistono due tipi diversi che è bene conoscere e imparare a distinguere. La spiegazione appropriata la trovate alla voce del sito grafica.