Disegnare un sito Web con Photoshop

Avere un sito Web significa poter dimostrare a tutta rete cosa si è in grado di fare, il prodotto che si commercializza, il servizio che si offre. Un sito Web deve sicuramente essere ricco di contenuti, deve rispondere alle domande che l’utente si pone, deve essere chiaro. Tuttavia non bisogna sottovalutare la grafica: le immagini, i colori e i font devono essere accuratamente scelti affinché nel sito ci sia armonia.

E’ proprio alla grafica Web che questo articolo vuole riferirsi: cercheremo di realizzare un sito Web con Photoshop. A questo punto dobbiamo scegliere a chi vogliamo rivolgerci e cosa deve contenere il nostro sito. Nel nostro caso andremo a realizzare un sito di gestione dei contenuti che si rivolge a un’utenza varia. Dopo aver definito i colori da usare e i font da applicare, il passo successivo rappresenta la chiave del nostro sito: la struttura. Una volta definita la struttura sarà possibile realizzare siti dalla architettura anche complessa. Il nostro sito dovrà contenere cinque sezioni: la prima dedicata a contenere il logo; la seconda dovrà contenere i menu; la terza, opzionale, dovrà contenere uno slogan; la quarta e la quinta informazioni varie.

Adesso dividiamo in due la quarta sezione e in tre la quinta.

Lavoriamo sulla prima sezione colorandola con una gradazione di giallo.

Per personalizzare il sito Web andremo a inserire il nostro nome e il logo.

Nella seconda sezione inseriremo il menu per consentire la navigazione fra le pagine del sito.

La terza sezione è destinata a contenere uno slogan.

La quarta sezione conterrà due informazioni. Sulla sinistra andremo a inserire una breve presentazione mentre quella a destra conterrà gli ultimi progetti realizzati.

L’ultima sezione è invece destinata a contenere tre notizie.

La parte relativa alla grafica è stata completata, non ci resta che trasformare il bmp in XHTML e il nostro sito Web sarà pronto per il debutto.