Fon­da­men­ti del web design: la pro­get­ta­zio­ne

Anche per il design di un sito web vale la regola: migliore è la pro­get­ta­zio­ne, più sarà facile la rea­liz­za­zio­ne. Non è rilevante che co­struia­te un sito web per la vostra azienda o per voi stessi o che magari lo stiate svi­lup­pan­do per qualcun altro: il design di una pagina è un elemento fon­da­men­ta­le per il successo. Per questo è con­si­glia­bi­le pre­ven­ti­va­re ab­ba­stan­za tempo per trovare la giusta idea, concepire e mi­glio­ra­re il sito web. Per trovare un’ap­pro­pria­ta e con­vin­cen­te struttura per la vostra pagina, dovete con­si­de­ra­re i seguenti punti.

Prima di creare il design di una pagina dovrebbe essere chiaro cosa si voglia ottenere e in quanto tempo. Sarebbe quindi utile chiedersi: qual è lo scopo del vostro sito? La risposta è alla base dell’intero progetto, così ogni com­po­nen­te dell’homepage dovrebbe orien­tar­si verso la buona riuscita dell’obiettivo pre­fis­sa­to. Un sito web può avere ad esempio lo scopo di aumentare il grado di po­po­la­ri­tà dei contenuti, quindi di pro­muo­ve­re o informare. Qualora la pagina sia un e-commerce, l´obiettivo prin­ci­pa­le sarà quello di ottenere nuovi clienti o vendere più prodotti. Un sito web è ge­ne­ral­men­te il biglietto da visita di un´azienda o di un´isti­tu­zio­ne; è im­por­tan­te che si tenga ben presente lo scopo del sito durante la fase di rea­liz­za­zio­ne e di creazione del design.

Chi è il target di ri­fe­ri­men­to del vostro sito web? De­fi­ni­te­lo. Tenete sempre presente il vostro obiettivo: qualora pro­muo­via­te un prodotto o un servizio, dovete definire il vostro target di ri­fe­ri­men­to e adattarlo al design del sito, anche nel caso in cui si tratti di un portale in­for­ma­ti­vo o di un forum su un argomento specifico. In ultima analisi, sia che si voglia proporre un’offerta com­mer­cia­le, sia che se ne scelga una in­for­ma­ti­va, ogni gestore di un sito web dovrebbe sapere quale gruppo si cerchi di coin­vol­ge­re. Infatti, solo chi conosce i suoi utenti può modellare la propria pagina secondo questi parametri.

In molti ambiti si sono fissati degli standard per i contenuti e la loro pre­sen­ta­zio­ne. Così, per esempio, sulle pagine di vendita online si trova sempre una funzione di ricerca con dei pratici filtri. Ogni settore e ogni gruppo di ri­fe­ri­men­to è dotato di ca­rat­te­ri­sti­che proprie che con­trad­di­stin­guo­no i contenuti e la pre­sen­ta­zio­ne sul web. È im­por­tan­te conoscere questo tipo di aspet­ta­ti­ve degli utenti, so­prat­tut­to se il vostro sito si discosta dagli schemi attuali.

Adesso seguono alcune in­di­ca­zio­ni per decidere la struttura della pagina web. Per svolgere questo compito, è con­si­glia­bi­le creare una sitemap, cioè un diagramma che riproduce la struttura delle pagine e i col­le­ga­men­ti delle singole pagine. Per avere una pa­no­ra­mi­ca generale, vi­sua­liz­za­te, con carta e penna o di­ret­ta­men­te sul pc, la gerarchia della vostra pagina internet. Così facendo non or­ga­niz­ze­re­te solo il contenuto del vostro sito, ma allo stesso tempo ne de­ter­mi­ne­re­te la na­vi­ga­bi­li­tà. Nella sitemap stabilite i col­le­ga­men­ti del sito, smistate ogni pagina a seconda della loro im­por­tan­za e create una breve de­scri­zio­ne dei contenuti pro­gram­ma­ti. Ov­via­men­te la struttura delle pagine deve rimanere chiara e non deve contenere troppe sot­to­pa­gi­ne per ogni categoria.

Collegata alla creazione della sitemap è la bozza del layout del sito web. In questo caso non si tratta del design de­fi­ni­ti­vo del sito, ma solo dell’or­di­na­men­to e della funzione dei contenuti sulle singole pagine. Sce­glien­do il layout, de­ci­de­re­te ad esempio dove inserire il menu, come gli utenti rag­giun­ga­no le sottovoci del menu e dove viene po­si­zio­na­to il logo del sito web. Gli altri elementi di cui occuparsi nella bozza del layout di­pen­de­ran­no dai contenuti. Altre po­ten­zia­li funzioni del sito da integrare e su cui ri­flet­te­re sono:

• Una funzione di commento per i vi­si­ta­to­ri
• Col­le­ga­men­ti ai social media, social media buttons, con i quali gli utenti possono con­di­vi­de­re e mostrare il loro ap­prez­za­men­to per i contenuti del sito
• Annunci, banner e video degli sponsor
• Link di af­fi­lia­zio­ne ad aziende partner che pro­muo­ve­te sul vostro sito

Inoltre, dovrete ri­flet­te­re per tempo se volete ot­ti­miz­za­re la vi­sua­liz­za­zio­ne del vostro sito web per diversi di­spo­si­ti­vi (pc, tablet, smart­pho­ne, ecc.). Ge­ne­ral­men­te adattare la grafica del sito a diverse di­men­sio­ni dei display comporta dei vantaggi e spesso sarà ne­ces­sa­rio rior­di­na­re nuo­va­men­te i singoli com­po­nen­ti della pagina. La sitemap e il layout sono sempre collegati l’una all’altro e devono essere pia­ni­fi­ca­ti sin dall’inizio nella pro­get­ta­zio­ne dei singoli elementi.

Og­gi­gior­no le pagine internet non vengono più solo costruite dai pro­fes­sio­ni­sti. Se prima per creare e costruire un sito web erano ancora ne­ces­sa­rie delle co­no­scen­ze in­for­ma­ti­che di pro­gram­ma­zio­ne, oggi anche i di­let­tan­ti possono ci­men­tar­si nell´impresa. Chi non possiede alcuna espe­rien­za nel web design, si affida so­li­ta­men­te a modelli di siti già pronti che si basano sul Content Ma­na­ge­ment System (CMS).

Un CMS offre agli utenti una su­per­fi­cie grafica con cui vengono creati e ordinati i singoli com­po­nen­ti della pagina. Conoscere un lin­guag­gio di pro­gram­ma­zio­ne non è più ne­ces­sa­rio, anche se spesso potrebbe essere di aiuto. La quantità delle funzioni messe a di­spo­si­zio­ne dai singoli sistemi varia a seconda dei programmi; le features pre­e­si­sten­ti in un CMS dipendono dal provider scelto che in genere offre diversi pacchetti. Più il prezzo di un’offerta aumenta, maggiore sarà la quantità delle funzioni incluse. Accanto a questi, esistono anche dei siti già pronti gratuiti. Purtroppo però le loro features sono ge­ne­ral­men­te limitate e possono essere create solo delle pagine web semplici.

Se volete creare un’homepage pro­fes­sio­na­le, dovreste conoscere i linguaggi HTML e CSS con i quali avrete a di­spo­si­zio­ne la massima fles­si­bi­li­tà. Tuttavia, per svi­lup­pa­re di­ret­ta­men­te dal codice sorgente una pagina senza errori e che sembri pro­fes­sio­na­le, bisogna avere espe­rien­za nel settore. Inoltre, la ma­nu­ten­zio­ne e l’ag­gior­na­men­to risultano più com­pli­ca­ti rispetto ai CMS.

Avete anche la pos­si­bi­li­tà di affidare la creazione della vostra pagina web ad un pro­fes­sio­ni­sta. Ov­via­men­te, anche in questo caso, dovrete essere con­sa­pe­vo­li a quali esigenze debba ri­spon­de­re la vostra pagina.  Spetterà infine a voi, alla persona in­ca­ri­ca­ta o all’agenzia a cui vi siete affidati di av­vi­ci­nar­si, il più det­ta­glia­ta­men­te possibile, alle vostre aspet­ta­ti­ve. In ogni caso, una pro­get­ta­zio­ne studiata nei minimi dettagli influisce po­si­ti­va­men­te sia sul processo sia sul risultato finale del sito web.

Non appena saprete quali contenuti offrirà il vostro sito web, avrete ragionato at­ten­ta­men­te sulla struttura e sulla sua creazione, deciso se creerete da soli la pagina o in­ca­ri­che­re­te qualcun altro, potete infine stabilire delle tem­pi­sti­che. Nel caso di progetti più grandi si può decidere di gestire le scadenze per tappe (partendo ad esempio dalla pro­du­zio­ne dei testi base per i contenuti per poi passare alla rea­liz­za­zio­ne del design di base, ecc.). In ogni caso, la gestione delle tem­pi­sti­che dovrebbe contenere tutti i punti più im­por­tan­ti e allo stesso tempo rimanere chiara. Tenete sempre presente che le singole sezioni, in alcune cir­co­stan­ze, devono essere adattate o mi­glio­ra­te e una buona tabella di marcia prevede spazio suf­fi­cien­te per cor­re­zio­ni del genere. Inoltre, le tem­pi­sti­che vanno ag­gior­na­te re­go­lar­men­te e adattate ai nuovi elementi del progetto.

Se avete con­si­de­ra­to ed elaborato tutti questi aspetti, avrete ora com­ple­ta­to la struttura di base del vostro sito web. Suc­ces­si­va­men­te, vi dovrete occupare della rea­liz­za­zio­ne dei singoli punti, prestando at­ten­zio­ne ad alcune cose. Nei prossimi articoli sul tema “fon­da­men­ti del web design”, sco­pri­re­te come rendere la vostra pagina facile da uti­liz­za­re e cos´è da tenere in con­si­de­ra­zio­ne nell´uso dei loghi e dei colori nel web design.