Vai al contenuto principale

Alex Titze

Unione Italiana dei Ciechi e degli Ipovedenti di Macerata

uicmc.it (si apre in una nuova scheda)
Homepage del sito UICI Macerata

L'Unione Italiana dei Ciechi e degli Ipovedenti di Macerata disponeva già di un sito, ma nel tempo era diventato difficile da navigare: struttura poco intuitiva, pagine difficili da raggiungere, contenuti non aggiornati e un'installazione WordPress lasciata a sé stessa. Il mandato era chiaro: ripartire da zero, con un'architettura più solida e un'attenzione reale all'accessibilità.

Il processo

Ho iniziato con un'analisi del sito esistente per capire cosa non funzionava: pagine orfane, sezioni inaccessibili, informazioni obsolete. Da lì ho costruito una mappa del sito per definire la nuova struttura, poi sono passato ai wireframe su Figma, dove ho progettato ogni pagina (Servizi, Articoli, Contatti, Diventa Socio, Servizio Civile…) prima di scrivere una riga di codice.

Lo sviluppo

Lo sviluppo è avvenuto su WordPress con il page builder Etch, una scelta che ha permesso di ottimizzare sia le performance, la versatilità e la scalabilità del sito. Ho lavorato con componenti riutilizzabili, un vantaggio sia in fase di sviluppo che per le future evoluzioni del sito, e con custom post type per gestire i servizi in modo strutturato.

Per il visual design ho usato una palette derivata dal logo dell'associazione e un font ad alta leggibilità. Accessibilità e contrasto cromatico non sono stati aggiunte in fase di revisione, ma vincoli di partenza: struttura HTML semantica e testi alternativi curati fin dall'inizio.

Il risultato

Il nuovo sito offre una navigazione lineare: casella di ricerca nel menù, banner per le donazioni, form di contatto con categorie di richiesta distinte, archivio documentale ordinato per anno, pagina con i riferimenti delle persone dell'associazione. Ogni sezione è raggiungibile con pochi clic, anche da chi non ha dimestichezza con la navigazione web.

La segreteria, non tecnica, può gestire e aggiornare i contenuti in autonomia, senza dipendere da un supporto esterno per le operazioni quotidiane.

Dettagli tecnici

  • Piattaforma: WordPress con page builder Etch
  • Design: Figma (mappa del sito, wireframe e UI)
  • Architettura: Custom post type per i servizi, componenti riutilizzabili
  • Accessibilità: Contrasto cromatico WCAG, HTML semantico, testi alternativi
  • Strumenti: WordPress, Figma, Etch

Vorresti rifare il tuo sito web?

Sono disponibile per effettuare un restyling completo

Contattami