Script, applet e plug-in
Utilizzare tecnologie non-standard per fornire SOLO funzionalità ed informazioni accessorie.
Ad oggi, non è possibile realizzare alcuna applicazione web utilizzando unicamente tecnologie AJAX: è possibile migliorare le applicazioni usando AJAX e seguendo il metodo chiamato "Progressive enhancements" (Miglioramento progressivo). Oggi non è neppure possibile utilizzare unicamente Flash come contenuto: nonostante sia una tecnologia diffusa e matura, soffre ancora di problemi di accessibilità.
Requisiti di script, applet e plug-in
- Le pagine devono funzionare anche quando questo tipo di oggetti sono disabilitati o non supportati:
se questo non fosse possibile si deve fornire una spiegazione testuale equivalente.
- Per la validazione dei dati inseriti in un form è necessaria la verifica lato server: una verifica preliminare tramite Javascript è utile ma non sufficiente.
- Funzionalità e informazioni di script e applet devono essere direttamente accessibili.
- I gestori di eventi devono essere indipendenti da uno specifico dispositivo di input: devono funzionare anche con il solo uso della tastiera.
- Se è previsto un intervallo di tempo predefinito entro il quale eseguire determinate azioni, è necessario avvisare l’utente, e indicare il tempo massimo consentito.
Suggerimenti
Per offrire un´alternativa testuale all´uso degli script si può utilizzare il tag <NOSCRIPT>. All'interno di questo elemento occorre dare una vera alternativa, e non semplicemente segnalare il fatto che per quell'utente alcune o tutte le funzioni sono inibite.
Eventi
La generazione di eventi deve essere controllata dall´utente e non attivata automaticamente. In particolare:
- OnDblClick non ha equivalente con la tastiera.
- OnChange e OnSelect si devono evitare.
- Non usare eventi del mouse legati a coordinate precise.
- OnMouseOver e OnMOuseOut devono essere associati ai corrispondenti OnFocus e OnBlur.
- L'evento onClick non necessita associazioni ad altri eventi solo se se usato su link o controlli dei form .
Contenuti dinamici
Anche l'aggiornamento dei contenuti della pagina deve essere controllato dall'utente, evitare quindi:
- l’uso di HTTP-EQUIV=”REFRESH”; preferire meccanismi di redirezione lato server o prevedere una pagina statica col link per saltare alla nuova pagina;
- l'uso di document.write perchè non apparirebbe a tutti gli utenti il contenuto generato con questo comando;
Effetti visivi
Fate attenzione a particolari effetti visivi che si possono realizzare con queste tecnologie (es. DHTML):
- Evitare testi in movimento sullo schermo, oppure prevedere la possibilità da parte dell’utente, di fermarlo.
- Evitare effetti di sfarfallio, specie quelle con una frequenza compresa tra 4 e 59 Hz, che possono causare crisi epilettiche, specie se si tratta di passaggi continui dallo scuro al chiaro;
- Quando utilizzate gli script per mostrare dei contenuti della pagina, fare in modo che tali contenuti siano nascosti tramite script dopo il caricamento della pagina stessa; non utilizzate display:none per nascondere
Nuove finestre
Aprire finestre in pop-up o nuove finestre è sconsigliato, anche se risulta utile, accessibile e comunque maggiormente usabile in certi casi:
- Forzate il download di documenti non HTML (testi, filmati ecc.) se possibile, perchè sono più accessibili se aperti fuori dal browser; se non è possibile a volte è utile aprirli in nuove finestre per evitare che l'utente chiuda istintivamente la finestra in cui ha caricato il documento e perda la pagina da cui proveniva.
- Una pagina che contiene solo collegamenti a siti esterni è sensato che apra tali link in una nuova finestra.
In questi casi o anche se una pagina deve interagire con un'altra (es. per la selezione di un dato) e non si hanno altre alternative, si può aprire una nuova finestra (ma in modo accessibile, vedi esempi)
... e ancora
- Prestare attenzione ai tempi di validità di sessioni: alcuni utenti potrebbero impiegare più tempo di quanto prevedete per compilare un form.
- Se occorre scaricare software aggiuntivo (es.: un plug-in), fornire il link da cui è possibile scaricarlo (nella versione della lingua del sito).
Esempi
Nuove finestre (pop-up)
Per aprire nuove finestre è necessario mantenere la correttezza del codice XHTML, e dare la possibilità a chi non ha o non supporta javascript di accedere a tali pagine. Esistono varie tecniche per un "
perfect popup ", una di esse (di Accessify.com) è adottata da queste stesse linee guida.
Nell'HTML basta associare una classe al link da aprire nella nuova finestra
<a href="popup.html"" rel= "external" >Link da aprire in popup</a>
e aggiungere una funzione javascript alla pagina
function externalLinks( ) {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i<anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external") {
anchor.title = "il collegamento apre una nuova finestra" ;
anchor.onclick = function( ) { window.open( this.href ); return false; }
anchor.onkeypress= function(e) { k = (e) ? e.keyCode : window.event.keyCode; if (k==13) window.open(this.href); return false; }
}
}
}
poi richiamare la funzione al caricamento della pagina
<body onload="externalLinks( )">
Menu dinamici
A volte per migliorare la chiarezza dei contenuti occorre nascondere alcune parti: un
esempio di liste dinamiche e accessibili si trova sul sito della Regione
Script per migliorare l'accessibilità
Javascript è un linguaggio che si può utilizzare anche per migliorare l'accessibilità. Per migliorare la leggibilità di questo sito quando la risoluzione dello schermo è bassa (più piccola di 640px: document.body.clientWidth<641) o il carattere molto grande (offsetHeight > "30") i contenuti si ridispongono su una singola colonna grazie a questo codice.
function MinimumFontSize() {
var XDivElement = document.getElementById('q');
if ((XDivElement.offsetHeight > "30")||(document.body.clientWidth<641)) {
tags = new Array ('contenuto_home', 'approfondimenti_home', 'contenuto', 'laterale');
for (j = 0; j < tags.length; j ++) {
var getbody = document.getElementById(tags[j]);
if (getbody) {
getbody.style.styleFloat='none';
getbody.style.display = 'block';
getbody.style.width = '99%';
getbody.style.margin = '0';
getbody.style.clear = 'both';
}
}
}
}
Questo codice viene eseguito solo al caricamento della pagina.
Verifiche per script, applet e plugin
Verificare l'accessibilità di questi tipi di oggetto può essere molto complesso perchè essi potrebbero richiedere la verifica pratica sia con diversi browser che con tutte le tecnologie assistive.
Un metodo per verificare la rispondenza ai requisiti è:
- Verificare che esista almeno un'alternativa accessibile con il browser testuale Lynx per navigare la pagina.
- Utilizzare la pagina per verificare che funzioni correttamente con i seguenti browser (pari al 96% degli user agent che visitano il sito ERMES da gennaio 2007) anche su sistemi operativi diversi ove possibile:
- Microsoft Internet Explorer 7.x per Windows XP o Vista
- Microsoft Internet Explorer 6.x per Windows XP o 2000
- Mozilla Firefox 2.x su Windows/OsX/Linux
- Apple Safari 2.x per OSX o 3 per Windows/OSX
- Opera 9 per Windows/OsX/Linux
- Utilizzare la pagina con la sola tastiera
Alcune verifiche possono essere fatte con la barra dell'accessibilità (versione 2.0) , controllando:
- Fruibilità in assenza di applet: IE > Attiva/Disattiva ActiveX
- Fruibilità in assenza di Javascript: IE > Attiva/Disattiva Javascript
- Presenza di popup: Informazioni > Javascript / Link in nuove finestre
Verranno evidenziati i link in nuove finestre per facilitarne la verifica
Linee guida per siti ed applicazioni web della Regione Emilia-Romagna
