Comportamento delle pagine (2a parte)

Esiste una tipologia di situazioni in cui l'accesso ai contenuti è ostacolato dal mancato supporto per i linguaggi di scripting. Una prima barriera, come abbiamo considerato nella pagina precedente, è determinata dall'uso di eventi dipendenti dal dispositivo. Consideriamo, ora, altri casi critici.

Una prima situazione problematica riguarda la manipolazione del Document Object Model (DOM).

I linguaggi di scripting come JavaScript consentono di accedere alla struttura del documento XHTML e di modificare i suoi tag e i suoi contenuti. Le pagine web più interattive fanno spesso uso di questa opportunità per fornire informazioni specifiche a seguito di azioni condotte dagli utenti. Per esempio potremmo utilizzare uno script che esegue dei calcoli a partire dall'input dell'utente in un campo e completa le restanti parti di una form. In questo caso possiamo incorrere in due ordini problemi:

1. se la funzionalità è necessaria per proseguire nell'interazione, l'assenza totale di JavaScript o il mancato supporto per le funzionalità di gestione del DOM potrebbero creare una barriera alla fruizione del sito;
2. se è presente un simile supporto ma le richieste di elaborazione sono troppo elevate (come avviene spesso in questo caso) rischiamo di ridurre le prestazioni della piattaforma dell'utente, che dovrebbe dedicare le proprie risorse all'esecuzione di istruzioni fuori portata o comunque costose in termini di efficienza.

Altri punti delicati riguardano le form.

Spesso l'invio dei dati è subordinato alla soddisfazione di una serie di requisiti, come la compilazione di tutti i campi obbligatori o l'uso di formalismi specifici (per esempio nello scrivere un indirizzo di posta elettronica). Si dovrebbe fare in modo che la spedizione delle informazioni possa avvenire anche in assenza di supporto per JavaScript. Se tali controlli sono tuttavia importanti sarebbe bene incaricare il server che li riceve di verificare la correttezza dell'informazione, in modo anche da alleggerire il codice della pagina fornita al dispositivo mobile.

I pulsanti di invio dei moduli, inoltre, dovrebbero essere costruiti con l'apposito comando XHTML e non applicando funzioni Javascript a finti bottoni realizzati con immagini. Per esempio, il codice seguente:

<img src="bottone.gif" alt="bottone" onclick="document.form.submit();" />

non sarebbe funzionante su un dispositivo mobile non in grado di interpretare lo script (oltre che per il mancato riconoscimento dell'evento onlick, come illustrato nella pagina precedente).

Anche gli strumenti di navigazione messi a disposizione dell'utente possono incorrere in alcune problematica a causa del mancato funzionamento degli script.

Moltissimi siti, per esempio, utilizzano menu dinamici in DHTML. Questi presentano spesso una serie di problemi:

• spesso sono interamente generati dal metodo JavaScript "document.write();" : è facile intuire che in assenza del supporto per tale linguaggio nessuna voce del menu apparirà;
• nel caso in cui il menu sia comunque presente, il browser del dispositivo mobile non riuscirà a far aprire le sotto-sezioni e quindi l'utente non potrà accedere ai contenuti così collegati;

Per superare queste difficoltà la soluzione consiste nel far sì che le voci di menu siano direttamente presenti nel codice XHTML iniziale e che anche gli elementi di primo livello siano dei collegamenti ipertestuali. In questo modo, in assenza di Javascript, l'utente potrà attivare la voce di primo livello e giungere ad una pagina intermedia in cui saranno elencate le ulteriori scelte di navigazione.

Altri siti, invece, utilizzano come strumento di navigazione un menu di opzioni costruito con il tag XHTML <select>: selezionando uno dei valori l'evento onchange richiama uno script che invia il browser ad un'altra pagina. Anche in questo caso sarebbe opportuno modificare un simile strumento. Un modo potrebbe essere quello di far compiere al server il cambiamento di pagina una volta ricevuto un valore dal campo select. Il codice

<form name="navigazione">
<select id="menu" name="menu" onchange="window.location=document.navigazione.menu.value;>
<option value="index.htm">Homepage</option>
<option value="prodotti.htm">Prodotti</option>
<option value="servizi.htm">Servizi</option>
<option value="contatti.htm">Contatti</option>
</select>
</form>

Diventerebbe, quindi:

<form name="navigazione">
<select id="menu" name="menu">
<option value="index.htm">Homepage</option>
<option value="prodotti.htm">Prodotti</option>
<option value="servizi.htm">Servizi</option>
<option value="contatti.htm">Contatti</option>
</select>
<input type="submit" value="Vai!" />
</form>

Si noti l'aggiunta del campo input per l'invio del modulo, necessaria una volta che si è eliminato l'evento onchange.

Se si desidera eliminare altre barriere all'accesso al proprio sito da parte di dispositivi mobili è necessario evitare anche di collocare informazioni e funzionalità importanti in finestre pop-up o di reindirizzare con Javascript il browser dell'utente su altre pagine: in entrambi casi le pagine di destinazione non saranno aperte.

Infine sarebbero da evitare tutte le pratiche che riducono l'efficienze del sistema nel caso in cui JavaScript, invece, sia correttamente interpretato. Un semplice esempio è dato dal pre-load delle immagini per facilitare la sostituzione in roll-over. Ricordando che simili effetti potrebbero essere inefficaci su piattaforme mobili (dal momento che dipendono da eventi come onmouseover e onmouseout), si chiede al browser di scaricare byte aggiuntivi senza che né l'utente lo abbia richiesto né ve ne sia una reale necessità.