• News
  • Come creare il layout di un sito web

Come creare il layout di un sito web

Web Design
Come creare il layout di un sito web

In questo articolo di Web Design vogliamo mostrarvi quali sono le fasi di sviluppo per creare il layout di un sito web.

Di seguito sono indicate le fasi principali per la realizzazione di una singola pagina web o l’impaginazione di un intero sito web.

Partire dalle idee e dagli obiettivi

Ogni sito ha degli obiettivi precisi: far leggere un articolo di un blog, far acquistare un prodotto, mostrare i propri dati di contatto etc. Dopo aver capito quale azione far compiere al nostro visitatore possiamo individuare il target più idoneo e chiederci quali sono i messaggi da voler trasmettere.

Strutturare la navigazione del sito

Creare la mappa del sito è la fase più importante perché dirà esattamente all’utente e ai motori di ricerca come sarà il nostro intero sito web. Oltre alle classiche pagine (chi siamo, servizi/prodotti, contatti) è opportuno scegliere quali informazioni dare al nostro utente.

Possono esserci informazioni più tecniche e dettagliate all’interno delle singole pagine di  prodotto/servizio oppure pagine più informative per gli utenti meno informati (che possono trovarsi nelle FAQ o all’interno del nostro blog).

Disegnare il layout delle pagine web

Prima di trasformare il sito in un file digitale con foto, testi e colori consigliamo sempre di partire da uno schizzo, una bozza del nostro layout. Disegnare siti web significa anche progettare in modo approssimativo le varie schermate di navigazione e una volta concluse, ragionare sul corretto inserimento di link e contenuti.

Una volta definite pagine e contenuti possiamo passare ad una rappresentazione visuale del nostro sito.

Sviluppare un mockup del sito

Per trasformare il disegno in qualcosa di reale possiamo utilizzare programmi di grafica come Photoshop o Illustrator oppure strumenti online come SketchMoqups, etc.  Dobbiamo tenere a mente l’importanza del responsive design, perciò creeremo il layout di ogni singola pagina nei 3 diversi formati:

  • desktop
  • tablet
  • mobile

In questa fase potremmo scoprire eventuali problematiche non user-friendly e correggerle prima di andare a sviluppare il codice.

Realizzare un prototipo

Dopo aver trasformato il disegno in grafica digitale è ora di creare un prototipo e includere tutto in codice web (HTML, CSS, JavaScript, etc.) da visualizzare sul browser e da mostrare ad eventuali clienti o a semplici amici per avere un feedback.

Raccolte le indicazioni, possiamo andare a rifinire il nostro progetto con testi e foto definitive e siamo pronti per la messa online del sito.

Vuoi imparare a disegnare pagine web?

Questo è solo un piccolo estratto degli argomenti che vengono trattati ogni giovedì sera, dalle 19:30 alle 21:30, al corso di web design in Novel Academy.

Guarda gli argomenti e le lezioni trattate nel corso e scopri come disegnare un sito web.



Articoli recenti