Obiettivo

Realizzazione di un sistema di generazione automatico di menù a due livelli integrabile in "Movable Type".

Realizzazione

La gestione del menù del sito della Fondazione Bassetti ha richiesto un impegno progettuale mirato alla soluzione di due tipi di problematiche:

• l’implementazione valida, accessibile e degradabile di un menù a due livelli
• l’automazione della sua generazione in Movable Type.

Analizziamo separatamente le soluzioni adottate.

Realizzazione del menù a due livelli.

La generazione del menù è realizzata a partire da una lista non ordinata di voci utilizzando i tag XHTML "ul" e "li". La presentazione grafica del menù è ottenuta con la scrittura di un apposito css. In questo modo si ha la garanzia che qualunque tipo di browser debba visualizzare il menù (palmari compresi) possa farlo come lista di link e, nel caso di browser evoluti, la resa grafica risulta molto gradevole. Il css prodotto tiene in considerazione le differenze di resa grafica dei browser più diffusi e permette quindi di generare correttamente un menù realmente multibrowser e multipiattaforma. Sono stati eseguiti moltissimi test di compatibilità su postazioni pc (windows e linux) e postazioni MacBook e con versioni diverse di browser: Internet Explorer dalla versione 5.5 compresa, Firefox (tutte le versioni), Safari per Mac.
La realizzazione del menù gestibile via css permette di aumentare il grado di "resistenza" del menù alle diverse visualizzazioni. In questo caso il risultato è infatti visualizzabile correttamente a risoluzioni di schermo diverse (a partire da 800×600) e con dimensioni di carattere definite dall’utente. Tutto il codice generato è validato secondo le specifiche definite da W3C (World Wide Web Consortium).
Lo sviluppo degli script di gestione del menù ha seguito il paradigma di programmazione “Unobtrusive JavaScript” di tipo “Progressive enhancement” e ciò ha permesso la realizzazione di un menù degradabile e funzionante anche in browser in cui il supporto javascript sia stato disabilitato (Graceful Degradation).

Generazione automatica del menù a due livelli da Movable Type

La quasi totalità delle pagine in cui è presente il menù sono generate dinamicamente da Movable Type. Inizialmente il menù era stato implementato come modulo presente in ogni blog (vedi post in RFC: aggiornamento del menù). Questo approccio à stato rivisto alla luce delle nuove capacità di Movable Type ottenute mediante l’installazione del plugin MTPerlScript che permette di eseguire codice scritto in linguaggio Perl direttamente da Movable Type ad ogni rigenerazione del blog.
L’architettura ottenuta è molto pià flessibile ed ha permesso di scrivere il menù come unico modulo comune a tutti i blog pur mantenendolo editabile sia dagli amministratori del sistema che dalla redazione. Lo stato del menù, che permette di rendere più evidenti le voci selezionate, à definito semplicemente indicando al sistema il numero ordinale della voce da attivare. Nell’esempio il codice necessario per la generazione automatica del menù di questa pagina:

<MTPerlScript mainmenu=”3″ submenu=”0″>
<MTInclude module=”it-menu-generator”>
</MTPerlScript>

Questa particolare combinazione dei tag messi a disposizione da Movable Type permette di includere un unico modulo contenente codice perl passandogli variabili che consentono di definire lo stato del menu: terza voce attiva nel menù principale (che rende visibile il terzo sottomenù) e nessuna voce attiva nel menù di secondo livello.