Restyling sito, usabilità e accesibilità per il Parco Regionale del Matese

Restyling Sito Web Parco Regionale del Matese

Una nuova veste grafica

Il nuovo sito del Parco Regionale del Matese aveva come obiettivi principali il miglioramento dell’usabilità e l’adattamento del design e del codice alle norme italiane di accessibilità web. Il vecchio sito, realizzato in web 1.0 con codice xhtml, non mostrava con chiarezza la grande quantità di news, aziende, associazioni e informazioni sui comuni che si trovano all’interno del parco, non era accessibile ne usabile ed era scomodo e molto difficile da aggiornare e mantenere.

Dopo una serie di colloqui e proposte con il cliente, in cui ho mostrato le varie possibilità e le varie opzioni di realizzazione e gestione del nuovo sito, abbiamo trovato in WordPress la soluzione perfetta per la gestione dei contenuti e in un nuovo design moderno e semplificato la soluzione per tutti i problemi di accessibilità e usabilità.

Tecnologie utilizzate

Una volta scelti il nuovo design e la nuova piattaforma per la gestione dei contenuti il passo successivo è stato quello di realizzare il codice necessario allo sviluppo del nuovo tema personalizzato per WordPress.

Realizzare un tema WordPress non è complicato, si può iniziare da zero oppure utilizzare un tema già sviluppato e modificare struttura e css per adattarlo al nuovo design. In questa occasione, ho utilizzato un mio un tema personalizzato e l’ho modificato secondo le esigenze del progetto.

Per il codice front-end ho utilizzato il “moderno” HTML5, integrato con un foglio di stile in CSS3 e una base jQuery per gli effetti più semplici come scroll e stati hover dei pulsanti. Sappiamo tutti ormai che ogni progetto realizzato in HTML5, deve essere compatibile con tutti i browser, ho quindi inserito i css Normalize, Reset e Modernizr e gli script necessari alla corretta interpretazione di HTML5 sui i browser più vecchi.

Una volta realizzata la struttura front-end sono andato ad operare all’interno di WordPress, aggiungendo i plugin necessari per la gestione dei POI (point of interest) registrati sul sito e per la gestione di una ricerca avanzata che mostra gli stessi contenuti direttamente sulla mappa. Per ogni POI (comuni, aziende, eventi, prodotti tipici, associazioni e ambiente e territorio) ho realizzato una pagina con una grafica specifica e uno schema di colori (gli stessi della legenda) utile a suddividere graficamente e visivamente i diversi tipi di POI. Era quindi necessario apportare alcune modifiche al codice PHP per inserire nel tag body il nome del POI collegato, solo quando l’utente si sarebbe ritrovato sulla pagina della scheda del POI.

In conclusione le tecnologie utilizzate sono state HTML5, CSS3 e jQuery per il front-end e ottimi plugin WordPress con qualche riga di PHP per il back-end.

Integrazione con l’App

Non spenderò molte parole su questo argomento perché non sono stato io a realizzare l’app, ma mi sono limitato ad installare gli script PHP che mi ha passato la società incaricata dello sviluppo dell’applicazione mobile.

L’applicazione mobile è simile al sito: si possono consultare le aziende, i percorsi, i prodotti tipici e altro ancora all’interno del parco del Matese. Si possono prenotare soggiorni, ristoranti e guide per le escursioni. La bellezza di questa app, per quanto riguarda lo sviluppo, è che condivide lo stesso database del sito, quindi i contenuti sono aggiornati simultaneamente sia per l’app che per il sito.

Vuoi dare un’occhiata?


Vuoi ottenere gli stessi risultati o addirittura migliori? Contattami e parliamone davanti ad un caffè!

CONTATTAMI

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *