Daniele Capoferri

Daniele Capoferri

Grafico e Web Designer

COME PROGETTARE UN SITO WEB

Condividi su facebook
Facebook
Condividi su twitter
Twitter
Condividi su linkedin
LinkedIn

SOMMARIO POST

Progettare un sito web non è un lavoro così semplice come molti credono. 

Ho deciso di scrivere il mio primo post del mio blog proprio su questo tema, per aiutarti a capire quale percorso bisogna intraprendere quando si inizia a progettare un sito web. 

Dunque cosa bisogna prendere in considerazione quando si progetta un sito web? 

Ti darò alcuni consigli generali, trucchi, scorciatoie per la creazione di un buon sito web.

1) Progettazione del layout e struttura del sito web

Disegnalo a mano!  Basta un foglio di carta e una matita.

Potete preparare una bozza a mano su carta, da presentare al vostro web designer, per fargli capire lo stile che avete in mente e soprattutto la struttura che dovrà avere il sito web o E-commerce. 

Dopo un confronto tra cliente e web designer molto probabilmente il vostro web designer creerà un wireframe, cioè un prototipo senza contenuti, che servirà a delineare la posizione e la rilevanza degli elementi presenti nel sito web e dare un’idea della struttura vera e propria del sito. 

Successivamente il wireframe verrà trasformato in un visual design in scala di grigi, per poi aggiungere le fotografie. Solo dopo aver fatto questi passaggi si possono iniziare ad aggiungere i colori. 

2) Scelta dei font (caratteri) da usare nel sito web.

Come prima cosa accertatevi di scegliere un “web font”, sono quei font che riescono ad essere letti dagli spider dei motori di ricerca (algoritmi che indicizzano e posizionano il sito web nei risultati dei motori di ricerca). Usare un font web è fondamentale, perché consente ai motori di ricerca di capire i contenuti del tuo sito per poi posizionarli.

Puoi usare, Google Font per la scelta del font. Non usate mai più di 2/3 tipi di font!

3) Pensa social! 

La presenza dei “tasti social” (le icone dei canali social in cui siete presenti).

Devono essere ben visibili nel sito web e posizionate in maniera corretta, solitamente si mettono in alto a destra (head) cioè quella parte del sito web che tecnicamente viene definita “Abow the flow” cioè la parte visibile del sito web senza effettuare uno scroll, gli stessi tasti vengono messi nella parte bassa del sito web (foot). Questo ti aiuta a portare le persone nei tuoi spazi social, permettendo loro di continuare a seguirti e allo stesso tempo ad acquisire fan in modo “gratuito”.

4) Slideshow? Evitiamolo grazie!

Fino a qualche anno fa la presentazione della home page con un carosello di immagini era molto di moda, era un buon modo per dare rapidamente delle informazioni sulla tua attività, ma poi ci si è accorti che le persone non leggono o guardano tutti i messaggi presenti nello slideshow e come se non bastasse gli slideshow rallentano il tempo di caricamento del sito web, quindi la cosa migliore è usare una sola immagine (in home page) con un unico messaggio. 

Chiediti quale è la cosa che interessa di piщ al tuo visitatore? Individuala e metti quella in evidenza.

5) Semplifica la navigazione

L’usabilità del sito è fondamentale, come prima cosa il sito web deve essere “Cross-Browser”, cioè deve essere visualizzabile in maniera ottimale su ogni browser, deve essere “Mobile Friendly”, cioè deve essere visibile su tutti i device (pc, laptop, tablet, smartphone). La regola è “non fare pensare”, meno passaggi metti per compiere qualsiasi azione nel sito web meglio è, la gente soprattutto quando naviga è pigra e/o va di fretta. Tutto deve essere a portata di click ed estremamente intuibile, ricorda che la maggior parte del traffico oggi arriva dal traffico mobile (smartphone), quindi l’esperienza sul tuo sito deve essere intuitiva e veloce.

6) Abolire le barre laterali

La barra laterale è stata una particolarmente popolare tendenza di web design per gli ultimi dieci anni. I dati dicono che la rimozione delle barre laterali aumentano le conversioni. A mio avviso possono ancora resistere nei Blog o nella sola pagina Blog, ma non in ogni parte del sito web!

7) Colore

Cerca di usare i colori che già usi per la tua immagine aziendale (logo, brochure, cataloghi) in modo da avere un’immagine coordinata sia nei colori che nella grafica. Crea una palette di colori magari usando anche i colori complementari, aiutati con questo strumento firmato Adobe .

8) La dimensione del carattere e paragrafi

La tipografia è incredibilmente importante nel web design, quanto la scelta dei colori e delle immagini. Solitamente leggere un testo su un Device è più faticoso che su carta quindi bisogna fare in modo che i concetti fondamentali siano in rilievo rispetto al resto del testo. 

Un modo per farlo è quello di aumentare le dimensioni dei caratteri (io non scendo mai sotto i 16 punti), dividi i testi in blocchi, questo aiuta molto nella lettura ed evita l’effetto “muro di parle” che scoraggia la lettura.

9) Lo spazio bianco è tuo amico!

Non ogni zona vuota dello schermo deve essere riempita, anzi. Gli spazi bianchi guidano l’occhio nella lettura o nella esplorazione del sito web.

Usa uno stile semplice, vedo troppo spesso realtà che vogliono stipare tutto in un piccolo spazio, o peggio ancora, tutto in “above the fold”.

Insomma lascia “respirare” le tue pagine, non ammassare tutto in un unico spazio! 

10) Testa il design

Un modo rapido per scoprire cosa è più importante sul tuo sito web è quello di allontanarsi dallo schermo del computer e socchiudere gli occhi, come se doveste mettere a fuoco un dettaglio. La maggior parte degli elementi diventerà sfocata, e solo le caratteristiche piщ grandi, colorate e prominenti saranno evidenti, quelle sono le parti che saranno più visibili ad un nuovo utente. 

Quando sei sicuro del risultato, fai vedere il sito web a chi non lo ha mai visto, la prima cosa da fare è fargli vedere l’home page per pochi secondi e chiedergli di cosa “parla” il sito web, se indovina fallo interagire e fagli fare delle azioni per vedere se “l’usabilità” del sito è alla portata di tutti. 

Condividi su facebook
Facebook
Condividi su twitter
Twitter
Condividi su linkedin
LinkedIn

ALTRI ARTICOLI

WordPress 5.5 aggiornamento

WordPress 5.5, quali novità?

Ieri ho deciso di testare la nuova versione di WordPress (5.5) uscita ufficialmente il giorno 11 agosto. Si tratta di una major

Restyling sito web Rom Renzi

RESTYLING SITO WEB – Rom Renzi

Restyling del sito web per azienda che produce manufatti in metallo. Nella nuova versione il sito web è stato cambiato il layout

Lascia un commento