Filosofia e principi di progettazione del sito¶
Abbiamo voluto progettare un sito al tempo stesso moderno, gioioso, accessibile e facile da usare, in coerenza con l'identità della nostra tradizione. Siamo una tradizione di buddismo moderno e la nostra è una via gioiosa. Il design del sito deve quindi trasmettere questa identità fin dal primo sguardo: non si tratta solo di presentare delle informazioni, ma di far percepire l'atmosfera dei nostri centri e di invogliare a scoprirli.
Il sito è stato pensato anche per rispondere in modo efficace alle esigenze di due tipi di visitatori: le persone che scoprono il centro per la prima volta e quelle che lo frequentano già regolarmente. A un nuovo visitatore, il sito deve permettere di capire rapidamente chi siamo, che cosa proponiamo, a chi si rivolgono le nostre attività e quale atmosfera può trovare nel centro. A una persona abituale, che conosce già il centro e cerca un'informazione precisa, deve invece permettere di arrivare in modo rapido e semplice a ciò di cui ha bisogno: un orario, un evento, un corso, il calendario, le informazioni pratiche, ecc.
Tutta la progettazione del sito si basa quindi su questo equilibrio: far scoprire e invogliare i nuovi visitatori, permettendo allo stesso tempo ai visitatori abituali di trovare rapidamente l'informazione che cercano.
Per vedere in un colpo solo come è costruita la home page, ecco un esempio di pagina intera basato sul centro di Brighton. Ogni sezione è descritta più avanti.
Vedi tutta la home page in un colpo solo
Un'identità visiva moderna e gioiosa¶
L'arancione è stato scelto come colore principale del sito. È un colore associato alla saggezza e alla nostra tradizione, ma permette anche di creare un'identità visiva calda e dinamica.
La tonalità scelta è abbastanza profonda da garantire un buon contrasto con il bianco, il che contribuisce a una buona leggibilità e, per quanto possibile, al rispetto dei principi di accessibilità del Web. È un compromesso tra accessibilità ed estetica.
Intorno a questo colore principale, abbiamo definito una tavolozza composta anche da blu, viola e verdi.
Questa tavolozza costituisce un quadro comune, lasciando al tempo stesso una certa libertà ai centri. Un centro come Brighton, per esempio, ha scelto il blu come colore principale per distinguersi da un altro centro che usava già l'arancione. L'essenziale è restare nella tavolozza definita, per mantenere una coerenza visiva con l'insieme dei siti che usano questo sistema.
Dove intervenire
I colori del sito spiega il principio della tavolozza; la schermata Colori e l'operazione Cambiare i colori del sito mostrano come impostarla.
Un'interfaccia semplice e subito riconoscibile¶
L'intestazione del sito è stata volutamente progettata in modo molto sobrio. Il logo del centro compare in alto a sinistra, in bianco su sfondo arancione. In alto a destra, il pulsante del menu resta sempre nello stesso punto.
Abbiamo scelto di accompagnare il tradizionale pittogramma «hamburger» con la parola «Menu». Questa scelta rafforza la comprensione della funzione del pulsante e contribuisce a rendere la navigazione più accessibile a tutti i pubblici.
Il menu mantiene lo stesso principio e la stessa posizione, sia sul computer sia sul cellulare. Il visitatore ritrova quindi sempre gli stessi riferimenti, qualunque sia il dispositivo usato. Questa continuità rende l'uso del sito più omogeneo, semplice e intuitivo.
Dove intervenire
Il menu del sito spiega come è costruito il menu; la schermata Menu del sito e l'operazione Modificare il menu mostrano come modificarlo.
Immagini pensate per funzionare ovunque¶
Per facilitare l'impaginazione e garantire una presentazione omogenea in tutto il sito, abbiamo anche scelto di uniformare il formato delle immagini principali.
Il formato delle immagini: 1050 × 400 pixel
Le immagini usate in cima alla home page, alle pagine di contenuto, alle pagine degli eventi e in diversi spazi del sito sono preparate nel formato 1050 × 400 pixel.
Questo formato panoramico permette di valorizzare abbastanza l'immagine, lasciando comparire rapidamente le prime informazioni che si trovano sotto.
Questa scelta è particolarmente utile sia sul cellulare sia sul computer: l'immagine resta visibile e attraente senza occupare tutto lo schermo, il che permette al visitatore di arrivare rapidamente al contenuto.
L'uso di un formato fisso semplifica inoltre notevolmente la creazione grafica. Invece di dover gestire immagini mostrate a tutta larghezza o a schermo intero, con vincoli di inquadratura diversi a seconda dei dispositivi, basta preparare bene l'immagine una sola volta.
Una volta inquadrata, può essere usata in modo affidabile nelle diverse posizioni del sito: immagini principali, prossimi eventi, miniature e articoli del blog. Questo permette di ottenere una presentazione coerente, rendendo al tempo stesso la gestione quotidiana del sito molto più semplice, senza richiedere competenze avanzate di grafica.
L'immagine iniziale: creare una prima impressione positiva¶
L'immagine che si trova in cima alla home page ha un ruolo particolare. Si rivolge prima di tutto alle persone che scoprono il sito per la prima volta.
Il suo obiettivo non è quindi solo illustrare il centro. Deve suscitare una prima impressione positiva e immediata:
«Ah, sembra un posto simpatico!»
Questa impressione deve nascere sia dal design sia dal messaggio trasmesso dall'immagine. La scelta dell'immagine, del testo e della composizione deve dare un'idea dell'atmosfera del centro ancora prima che il visitatore abbia cominciato a consultare le diverse attività proposte.
Questo primo richiamo è anche l'occasione per mostrare ciò che caratterizza il nostro approccio. Siamo una tradizione di buddismo moderna e gioiosa, e i nostri centri possono trasmettere questa dimensione fin dal primo sguardo. L'umorismo, la leggerezza e messaggi vivaci possono quindi trovare pienamente posto in queste immagini.
L'obiettivo è mostrare una realtà che i visitatori possono ritrovare nei nostri centri: luoghi accoglienti, vivaci, calorosi e accessibili. Una persona che non conosce ancora la nostra tradizione deve potersi dire subito:
«Forse è un posto per me.»
Per facilitare la creazione di queste immagini, è stato sviluppato un modulo apposito che permette di comporre in modo molto semplice un'immagine iniziale con un'immagine, un testo e una o più icone. Il modulo permette anche di regolare la presentazione e di vedere subito il risultato sul cellulare.
È possibile creare più immagini iniziali, che potranno poi essere mostrate in modo casuale. Una persona che torna sul sito può così scoprire un richiamo diverso, il che dà un'impressione di novità e permette di far vivere la home page.
Può essere utile, per esempio, creare una decina di immagini nel corso di qualche mese o di un anno, a seconda del tempo che il centro desidera dedicare a questa attività. Questo lavoro non è quindi solo decorativo: questo primo richiamo è una delle prime occasioni per creare un legame con una persona che scopre il centro.
Vedere un'immagine prima di pubblicarla
Il sito sceglie a caso tra le immagini iniziali pubblicate; un'immagine in bozza non viene mai mostrata ai visitatori. Per giudicare una nuova immagine in condizioni reali prima di pubblicarla, usa il pulsante Vedi nella pagina iniziale della schermata di modifica: solo tu vedi allora la home page con questa immagine.
Dove intervenire
La schermata Immagine iniziale mostra come comporre un'immagine.
Una home page che orienta naturalmente i visitatori¶
Dopo questo primo richiamo, un titolo presenta in modo molto semplice le attività proposte dal centro e ricorda che sono aperte a tutti.
Subito sotto, una zona di scelta permette al visitatore di orientarsi rapidamente verso i principali contenuti della home page. Può proporre in particolare degli accessi ai corsi di meditazione, agli eventi del fine settimana, alle formule di abbonamento e, in quarta posizione, al calendario del centro.
Quest'ultimo accesso è particolarmente importante, perché il calendario fa spesso parte delle informazioni cercate per prime dalle persone che conoscono già il centro o vogliono semplicemente sapere che cosa vi succede.
Quando il visitatore seleziona uno di questi elementi, viene portato direttamente alla parte corrispondente della home page. Scopre allora una breve presentazione dell'attività, poi può accedere alla pagina che le è dedicata per avere maggiori informazioni.
Questa organizzazione permette quindi di scoprire le attività del centro senza dover passare ogni volta da un menu. La home page diventa un vero percorso di scoperta: ognuno può andare direttamente verso ciò che gli interessa, oppure semplicemente far scorrere la pagina e scoprire a poco a poco l'insieme delle proposte.
Una home page pensata anche per il posizionamento sui motori di ricerca¶
Questa organizzazione ha anche un'importanza notevole per il posizionamento naturale (SEO).
La home page contiene contenuti dedicati alle diverse attività del centro, con i termini e le espressioni che corrispondono alle ricerche che possono fare gli utenti di Internet. Ogni presentazione può poi rimandare a una pagina più completa dedicata all'attività in questione.
La home page diventa così un punto di partenza verso gli altri contenuti del sito e crea una rete di link interni coerente.
La stessa struttura risponde quindi a più obiettivi: rende la navigazione più intuitiva per i visitatori, arricchisce la home page con contenuti utili e facilita la scoperta delle altre pagine del sito da parte dei motori di ricerca.
Mostrare subito la vita del centro¶
Subito dopo la zona di scelta, una sezione presenta gli eventi previsti nei prossimi giorni. Il visitatore può così sapere subito che cosa succede oggi e nei giorni seguenti, senza dover aprire il calendario.
Il resto della pagina permette poi di scoprire naturalmente altre informazioni sul centro facendo semplicemente scorrere lo schermo (le formule di abbonamento mensile, per esempio).
Dove intervenire
Questa sezione è un blocco «Prossimi eventi»: vedi la schermata Blocchi «Prossimi eventi» e l'operazione Mostrare i prossimi eventi in una pagina.
Mettere in primo piano gli insegnanti¶
Un carosello permette anche di presentare gli insegnanti e di mostrare subito i volti delle persone che trasmettono gli insegnamenti.
Sulla home page, l'ordine di presentazione è volutamente casuale. A ogni visita, gli insegnanti possono così comparire in un ordine diverso, il che rende la presentazione più dinamica e permette di mettere regolarmente in evidenza insegnanti diversi.
La pagina dedicata agli insegnanti adotta un'organizzazione diversa. L'insegnante residente vi è presentato per primo e con una foto più grande. Gli altri insegnanti sono poi presentati nell'ordine scelto dall'EPC.
Dove intervenire
Nella pagina degli insegnanti, l'ordine è quello dell'elenco degli insegnanti nell'amministrazione: vedi la schermata Insegnanti.
Dare una visione immediata dell'orario¶
Più in basso nella home page, l'orario settimanale dei corsi di meditazione permette di vedere a colpo d'occhio l'organizzazione dei corsi nella settimana.
Permette di distinguere i diversi momenti della giornata, in particolare i corsi del mattino, di mezzogiorno e della sera. Il visitatore può così capire molto rapidamente quando si svolgono le diverse sessioni.
Se serve, un secondo calendario permette anche di presentare i corsi organizzati nelle sedi secondarie.
Questa presentazione dà una visione molto concreta della vita del centro e permette di trovare rapidamente un orario compatibile con le proprie disponibilità.
Dove intervenire
La schermata Orario settimanale e l'operazione Aggiornare l'orario settimanale.
Il piè di pagina: informare e collegare i siti¶
Il piè di pagina, presente in tutte le pagine del sito, non è soltanto una zona tecnica. Può anche servire come spazio di informazione, fidelizzazione e messa in rete.
Le recensioni Google vi sono integrate per presentare una selezione di commenti lasciati davvero dai visitatori. Questa presenza dà una dimensione umana al sito e permette di mostrare direttamente le esperienze condivise dalle persone che frequentano il centro.
Questa zona propone anche un pulsante che permette ai visitatori di lasciare loro stessi una recensione.
Il piè di pagina può inoltre dare accesso all'iscrizione alla newsletter e proporre risorse complementari, come e-book gratuiti o podcast.
Infine, questo spazio è una posizione particolarmente interessante per creare link verso gli altri centri Kadampa del paese. L'ideale sarebbe che i diversi siti adottassero la stessa logica e si rimandassero a vicenda verso gli altri centri.
Questo creerebbe una vera rete tra i siti, utile sia per i visitatori che vogliono scoprire un altro centro sia per la struttura complessiva della rete. Anche un link verso il centro nazionale può rientrare in questa logica.
Dove intervenire
Il piè di pagina è un modello di impaginazione: vedi la schermata Modelli. Per nascondere o mettere in evidenza una recensione Google: vedi la schermata Recensioni di Google.
Una progettazione che unisce estetica, semplicità ed efficacia¶
L'insieme di queste scelte risponde in definitiva a un'unica logica: creare un sito che sia piacevole da guardare, semplice da usare e rappresentativo dell'identità dei centri, pur essendo facile da far evolvere e da amministrare.
Il visitatore deve poter capire subito dove si trova, che cosa viene proposto, quando si svolgono le attività e come approfondire. Può scegliere di consultare direttamente un'informazione precisa o semplicemente lasciarsi guidare facendo scorrere la pagina.
Parallelamente, la struttura del sito permette di sviluppare un contenuto ricco, di creare link coerenti tra le diverse pagine e tra i diversi siti, e di rafforzare a poco a poco il posizionamento naturale.
Il design non è quindi separato dall'ergonomia, dal contenuto o dal posizionamento: tutti questi elementi sono stati pensati insieme per creare l'esperienza di un sito al tempo stesso moderno, gioioso, accessibile, fluido ed efficace.