ࡱ > i k f g h g jbjbhh *> ] . . . . . . . n n n n n z t n V R Z p p p p p p p V V V V V V V , QX EZ z V . p p p p p V HR . . p p Z HR HR HR p
3 . p . p V B X . . . . p V HR HR U : rV @ . . V l u n n z: V
Internet senza
Barriere
A cura di U.Locatelli, S.Torre
Contributi di G. Busconi e M.E. Galli
Indice
Presentazione
Dall'idea al progetto
Idea e realizzazione
Contesti
Risorse
Internet senza barriere
Considerazioni
Web accessibile
Web per i disabili
Regole di riferimento
Validatori
"Il progetto pseudoente"
Il metodo di lavoro
La grafica del sito
Impostazione grafica generale
Esplorazione e pre-analisi
Approfondimenti
Progettazione delle icone
Progettazione delle immagini
Icone: dalla ricerca al design
Il software del sito
Struttura
Testata
I pro e i contro delle tabelle
Corpo della pagina
Menu di navigazione
Motore di ricerca interno
Funzione di ricerca
Barra di chiusura
Gli strumenti
Codici
Codice di Header
Codice testata
Codice form di ricerca
Codice menu verticale categorie
Elementi caratteristici dei fogli di stile
Ricerca full-text
I test
Questionari
Test di usabilit
Test di accessibilit
Bibliografia
Linkopedia
Gli autori
Appendice
Intervento in-formativo iniziale in aula
Elaborazioni e statistiche
Test di usabilit presso lUnione
Italiana Ciechi
Riorganizzazione finale del sito
PRESENTAZIONE
Quando a scuola si parla di progetti, non sempre si riesce a rendere chiaro l'utilit di quello che si fa.
Quello che segue l'esempio riuscito di un'idea che prende forma, corpo e sostanza in una realizzazione che ha retto un impegno di tre anni con il lavoro di tante persone: della scuola prima di tutto, ma anche di professionisti, associazioni, e imprenditori che hanno aiutato, con la loro esperienza, a rendere concreta una proposta didattica.
Un ringraziamento particolare va rivolto agli studenti che concludono il loro percorso formativo con l'esame di stato e con un "prodotto" che dimostra sul campo quanto hanno saputo apprendere in conoscenze e competenze, sostenuti dalla professionalit dei docenti e dei tecnici della scuola, per un'impresa che significativa anche per la sensibilit dimostrata alle tematiche della solidariet e dell'inclusione sociale per tutti i cittadini, compresi quelli pi svantaggiati.
Come preside mi auguro infine che questa esperienza contribuisca a far crescere una cultura pi consapevole e responsabile verso i problemi che quotidianamente una societ evoluta deve affrontare e risolvere e che tale auspicio si realizzi intanto stabilmente nel lavoro scolastico di docenti e studenti.
Gian Paolo Binelli
Dall'idea al progetto
Idea e realizzazione
L'idea di focalizzare l'attenzione sull'acces-sibilit e fruibilit dei siti Internet da parte di utenti disabili nata nel 2003 in ambito aziendale grazie a Stefano Torre, titolare dell'azienda informatica INFONET. Gettata come seme nell'Istituto statale ISII Marconi, ha trovato terreno fertile per la sua crescita.
Dall'idea "project core", apparentemente semplice, docenti e tecnici aziendali si addentrano nei meandri di una complessit crescente; manipolano, modellano e danno corpo all'immateriale operando tra creativit e razionalit; tra ideazione, pianificazione e applicabilit, in un continuo divenire di potenziali nuovi ambiti di ricerca.
Prende corpo un progetto assai complesso, che rapidamente trova la condivisione e la disponibilit alla collaborazione da parte del territorio (enti, istituzioni, associazioni, organizzazioni): il Web, se opportunamente acquisito, guidato e fruibile, costituisce uno strumento di concreta democrazia, via di libero accesso alla conoscenza per ognuno di noi, a maggior ragione per le persone diversamente abili: il life long learning davvero per tutti. Il 2003 proclamato anno del disabile dal Consiglio d'Europa.
Stefano Torre vuole dar corpo all'idea coinvolgendo un gruppo di giovani studenti con l'obiettivo di avviare anche un processo di sensibilizzazione al problema; per questo si rivolge a due docenti dell'istituto Tecnico "G. Marconi" di Piacenza, Giovanna Busconi e Maria Elisa Galli, con le quali ha collaborato nel recente passato.
L'idea entusiasma e cos prende forma, traducendosi in un processo produttivo.
Nasce Internet Senza Barriere (ISB) - Accessibilit e fruibilit dei siti Internet in situazioni di handicap permanente o temporaneo.
L'obiettivo primario quello di realizzare, con una classe di allievi del corso di informatica, un sito Internet operativo che sia in grado di fornire informazioni su svariati argomenti di interesse comune e di eliminare le numerose difficolt duso, consentendo una navigazione facilitata rispondente ai bisogni umani e alle esigenze tecniche "speciali" di una potenziale utenza "speciale".
Navigazione facilitata perch progettata a partire dall'ascolto diretto e dalla rilevazione delle problematiche segnalate dalle persone che ogni giorno incontrano difficolt nella fruizione di Internet perch l'accesso risulta distante dalle loro diverse abilit.
Idea complessa da concretizzare, anche per la portata del progetto stesso che con tutta evidenza pone nell'immagine e nella rappresentazione grafica il focus principe da sviluppare. Su questo tema viene coinvolto Ugo Locatelli, ricercatore visuale, che da anni studia la realt come una storia aperta dello sguardo, un luogo in cui il nostro senso di reale-irreale-diversamente reale interagisce con altri esseri umani e col mondo.
Contesti
L'Istituto Statale di Istruzione Industriale Marconi porta ogni anno al diploma di perito informatico alcune classi di allievi ed fondamentale per loro, oltre all'attenzione all'altro come formazione personale, anche la conoscenza di un settore di sviluppo che sar parte della loro professione futura.
La pertinenza del progetto ISB con la figura del perito informatico del tutto evidente.
Viene coinvolta una classe terza perch possa seguire tutte le fasi del progetto e portarlo a termine nell'arco dei tre anni di corso: la classe terza informatica 2 dell'anno scolastico 2003-04.
I ragazzi dimostrano immediatamente forte interesse e un gruppo consistente si butta a capofitto, senza risparmio, anche in orario extracurricolare, nelle attivit via via programmate, guidati per quanto concerne gli aspetti tecnici da Stefano e Giovanna, loro docente informatica, e da Maria Elisa, loro docente di elettronica, per quanto concerne gli aspetti organizzativi.
L'accessibilit a Internet risulta nel 2003 gi normata da standard europei come il W3C. Nello stesso arco di tempo il ministro dell'Innovazione tecnologica, onorevole Stanca, formula una proposta che diventa presto legge (04/2004) e che ha come obiettivo: "omissis... favorire l'accesso dei disabili agli strumenti informatici, evitando che le nuove tecnologie determinino forme di emarginazione forse ancora pi inquietanti di quelle ad oggi conosciute e, anzi, promuovendo l'uso delle medesime come fattore abilitante e di superamento delle disabilit e delle esclusioni.
Lo scopo della legge, in applicazione del principio costituzionale di eguaglianza, quello di abbattere le "barriere virtuali" che limitano l'accesso dei disabili alla Societ della Informazione e li escludono dal mondo del lavoro, dalla partecipazione democratica, da una migliore qualit della vita.
Si tratta quindi di garantire anche ai cittadini disabili il diritto di accesso alle risorse informatiche e ai servizi telematici, assicurando anche a loro una migliore opportunit di conoscenza, istruzione, lavoro, informazione ed intrattenimento.
Dopo la promulgazione della legge Stanca, molti esperti si mettono al lavoro nella direzione di dare risposte concrete alla legge; nonostante ISB sia uno dei primi progetti a partire, non riesce a tagliare per primo il traguardo: il suo compimento posticipato a causa di ritardi. Ci per necessit e non per scelta: la scuola ha anche altri obiettivi irrinunciabili da perseguire. I ragazzi continuano comunque a lavorare a un problema in fieri nella consapevolezza della sua importanza e attualit e completano la loro formazione nella cultura di una progettazione Web sensibile e rispettosa dei bisogni degli svantaggiati. C' poi un aspetto particolarmente innovativo: l'attenzione alla progettazione grafica del prodotto comunicativo.
Progettazione, non intesa in senso puramente estetico, ma all'insegna dell'accessibilit. Ad esempio, ricercare quale tra le numerose icone presenti una visualit tale da trasmettere one shot, pi e meglio delle altre, il messaggio informativo che l'icona stessa trasmette a tutta la comunit Internet; scoprire, cio, quale sia il pi rapido e significativo collegamento mentale ad alcune categorie d'informazioni di usuale consultazione.
Risorse
INFONET, nella persona di Stefano Torre, ideatore e promotore dell'iniziativa, partecipa alla progettazione, ricopre il ruolo di consulente tecnico, facendosi carico della registrazione del dominio e della creazione/gestione del sito Internet collegato al progetto. Inoltre, mette a disposizione alcuni esperti per la formazione degli allievi, finalizzata a indurre le competenze necessarie all'attuazione "guidata" delle varie fasi di processo (ricerca, analisi, progettazione, somministrazione osservata, ecc.) e alla realizzazione dei prodotti descritti.
Antonio Cotecchia, art director e grafico specializzato nella comunicazione digitale. Si occupato della progettazione e realizzazione grafica del sito, delle icone e delle immagini in collaborazione con Ugo Locatelli.
Ugo Locatelli, architetto, consulente e formatore aziendale per PDCA SYSTEM (http://www.pdcasystem.it) nell'area della gestione per processi, dell'innovazione culturale e della comunicazione d'impresa. Nel campo della sperimentazione artistica il suo interesse rivolto ai sistemi di segni e ai processi di conoscenza. Nel 1997 ha dato vita al progetto "Areale", un approccio interdisciplinare di osservazione e di ascolto del reale in continuo divenire.
Gli allievi dell'attuale classe quinta INFORMATICA 2 dell'Istituto Statale d'Istruzione Industriale "G. Marconi" di Piacenza. Sono stati operativi in tutti gli ambiti della ricerca, della preparazione e somministrazione dei test, dell'osservazione, della ricerca e catalogazione delle icone, dei report statistici.
Giovanna Busconi, laureata in matematica, docente di informatica presso ISII "Marconi" fino al 2005 e attualmente docente di matematica e fisica presso il liceo "L. Respighi" di Piacenza.
Ha collaborato al progetto coordinando tutte le attivit dei ragazzi, in particolare gli aspetti tecnico-informatici.
Maria Elisa Galli, laureata in ingegneria elettronica, docente di elettronica e telecomunicazioni presso ISII "Marconi" di Piacenza. Ha curato gli aspetti organizza-tivi e di comunicazione interna ed esterna al progetto.
Paola Miretta, content manager esperta nel rapporto tra parola e immagine.
Ha prestato la sua consulenza nella redazione dei testi relativi al rapporto esistente tra le immagini emozionali e i significati a esse sottesi.
A partire dal 2003, l'idea progettuale sostenuta da numerosi enti e associazioni del territorio, che riportiamo in ordine alfabetico:
A.I.A.S.: Associazione Italiana Assistenza Spastici;
ANMIL: Associazione Nazionale Mutilati ed Invalidi del Lavoro;
Camera di Commercio di Piacenza;
Centro di Recupero e Rieducazione Funzionale - Unit Spinale di Villanova sull'Arda;
Comune di Piacenza: Assessorato Formazione, Infanzia e Diritto allo Studio;
Comune di Podenzano: Assessorato Servizio Segreteria Generale, Contatti e Informatica;
Cooperativa di Inserimento Lavorativo "GeoCart";
CoopsElios;
A.U.S.L di Piacenza Direzione Generale e Servizio Disabilit;
Istituto Madonna della Bomba;
Istituto Santo Stefano.
Hanno collaborato, inoltre:
DIREZIONE DIDATTICA 7 CIRCOLO - Scuola XXV Aprile, con gli allievi delle classi dalla seconda alla quinta della scuola, che si sono sottoposti ai test sulla riconoscibilit delle icone;
Liceo Scientifico "L. Respighi", con la classe IV D sperimentale informatico, che ha effettuato un test sull'utilizzo del sito sia dal punto di vista dell'utente che dello sviluppatore;
Unione Italiana Ciechi, che nella figura del dott. Giovanni Taverna (membro della commissione osservatorio siti internet osi dell'unione italiana ciechi e docente qualificato dall'istituto di ricerca formazione e riabilitazione della stessa unione italiana ciechi) ha contribuito nel mostrare ai ragazzi le problematicit connesse all'utilizzo di internet da parte di utenti non vedenti.
La Provincia di Piacenza che riconosce ISB come Progetto di Qualificazione Scolastica 2003-04 e assegna un finanziamento come contributo alla copertura dei costi;
La Fondazione di Piacenza e Vigevano (2004-05), che concede un contributo finalizzato alla promozione del presente documento;
Unioncamere nazionale che, nell'ambito del concorso "Creativit ed Innovazione", ha riconosciuto al progetto ISB la nona posizione; in merito, la Camera di Commercio di Piacenza ha assegnato un premio in denaro come progetto secondo classificato a livello provinciale;
Internet senza barriere
"INTERNET SENZA BARRIERE", ovvero la rete senza barriere architettoniche, senza ostacoli di accessibilit: alla portati di tutti, appunto.
Riassumiamo le fasi temporali che caratte-rizzano gli step del processo:
Fase 1 settembre 2003 - marzo 2004
Lo start-up esaminare l'esistente e studiare alcuni aspetti che i ragazzi non hanno, nel loro curricolo scolastico, avuto occasione di approfondire. In termini di contenuti:
- le varie Raccomandazioni esistenti sul tema dell'accessibilit;
- la legge Stanca;
- le basi della cromatologia e della rappresentazione delle immagini.
In termini di riflessioni:
- guardare con gli "occhi" di alcuni utenti diversamente abili i siti esistenti - A questo scopo particolarmente significativo l'intervento di un medico ipovedente che mostra come, navigando sulla rete supportati da un programma-interprete che "legge" i contenuti incontrati con il mouse, anche pagine di siti "famosi" diventino praticamente incomprensibili;
- esaminare le icone esistenti sul web - Cosa ci garantisce che le immagini che noi scegliamo per indicare aree o argomenti del nostro sito abbiano anche per chi ci legge lo stesso significato e non possano invece essere male interpretate? L'uso delle icone in Internet non rischia di diventare un abuso attraverso il quale un sito diventa s pi bello e accattivante, ma non sempre leggibile?
Questa fase si svolge in classe prevalente-mente nelle ore di informatica.
Fase 2 marzo 2004 - settembre 2004
Da questo momento il gruppo classe stato organizzato in due sottogruppi ai fini di ottimizzare il rapporto tempi/risultati:
- gruppo sito
- gruppo icone.
Il gruppo "sito" coordinato da Stefano Torre studia l'impostazione da dare al sito Web ISB: lo progetta, lo realizza utilizzando un codice messo a disposizione da INFONET e lo riempie di contenuti, anche non eccessivamente selezionati e organizzati, per avere una base su cui effettuare i primi test di accessibilit, dai cui risultati dedurre azioni di ri-progettazione. I ragazzi lavorano in orario curricolare, ma anche durante i mesi estivi, in certe occasioni a scuola, pi spesso in azienda come attivit di integrazione scuola-lavoro.
Il gruppo "icone" si occupa della parte grafica per trovare icone che possano rappresentare in modo univoco le categorie del sito.
Le icone devono essere le pi attendibili e chiare possibile, in quanto, al termine della ricerca sostituiranno il nome della categoria correlata nel nostro sito ISB; tutto ci finalizzato a:
- agevolare la navigazione visuale;
- supportare la comunit di ipovedenti in difficolt nella navigazione delle pagine Web tradizionalmente concepite;
- rendere l'esperienza del web il pi gradevole e semplice possibile.
Per raggiungere tali risultati, l'azione sul tema icone viene suddivisa in due tempi:
1. Ricerca e raccolta di molte centinaia di icone:
- nel Web;
- su altri supporti (dispense multimediali, disco CD-ROM).
2. Normalizzazione delle icone.
Per normalizzazione si intende un'accurata selezione delle immagini in base a determinati criteri relativi a:
- colore: le icone devono essere in bianco e nero o al massimo in gradazioni di grigio, in modo tale da poterle adattare il meglio possibile al colore predominante della categoria;
- dimensione: le icone devono essere salvate in un formato relativamente piccolo (28x40 pixel).
E' l'estate 2004 e nasce la prima versione del sito, reperibile all'indirizzo Web http://www.internetsenzabarriere.net.
Fase 3 settembre 2004 - gennaio 2006
Questo step comprende la parte pi importante del progetto, ovvero la validazione di tutto il lavoro. Il gruppo si posto importanti interrogativi, tra cui:
- come valutare la navigabilit del sito;
- come scegliere le icone pi significative;
- quali test effettuare per verificare l'accessibilit del sito.
La terza fase si occupa, pertanto, dell'implementazione, della realizzazione e della lettura statistica di due serie di test:
- una prima serie di test rivolta allo studio dell'accessibilit del sito e della sua usabilit sia dal punto di vista degli utenti sia dal punto di vista degli sviluppatori. I test sono stati somministrati ad allievi di scuola superiore e a persone adulte esterne;
- una seconda serie di test, specifici e finalizzati a individuare le icone pi significative per una serie di categorie tipo, somministrata a bambini, ragazzi e adulti.
I nostri ragazzi, progettisti ISB, svolgono un lavoro essenziale per la preparazione e la somministrazione dei test: alcuni sono on-line, altri cartacei. I primi necessitano di un monitoraggio costante e procedurale completamente affidato agli allievi; i secondi abbisognano di una lettura statistica da svolgersi attraverso l'elaborazione di grafici e tabelle. L'analisi dei risultati dei test si sviluppa nelle ore curricolari di statistica, sotto la guida attenta ed esperta della docente Anna Petruzzi. Lo spoglio e la lettura dei risultati permette di individuare ulteriori modifiche da apportare al sito nonch scegliere le icone da inserirvi.
E' l'inizio del 2006 ed pronta la versione finale di http://www.internetsenzabarriere.it.
Fase 4 gennaio 2006 - maggio 2006
L'ultima fase la sintesi di tutto il processo-prodotti, facendo la raccolta delle parti pi significative del progetto per darne una presentazione organica che possa rendere ragione del lavoro svolto e dei risultati raggiunti affinch altri possano trarne vantaggi e proseguire nel percorso intrapreso.
Considerazioni
Il bilancio finale sicuramente pi che positivo. Gli allievi hanno potuto arricchire la loro formazione con un progetto condiviso sul territorio inerente aspetti di estrema attualit, pertinenti al loro profilo professionale e dalla sicura valenza formativa sia a livello tecnico sia a livello personale.
La scuola ha dimostrato che la collaborazione con le aziende e il territorio possibile e porta valore aggiunto al know-how di entrambi. Noi adulti, nei diversi nostri ruoli, abbiamo lavorato mettendoci idee, energie e risorse; siamo altres consapevoli di aver operato per i nostri ragazzi, per noi stessi e, ci auguriamo, anche per concorrere a rendere internet un servizio per tutti.
Web accessibile
Web per i disabili
Ci concentreremo sul progetto e sulla realizzazione di pagine Web destinate a essere facilmente utilizzate da utenti disabili.
Poich la natura e la forma delle innumerevoli disabilit sono cos variegate da impedire un approccio di tipo puntuale, cercheremo di trovare una forma di mediazione tra le diverse esigenze, concentrandoci sulle forme di disabilit pi comuni e pi facilmente schematizzabili. In primo luogo le disabilit della vista, tanto quelle lievi (forme di ipovedenza) quanto quelle totali. Scopriremo tra l'altro che gli utenti pi importanti dei nostri siti Web sono assimilabili a utenti non vedenti. Infatti i motori di ricerca sono a tutti gli effetti utenti totalmente ciechi. In sintesi estrema, affrontare le problematiche della accessibilit di un sito Web significa presupporre che molti utenti agiscano in un contesto dissimile dall'usuale. In particolare, potrebbero:
non essere in grado di vedere, sentire, muoversi, o recepire in modo agevole - o affatto - alcuni tipi di informazioni;
avere difficolt a leggere o comprendere i testi;
non essere in grado di usare la tastiera o il mouse;
utilizzare un lettore solo-testo, un piccolo monitor, o una connessione a Internet molto lenta;
non dominare la lingua in cui scritto il testo;
trovarsi a non disporre appieno della loro vista, udito, o delle loro mani (per esempio guidando, in un ambiente inquinato acusticamente, ecc.);
disporre di una versione antiquata del browser, o di un browser alternativo, di un browser vocale ad esempio, o di un inusuale sistema operativo.
Un sito accessibile prima di tutto un sito usabile. Il concetto di accessibilit non quindi da astrarsi nella isolata sfera delle tecnologie a disposizione dei disabili per navigare Internet ma deve estendersi al pi generale concetto di usabilit. Occorre quindi studiare anche la modalit di presentazione dei contenuti, la loro classificazione e la loro rintracciabilit all'interno del sito.
Solamente dopo aver ottenuto qualcosa di facilmente usabile potremo dedicarci a curare l'aspetto dell'accessibilit ai disabili.
L'accessibilit di un sito Internet definita in rapporto all'effettiva possibilit di un utente di usufruire di un contenuto Web attraverso l'interfaccia del sito mediante l'ausilio di vari dispositivi.
Secondo Tim Berners-Lee, direttore del World Wide Web Consortium1 e inventore del Web in senso moderno, rendere la rete accessibile significa "mettere Internet e i suoi servizi a disposizione di tutti gli individui, indipendentemente dai loro requisiti hardware e software, dall'infrastruttura di rete, dal loro linguaggio di nascita, dalla loro cultura, posizione geografica e attitudini fisiche e mentali."
"La forza del Web sta nella sua universalit. L'accessibilit da parte di chiunque, indipendentemente dalla disabilit, ne un aspetto essenziale."
Le aree fondamentali che riguardano l'accessibilit sono due: i problemi di accesso Web delle persone con handicap e l'attenzione a garantire l'universalit dell'accesso, riferendosi non solo ai disabili in senso stretto, ma anche a chi soffre di inabilit temporanee, chi ha attrezzature obsolete, chi usa sistemi poco comuni, chi dispone di connessioni particolarmente lente.
Per quanto riguarda la disabilit il discorso diventa pi complesso: l'Organizzazione mondiale della sanit ha precisato per la prima volta, nel 1980, i significati di alcuni termini fondamentali per stabilire un chiaro punto di partenza nello studio e nell'analisi dei problemi connessi al mondo dei disabili.
In particolare, essa ha definito la "menomazione" (impairment) come "perdita o anormalit a carico di una struttura o di una funzione psicologica, fisiologica o anatomica", la "disabilit" (disability) come "qualsiasi limitazione o perdita (conseguente a menomazione) della capacit di compiere un'attivit nel modo o nell'ampiezza considerati normali per un essere umano" e l'"handicap" come la "condizione di svantaggio, conseguente a una menomazione o a una disabilit, che in un certo soggetto limita o impedisce l'adempimento del ruolo normale per tale soggetto in relazione all'et, al sesso e ai fattori socioculturali".
Queste definizioni, bench abbiano avuto il merito di porre i primi paletti per lo studio della questione, sono state abbandonate e sostituite dalla stessa Oms nel 20012 con classificazioni positive, che partono cio dalla considerazione di uno stato di salute e che possono quindi essere applicate universalmente.
La classificazione fornita composta di cinque macroclassi:
funzioni corporee (funzioni fisiologiche e psicologiche)
strutture corporee
attivit (capacit di esecuzione di un compito)
partecipazione
fattori ambientali (contesto sociale, atteggiamenti, caratteristiche del mondo fisico).
In base a questa catalogazione l'individuo (non necessariamente il disabile) pu essere associato a uno o pi qualificatori che valutano se, quanto e come il soggetto si discosta dalla condizione di normalit.
Allargando la questione, vengono incluse nella definizione di disabilit anche categorie "deboli" come gli anziani o gli emarginati.
La concezione sociale di disabilit cambiata nel tempo: essa non pi solo un attributo della persona, ma un insieme di condizioni potenzialmente restrittive derivanti da un fallimento della societ nel soddisfare i bisogni delle persone e nel consentire loro di mettere a frutto le proprie capacit (Cfr. Commissione Europea, Delivering e Accessibility, 26/9/2002).
Non facile stabilire con esattezza il numero di disabili in Italia. Il problema legato al fatto che i risultati sono molto differenti in base al tipo di definizione che si prende in considerazione per il termine "disabilit", un concetto estremamente vasto e non universale. In molti casi, inoltre, vengono usati in maniera imprecisa, o vengono erroneamente interscambiati, i termini "invalidit", "handicap"e "disabilit". L'altro problema concerne la valutazione del numero reale dei disabili poich la precisione della rilevazione dipende dal tipo di disabilit; molto pi complicato ad esempio rilevare le disabilit mentali rispetto a quelle fisiche sia perch non esistono strumenti statistici adeguati (viene utilizzata l'intervista), sia perch molto spesso pregiudizi e vergogna spingono un gran numero di persone a non entrare in contatto con i servizi di assistenza e a nascondere la disabilit di un familiare. Inoltre, il 33% dei disabili portatore di almeno due disabilit contemporaneamente fra disabilit nelle funzioni, disabilit nel movimento e disabilit sensoriali per cui i risultati risultano essere spesso falsati. Un'ultima considerazione va fatta in rapporto ai bambini al di sotto dei 6 anni di et, per i quali non possibile al momento stilare un censimento attendibile.
Secondo l'ISTAT, che si rif alla definizione di disabilit proposta dall'Oms, in Italia i disabili sono circa 2.615.000, il 5% del totale della popolazione3. La tipologia di disabilit pi diffusa quella legata alle difficolt di svolgimento delle attivit quotidiane di cura della propria persona (3% della popolazione totale). Seguono la disabilit nel movimento (2,2%), il confinamento individuale a casa (2,1%) e la disabilit sensoriale (1% della popolazione totale). In particolare i ciechi parziali o totali sono 352mila, le persone con problemi dell'udito 877mila e i sordomuti 92mila. L'invecchiamento della popolazione, legato all'aumento della speranza di vita alla nascita, in particolare per le donne, contribuisce a una progressiva espansione del numero dei disabili: il 20 % degli italiani over 65 e quasi la met degli ultraottantenni convivono infatti con un grado di disabilit pi o meno elevato.
Numero di disabili secondo l'et e il tipo di disabilit
ISTAT, Indagine sulle condizioni di salute e ricorso ai servizi sanitari, 1999-2000.
quozienti per 1.000 persone
6-14 15-44 45-64 65-74 75-79 80- totale n. disabili
anni anni anni anni anni oltre (migliaia4)
Disabili 15,6 9,1 25,3 91,4 195,7 476,7 48,5 2.615
Confinamento
individuale 4,5 4,1 9,6 33,3 84,9 249,7 21,4 1.153
Difficolt nelle
funzioni 10,8 4,3 10,0 45,0 118,0 352,4 28,8 1.555
Difficolt nel
movimento 1,7 2,6 12,0 47,5 98,8 225,0 22,3 1.204
Difficolt vista,
udito, parola 2,4 2,7 5,7 16,3 35,4 128,9 11,1 600
N.disabili
(migliaia) 80 222 362 527 442 982 2.615
Se stilare un resoconto preciso del numero di disabili risulta un compito estremamente arduo, le difficolt aumentano in maniera esponenziale se si desidera fornire dati riguardanti il rapporto tra disabilit, utilizzo del Pc e navigazione in rete.
In particolare necessario fare alcune doverose precisazioni.
In primo luogo il concetto di disabile secondo il quale sono stati raccolti i dati dall'ISTAT non pi valido per l'analisi in questione. Un paraplegico per esempio avr certamente un handicap quando si tratti di svolgere attivit motorie, ma potrebbe non averne nessuno nel caso dell'utilizzo di un personal computer venendo a ragione escluso, nella nostra rilevazione, dalla categoria dei disabili; al contrario, un individuo normodotato (uno straniero o un utente con una scarsa conoscenza della rete) potrebbe trovarsi in serie difficolt con l'utilizzo del media ed essere in questo caso in una condizione di forte disabilit.
Inoltre, non esistono statistiche ufficiali relativamente alla penetrazione delle tecnologie dell'informazione in rapporto alla disabilit, anche se gli utenti Internet disabili sono stimati tra 300 e 500mila.
Internet e Accessibilit: il rapporto dei disabili e degli anziani con Internet
Nielsen, SMAU 2002
invalidit cecit sordit Anziani
motoria (non disabili)
Quanti sono (n) 1.414.000 350.000 870.000 5.149.000
Quanti utilizzano
Internet (%) 20% 20% 20% 2,4%
Quanti utilizzano
Internet (n) 282.800 70.000 174.000 123.576
Regole di riferimento
Sono documenti prodotti da una commissione apposita della W3C, e in particolare la raccomandazione W3C del 5 maggio 1999 stata il nostro punto di partenza.
Le linee guida per l'accessibilit (Web Content Accessibility Guidelines) dei contenuti Web spiegano come realizzare contenuti per il Web in modo che siano accessibili a persone colpite da disabilit.
Le linee guida sono rivolte agli sviluppatori di contenuti per il Web (autori di pagine Web e persone che si occupano del design di siti Web), nonch agli sviluppatori di strumenti di authoring.
Il fine primario delle linee guida quello di promuovere l'accessibilit. La loro applicazione consente di rendere disponibili i contenuti Web a tutti gli utenti, indipendentemente dal tipo di strumento di navigazione utilizzato (ad esempio browser grafici, browser vocali, cellulari, navigatori per automobile ecc.) o da limitazioni cui ci si trovi costretti (ad es. un ambiente rumoroso, sovra o sotto-illuminato, o circostanze che impongano di non utilizzare le mani ecc.).
Nel documento inclusa un'appendice che organizza tutti i punti di controllo (checkpoints), per argomento e priorit. I punti di controllo linkano alle loro definizioni, presenti nel documento. Gli argomenti dell'appendice includono immagini, documenti multimediali, tabelle, frame, moduli e script. L'appendice disponibile sia in veste di sommario tabellare che come lista semplice. La raccomandazione W3C prevede tre livelli di conformit, rispettivamente indicati con A, AA, AAA. Per ognuno di questi prevista una serie di controlli rispetto ai quali far rispondere positivamente le pagine del sito. Alcuni dei punti presenti nelle liste di controllo sono verificabili automaticamente, utilizzando appositi validatori, altri devono essere verificati manualmente dagli sviluppatori.
Validatori
In rete sono disponibili innumerevoli validatori per il controllo della conformit del sito agli standard W3C. Una lista dettagliata presente sul sito della W3C (http://w3c.org).
Il pi conosciuto e utilizzato tra i validatori lo "storico" Bobby, strumento in grado di eseguire un controllo di conformit sia rispetto alle raccomandazioni W3C per i tre livelli di conformit previsti, sia rispetto alla normativa statunitense 508.
Lo strumento disponibile on-line e consente la validazione di una pagina per volta gratuitamente e prevede una versione scaricabile a pagamento e in grado di eseguire una verifica di validazione automatica su tutto il sito.
Nel parlare di validatori occorre anche citare la validissima esperienza di Torquemada, un validatore italiano nato all'interno dell'iniziativa web x tutti della fondazione Ugo Bordoni.
"Il progetto pseudoente"
Ci siamo prefissi di produrre il sito di uno pseudo ente pubblico; potrebbe essere un comune, una provincia, una regione, comunque un sito stracolmo di informazioni al punto da rendere difficoltoso il reperimento di quella o quelle di interesse per l'utente.
L'obiettivo stato quello di provare a confrontarci con un contenitore di notizie/informazioni che, pur non raggiungendo una dimensione enciclopedica, fosse comunque rappresentativo delle principali delle categorie di internauti.
Tra le ipotesi iniziali, ovvero la costruzione del sito di un giornale quotidiano, quella di un atlante geografico e quella di un ente pubblico, ha prevalso questa ultima poich valutata molto pi vicina delle altre alle esperienze quotidiane dei ragazzi che si accingevano ad iniziare l'avventura del progetto internet senza barriere.
Note:
1 Il word wide web consortium l'organismo internazionale senza fini di lucro, che dal 1994 ha il compito di definire i linguaggi e le procedure standard per rendere il Web uno strumento realmente democratico e universale.
2 International classification of function, usability and health (ICF).
ISTAT, Indagine sulle condizioni di salute e ricorso ai servizi sanitari, 1999-2000.
La somma dei disabili secondo il tipo di disabilit pu essere superiore al numero complessivo di disabili, perch una stessa persona pu essere portatrice di pi disabilit contemporaneamente. E' da precisare inoltre che dai risultati sono esclusi i disabili temporanei, ovvero coloro che, per malattia, incidenti o interventi chirurgici, si trovano a dover convivere con qualche forma di disabilit per un certo lasso di tempo.
Il metodo di lavoro
Nel primo incontro informativo con gli studenti coinvolti nel progetto, Ugo Locatelli e Stefano Torre hanno presentato le finalit, alcuni riferimenti teorici e metodologici (vedi allegati nell'Appendice). In particolare stata segnalata l'opportunit di applicare in modo sistematico lungo il percorso il ciclo PDCA, che un metodo per il miglioramento progressivo della qualit operativa costituito da quattro passaggi base:
Plan (Pianificare)
Si raccolgono le informazioni necessarie, si mettono a fuoco gli obiettivi e il programma delle attivit per conseguirli.
Do (Fare)
Si svolgono le attivit.
Check (Verificare)
Vengono verificati gli eventuali scostamenti tra gli obiettivi programmati e le attivit effettivamente realizzate.
Action (Confermare o adattare)
Si consolidano i risultati o si definiscono le azioni correttive e il rilancio di un nuovo ciclo PDCA.
Un altro strumento adottato il diagramma di Gantt, che permette di rappresentare nel tempo le diverse attivit del progetto sia nella fase di programmazione che nelle fasi di controllo intermedio e finale (vedi allegati nell'Appendice).
Le principali attivit possono essere descritte in termini di data di inizio, fine reale o prevista, avanzamento e referenti con responsabilit specifiche.
La grafica del sito
Impostazione grafica generale
La struttura grafica del sito stata definita attraverso diverse tappe e retroazioni finalizzate a semplificare e ottimizzare il linguaggio visivo, in relazione agli obiettivi del progetto e ai riscontri e suggerimenti forniti dai test on-line e cartacei.
Questi, come gi segnalato nell'introduzione, sono stati somministrati dagli studenti a bambini, ragazzi e adulti (vedi Appendice).
Oltre alle caratteristiche dell'icona-madre, creata fin dall'inizio per identificare il sito Internet Senza Barriere, le idee che hanno guidato il percorso, dalle fasi preliminari di ricerca e selezione dei materiali alle tappe operative di realizzazione del sito sono state: la facilitazione, la coerenza e la riconoscibilit.
Nello sviluppo del processo di realizzazione del sito gli obiettivi di base sono stati i seguenti:
a) deve essere comprensibile:
la grafica come elemento di semplificazione e facilitazione dell'uso del sito nella comprensione delle aree tematiche e dei contenuti, nella lettura visiva della singola pagina e della successione di pagine diverse;
b) deve avere senso per gli altri:
la grafica come parte integrante del contenuto e della navigazione;
c) deve essere diverso:
la grafica come parte di un sistema di comunicazione chiaramente riconoscibile.
Il logo sintetizza in forma grafica l'obiettivo del progetto, ovvero la volont di realizzare un contenitore Web non solo facilmente utilizzabile da utenti disabili fisici ma, proprio perch studiato per essere ben usabile, destinato a poter essere facilmente fruito da tutti. Il logo raffigura una persona col bastone, un disabile in carrozzina e una persona senza alcuna disabilit.
I tre si tengono per mano come a voler condividere le loro condizioni e a rappresentare la totalit degli utenti del Web.
Come detto la versione finale del sito il risultato di successivi affinamenti che poco a poco ci hanno portato a una formula essenziale, scevra da ogni ridondanza e facilmente comprensibile.
In particolare nell'ultima fase della lavorazione ci siamo concentrati sulla cucitura tra i contenuti, le icone e le immagini, uniformando cromaticamente i diversi elementi.
Rispetto alla versione precedente, ancora visibile all'indirizzo http://www.internetsenzabarriere.net, si scelto di utilizzare il colore azzurro in diverse tonalit come elemento dominante della grafica.
Esplorazione e pre analisi
Il gruppo "icone" si dedicato inizialmente all'individuazione e all'esplorazione di due grandi aree del mondo visuale costruito, attuali e promettenti:
1) la segnaletica: stradale, delle reti metropolitane, dei trasporti, aziendale, del turismo, dello sport, degli edifici e luoghi pubblici (ospedali, musei, aeroporti, parchi e giardini, centri commerciali, parcheggi ecc.);
2) l'iconografia dei computer e degli apparecchi televisivi e domestici.
Successivamente ha costruito un catalogo con un'ampia selezione di segni di identificazione e informazione.
In questa fase il criterio di scelta stato la loro capacit di trasmettere informazioni con forme semplici, anche se disomogenee sul piano grafico e morfologico (vedi Appendice).
Approfondimenti
Nel corso dell'analisi ci si interrogati sull'origine dei segni antropomorfi nella storia: i primi, disegnati, incisi o dipinti e usati per rappresentare visivamente l'essere umano, risalgono a 40.000 anni fa.
Dai segni usati come aiuto della memoria sono nate le pittografie che esprimono idee attraverso immagini.
Considerando poi lo sviluppo dei segni globali moderni - in particolare il lavoro di Otto Neurath (1882-1945)5 - sono emerse gradualmente la persistenza, l'universalit, l'efficacia e le potenzialit dei pittogrammi come tramite fra linguaggio simbolico e uso.
Manifesto della mostra AIAP alla Triennale di Milano (2003)
Neurath, filosofo, economista e sociologo austriaco fond e diresse nel 1925 il Museo Sociale ed Economico di Vienna.
Obiettivo del museo era diffondere tra i cittadini la conoscenza di informazioni e dati statistici, in modo che essi potessero comprendere meglio la realt del proprio paese.
Secondo Neurath "il cittadino medio dovrebbe essere in grado di acquisire informazioni su ogni tema che lo interessa, cos come pu ottenere informazioni geografiche da mappe e atlanti".
Per realizzare il suo programma di divulgazione studi un sistema di rappresentazione visiva di informazioni e dati, basata sul fatto che l'apprendimento avviene in modo pi immediato e intuitivo tramite immagini semplici, rispetto alle parole. Era cosciente del ruolo sempre maggiore che le immagini stavano prendendo nell'ambito della comunicazione: "L'uomo moderno riceve una gran parte delle sue conoscenze e della sua istruzione in generale tramite impressioni visive, illustrazioni, fotografie, film".
Prendendo spunto dalle teorie di Wittgenstein, Neurath immagin un linguaggio visivo composto da icone che potessero combinarsi tra loro secondo regole stabilite, per dar vita a un sistema di comunicazione universale. Chiam a collaborare l'artista e grafico tedesco Gert Arntz, che tradusse le sue teorie in un sistema di segni grafici denominato Isotype (International system of typographic picture education).
Il sistema introduce alcuni semplici ma importanti principi per la definizione visiva: per ogni categoria da rappresentare viene individuato un segno le cui caratteristiche essenziali sono la semplicit, la riconoscibilit e l'immediatezza. Si deve quindi evitare che il segno abbia troppi dettagli. Nelle parole di Neurath: "Un'immagine che fa un buon uso del sistema deve trasmettere tutte le informazioni basilari riguardo all'elemento che rappresenta. Al primo sguardo si vedono gli elementi essenziali, al secondo i meno importanti, al terzo i dettagli".
La semplicit del disegno permette anche di allineare i diversi segni su una stessa linea, come si farebbe con i caratteri tipografici.
Isotype cre le basi per lo sviluppo dell'information design6 nel ventesimo secolo. Tra i progetti che possono essere considerati una derivazione si possono citare il sistema di pittogrammi che Oti Aicher ha realizzato per identificare i diversi sport alle Olimpiadi di Monaco nel 1972 e gli studi realizzati dall'AIGA (American Institute of Graphic Arts) per il Dipartimento dei Trasporti degli Stati Uniti. L'information design il settore della progettazione visiva che si occupa di rendere le informazioni accessibili al pubblico.
Trova applicazione nei settori dell'educazione, della divulgazione scientifica, dell'orientamento nell'ambiente. Il suo intervento si applica quindi alla progettazione di sistemi di segnaletica, punti informativi, modulistica, mappe, manuali tecnici ecc.
Nell'information design gli aspetti estetici e persuasivi della comunicazione visiva diventano secondari rispetto ai criteri di chiarezza e funzionalit.
Progettazione delle icone
Dalle fasi di raccolta, test orientativi, pre-analisi e approfondimento si quindi passati alla creazione di relazioni visive formali tra segni e categorie. Il lavoro, apparentemente semplice, ha presentato diverse difficolt.
Tutte le associazioni ragionevolmente possibili non si prestano automaticamente a un risultato estetico soddisfacente: spesso sono troppo semplici e quelle troppo complicate sono inutilizzabili ai fini della comunicazione.
E' comunque un metodo di ricerca creativa che, per associazione linguistica e visuale, ha generato interessanti sviluppi di nuovi segni: il confronto e la combinazione di forme conosciute ha portato alla scoperta di altre possibilit.
Consideriamo i risultati che presentiamo qui di seguito non un traguardo finale e conclusivo ma una prima ipotesi aperta, nella logica del miglioramento continuo, a ogni ottimizzazione ed evoluzione.
Progettazione delle immagini
Per ogni categoria sono state individuate ed elaborate immagini fotografiche della natura, con una funzione non puramente decorativa - che avrebbe rischiato di allontanare l'utente invece di attrarlo - ma di contenuto, rafforzativo del significato delle icone.
Con dimensioni e posizionamento unificati utilizzano la natura sia come sorgente evocativa-emozionale sia come sorgente estetica e informativa. Da un'unica fonte di ispirazione provengono significati complessi che si richiamano tra loro costruendo un comune contesto comunicativo. La stessa coerenza ha ispirato la scelta delle immagini emozionali, tutte accomunate da un unico "concept" di base: il mondo vegetale.
Le immagini veicolano i significati per analogia (la forma del significante, ovvero l'elemento vegetale raffigurato, analoga al significato che suggerisce) o perch rimandano a una rappresentazione simbolica del concetto che in esse soggiace.
Centrale nell'immagine emozionale di "Anagrafe" l'albero, visto per da tre diverse prospettive: si passa dal bosco a una visione ravvicinata del gruppo di alberi, fino al particolare dei cerchi concentrici del tronco di un singolo albero.
Si suggerisce dunque il passaggio dal generale al particolare, dalla moltitudine all'individuo, dal gruppo alle specificit del soggetto. Dal tronco di un albero possibile infatti risalire alla sua et e alla sua "storia" cos come da un'anagrafe possibile estrapolare informazioni specifiche su una persona, dalla data di nascita, alla sua provenienza, alla composizione del suo nucleo familiare.
L'immagine scelta per "Cultura" suggerisce due percorsi di significato. Il primo percorso di natura analogica: il dettaglio della forma suggerisce un'analogia con l'immagine di un libro aperto. Il secondo percorso invece di natura simbolica: il libro aperto pu infatti essere considerato metafora di apprendimento e crescita intellettuale.
L'immagine di "Edilizia" quella che pi di tutte rappresenta l'unione tra razionalit umana (l'attivit del "costruire" attraverso uno schema ben preciso di "posa" di mattoni) e molteplicit naturale (ogni mattone racchiude un diverso tipo di prato per stato di evoluzione, crescita e composizione).
Il ramo della "Scuola" un'immagine tripla che racchiude tre diversi stati di crescita dell'albero: ramo acerbo, fiore e frutto. Tale passaggio (che nell'immagine per contemporaneo) suggerisce come il percorso formativo dell'individuo (il ramo) determini un'evoluzione della persona nel suo complesso, dall'infanzia alla maturit, dall'effervescenza della "gemma" nuova, all'energia del fiore profumato, alla consapevolezza della vita.
L'immagine prescelta per "Spesa pubblica" la pi "collettiva" delle immagini utilizzate e suggerisce, nella vista di un fiume nutrito dalla rete dei suoi affluenti, come sia necessario l'apporto idrico dei singoli corsi d'acqua per la sopravvivenza del fiume e del suo ecosistema. Ma la sopravvivenza dell'ambiente circostante al fiume e dei suoi stessi affluenti dipende dalla quantit di acqua che costituisce il fiume stesso e che il fiume restituisce al territorio.
Allo stesso modo il contributo degli individui indispensabile a far funzionare un'intera societ che a sua volta incide sul benessere dei singoli offrendo servizi e distribuendo risorse.
Il dettaglio particolareggiato della foglia vista in trasparenza per la "Comunicazione" esemplificativo di come i collegamenti tra le parti di un organismo siano necessari alla sopravvivenza dello stesso.
Della foglia, infatti, balzano all'attenzione dell'osservatore le venature rigonfie di linfa.
Il verde brillante dei pigmenti suggerisce la buona salute della pianta che proprio attraverso i vasi linfatici apporta a ciascuna sua parte (anche la pi piccola e periferica, la foglia appunto) nutrimento e vita.
La stessa cosa avviene nell'organismo umano e, trasposto sul piano sociale, nel rapporto tra gli individui.
La comunicazione (vista come scambio di informazioni, significati ed emozioni, linfa della societ) consente agli individui di cooperare per il funzionamento di strutture sociali complesse come la famiglia, l'azienda, la scuola e le altre organizzazioni sociali che punteggiano e fanno la vita di ognuno di noi.
Per la sezione dedicata ai "Servizi" si scelto il dettaglio di una margherita fiorita. I singoli petali sono stati colorati di tinte diverse a suggerire l'eterogeneit dell'utenza e delle richieste. I petali multicolore sono uniti tra loro da un'unica corona: la molteplicit infatti non esclude l'esistenza di un intento comune e di un unico obiettivo.
Per la sezione "Segreteria" si ricorso alla metafora dell'alveare che racchiude in s due concetti: l'operosit e la precisione delle api operaie che lavorano con pazienza alla costruzione di un nido comune; l'ordine e la perizia che emergono dal numero di celle perfettamente allineate. Ci pone l'accento sull'esistenza di un gruppo di lavoro, che opera "dietro le quinte" con dedizione per la corretta amministrazione e gestione.
L'immagine progettata per la categoria "Sport" raffigura un prato vuoto, una sorta di campo da gioco allo stato primordiale. Il prato infatti non presenta righe n una suddivisione degli spazi che suggerisca un gioco particolare. l'immagine del pallone, che emerge dal prato, a suggerire invece il gioco del calcio, scelto non per popolarit quanto perch radicato nell'istinto ludico dell'uomo come uno dei primi "giochi" della storia. Si pensa, infatti, che l'inseguimento di un oggetto rotolante a terra, che poi diventer una palla, sia stato uno dei primi divertimenti (sport deriva dal francese desport che significa appunto svago). L'immagine unisce un campo verde, su cui correre e liberare l'istinto, al pallone calcio, ovvero alla codificazione del gioco istintivo in disciplina regolamentata. L'unione tra natura e cultura stretta ed rimarcata dal fatto che il prato si trasferisce sul pallone, rivestendolo dello stesso materiale.
note
Neurath, Isotype e i segni globali moderni, in Progetto grafico n 2, AIAP, Milano 2002.
Secondo la definizione data dall'International Institute for Information Design, esso "si occupa di definire, pianificare e dare forma ai contenuti di un messaggio e al contesto in cui esso viene presentato, con l'intento di ottenere obiettivi precisi in relazione alle necessit degli utenti".
Icone: dalla ricerca al design
L'operazione che consente di progettare e realizzare segni iconici a partire dall'osservazione della realt si basa su un processo deduttivo: da un significato generale si enucleano i dettagli di valore, sintetizzati in un segno iconico, che grazie alla continuit che stabilisce tra forma e significato suggerisce immediatamente il concetto. Tale processo stato all'origine della formulazione dei segni iconici presenti nel sito di Internet Senza Barriere.
Addirittura alcuni segni sono il risultato della sintesi ulteriore tra segni iconici esistenti, individuati dagli studenti come i pi rappresentativi di un concetto orientativo.
Per i concetti generali, che per altro individuano le differenti aree del sito (anagrafe, comunicazione, cultura, edilizia, scuola, segreteria, servizi, spesa pubblica, sport, Internet Senza Barriere), stata condotta una ricerca sulle icone esistenti e maggiormente utilizzate per rappresentare quegli stessi concetti nella comunicazione quotidiana e in quella della rete.
Dalle icone individuate e dai risultati derivanti dai test sulla riconoscibilit delle stesse presso un campione variegato di persone di differente et e provenienza, si poi provveduto alla progettazione e realizzazione di un nuovo gruppo di icone, spesso risultato dalla sintesi di icone esistenti o dalla loro modifica. Questo gruppo di icone quello oggi visibile sul sito del progetto Internet Senza Barriere.
da queste che si poi partiti per la progettazione e realizzazione creativa delle immagini emozionali che introducono i contenuti di ciascuna sezione del sito. Si seguito quindi un processo inverso a quello individuato per la formulazione delle icone. In questo caso, l'intervento creativo ha ampliato un segno sintetico e particolare traducendolo in immagine complessa e spesso portatrice di significati simbolici, secondo un percorso che dal particolare conduce al generale (induzione).
Come si vede dall'esempio riportato a pagina seguente, l'icona della categoria "Sport" il risultato della sintesi di due segni iconici (il calciatore e il pallone) individuati dagli studenti per i test di riconoscibilit e ritenuti i pi esemplificativi del concetto di cui dovrebbero essere portatori. Nell'icona di Internet Senza Barriere un omino colpisce di testa un pallone unendo cos la figura umana dello sportivo al pallone, simbolo del calcio e metonimicamente dello sport.
Successivamente il lavoro creativo partito dall'icona e dai significati da essa suggeriti. Un processo induttivo ha portato dalla sintesi dell'icona all'immagine emozionale complessa, che vede un pallone emergere da un campo di erba verde non ancora "regolata" da strisce n linee di demarcazione, come a sottendere l'unione esistente tra natura e cultura, istinto di divertimento e gioco regolamentato.
Icone: dalla ricerca al design.
Esemplificazione del percorso per la categoria sport
dalle indagini iniziali al design definitivo.
Icone individuate per i test di riconoscibilit.
Elaborazione successiva, basata sui risultati dei test e sulle
esigenze di coordinamento grafico tra le icone delle diverse categorie.
Sviluppo creativo del tema Sport.
Il software del sito
Struttura
Il primo scoglio che ci siamo trovati ad affrontare stato il come organizzare il grande volume di contenuti in modo da mantenere il pi elevata possibile la possibilit di rintracciare l'informazione.
Abbiamo quindi progettato un database (nella prima fase abbiamo utilizzato ms access) il cui elemento centrale costituito dalla tabella schede. Ad ogni scheda corrispondono una categoria e pi argomenti opportunamente catalogati in apposite tabelle, nonch gli elementi accessori rappresentati dalle immagini e dai files allegati, dai linkaggi verso altre schede del sito e dai links verso l'esterno.
La scelta quindi quella di utilizzare il medesimo formato per tutte le informazioni inserite.
(schema Entit-Relazioni).
Il principale difetto della prima stesura del software gestionale del sito era il sovraffollamento di links, cosa che, data la vastit dei contenuti, non era risolubile semplicemente agendo con tagli drastici. Si quindi optato per mantenere una barra di navigazione verticale posizionata a destra, ovvero posizionata in modo da seguire e non precedere l'area dei contenuti.
Nella sua forma definitiva la pagina del sito suddivisa nel modo seguente:
testata
barra contestuale
area contenuti
barra verticale di navigazione
piede della pagina.
L'ordine degli elementi quello nel quale si presentano entro il codice html della pagina.
Testata
Contiene il logo, la barra contestuale, e i links destinati al cambio del foglio stile. La nostra scelta stata quella di utilizzare una tabella inserita in un elemento div.
La testata suddivisa in 3 righe rispettivamente destinate a ospitare:
- il logo del progetto inserito come elemento di background della cella;
- i links al cambio di foglio stile (per aumentare o diminuire la dimensione dei caratteri);
- i links alla mappa del sito e alle spiegazioni per l'utilizzo degli accesskeys di navigazione facilitata.
Tutti i links, tanto nella barra di intestazione, quanto nel resto del sito, hanno l'attributo title con il titolo della pagina collegata o con la descrizione dell'evento associato.
Si prestata attenzione a non utilizzare nei titoli dei links diciture tipo "collegamento a" o "vai a" poich queste avrebbero vanificato la possibilit di utilizzare il richiamo rapido al link ottenuto in molti browser per disabili premendo l'iniziale del collegamento.
Il cambio di stile realizzato attraverso uno script java e il cambio di foglio di stile avviene con l'attributo onclick del tag A il cui attributo href stato posto uguale a "#".
La considerazione da fare in merito la seguente: solamente i browser in grado di interpretare java sono in grado di svolgere le funzioni del cambio di stile congeniate in tal modo. Vi da attendersi che gli utenti ipovedenti, cui tale ausilio destinato, utilizzino strumenti in grado di farlo funzionare correttamente, e che siano disponibili ad accettare la scrittura dei cookies destinati a tenere memoria della loro scelta.
Quindi, seppur sia vera la regola secondo la quale lo script java tassativamente da evitare poich non interpretato dalla maggior parte degli strumenti di navigazione usati dai disabili pi gravi, altrettanto vero che per ausili alla navigazione destinati a disabili che possono utilizzare i browser pi comuni, il javascript pu risolvere una serie innumerevole di piccoli e grandi inconvenienti.
Ci che va sempre tenuto presente che un sito accessibile non utilizza solitamente java per definire i collegamenti tra le pagine.
I pro e i contro delle tabelle
Nella stesura della direttiva WCAG che ha fatto da guida durante la fase iniziale del progetto, veniva sconsigliato l'utilizzo di tabelle come elementi per la definizione del layout del documento. Veniva altres ammesso il loro utilizzo a patto che non se ne facesse abuso con ridondanti e inutili nidificazioni e soprattutto venissero utilizzati correttamente gli attributi html (quali il summary) per definirne a priori il contenuto.
La nostra scelta stata quella di utilizzare le tabelle poich:
le versioni pi datate dei browser non sono in grado di interpretare correttamente i pi evoluti comandi css che dovrebbero consentire la totale eliminazione delle tabelle dai layout;
la maggior parte degli editor html utilizzano le tabelle quali elementi di layout in modo sistematico.
Se vogliamo quindi offrire agli sviluppatori consigli utili per migliorare l'accessibilit delle loro pagine, pi che costringerli a stravolgere il loro modo di impostare e gestire il lavoro, ci parso opportuno offrire loro una serie di consigli su come migliorare quello che gi fanno.
L'utilizzo delle tabelle come elementi di layout non penalizza l'accessibilit di un sito purch vengano sempre rispettate le seguenti regole:
1. il dimensionamento delle colonne deve sempre essere in percentuale in modo da consentire alla pagina di restringersi o allargarsi in funzione della risoluzione dello schermo che la visualizza;
2. il dimensionamento delle righe, cos come l'attributo rowspan deve essere omesso poich molti browser non sono in grado di interpretarlo;
3. deve essere sempre utilizzato in modo pertinente l'attributo summary con una breve descrizione del contenuto della tabella;
4. quando una tabella utilizzata come layout non devono essere utilizzati i tag che identificano la riga e la colonna di intestazione;
5. la nidificazione di tabelle (tabelle entro tabelle) deve essere ridotta al minimo.
Corpo della pagina
destinato a contenere le informazioni, ovvero il prodotto offerto dal nostro sito.
L'area della pagina destinata al corpo, nella prima stesura del progetto, era posta alla destra della barra di navigazione verticale.
I test di accessibilit hanno rivelato come sia viceversa opportuno farla precedere all'elenco di links contenuto nella barra di navigazione. Cos nella versione finale del sito si optato per collocarla immediatamente dopo gli elementi della testata e prima della barra verticale.
Le tipologie di informazioni presentate in quest'area dello schermo sono:
- il testo della home page;
- le pagine categoria con l'elenco delle schede associate;
- le pagine scheda con testo e immagini;
- i risultati delle ricerche;
- le pagine mappa del sito e accesskeys.
Il corpo della pagina destinato a ospitare, durante la navigazione delle categorie, l'elenco delle schede associate.
Lo schema che si deciso di seguire quello del susseguirsi di insiemi e sottoinsiemi. In questo caso la categoria di primo livello ospiter tutte le schede associate a essa e a alle sue sottocategorie.
Selezionando una delle sottocategorie sulla barra di navigazione, verr ristretto il numero delle schede mostrate nell'elenco, al sottoinsieme corrispondente a quello della sottocategoria selezionata, e cos via fino al raggiungimento dell'ultimo livello valorizzato.
Per ragioni di praticit si deciso di imporre un massimo al livello di profondit dell'albero delle categorie.
Infatti, il lasciare indeterminato il massimo livello di profondit, considerata la necessit di leggere ogni volta l'elenco delle schede associate alle categorie apparentate, rendeva i tempi di esecuzione degli scripts troppo elevato.
La scheda suddivisa in tre parti principali:
l'intestazione con titolo, sottotitolo, breve sunto del contenuto ed eventualmente un'immagine significativa;
il testo;
la barra degli accessori con la galleria immagini, i links sia interni (ad altre pagine del sito) che esterni (ad altri siti), i collegamenti a documenti di testo o pdf eventualmente allegati.
Menu di navigazione
la barra di navigazione delle categorie.
La navigazione principale del sito delegata alla barra verticale posta sulla destra in ogni pagina. Anche questa strutturata in forma di tabella con due colonne per riga.
Nella prima colonna inserita l'icona corrispondente alla categoria, nella seconda inserito il nome della categoria in forma testuale.
Il link alla pagina della categoria presente solo sul testo.
Il link costruito in modo che non sia solamente l'elemento (testo) racchiuso tra i tag a essere cliccabile ma tutta la cella che lo contiene. Il risultato ottenuto agendo sul foglio di stile e imponendo un width:100% alla classe che definisce il link.
In questo modo anche gli utenti con difficolt a usare i dispositivi di puntamento (il mouse) riescono agevolmente a navigare il sito.
Quando la barra di navigazione verticale si trova a visualizzare le categorie di secondo livello, questa strutturata in modo tale da presentare il link verso la homepage nonch quello verso la categoria madre immediatamente a precedere l'elenco dei link verso le sottocategorie. Quando la categoria prescelta non possiede sottocategorie viene comunque visualizzato l'elenco delle categorie appartenenti allo stesso ramo e di medesimo livello.
Motore di ricerca interno
Immediatamente al di sotto della barra di navigazione posto il form che consente di attivare la ricerca delle informazioni all'interno del sito. E' costituito da tre elementi:
- una cella per l'inserimento del testo da cercare;
- due combobox per la selezione rispettivamente di categoria e argomento.
La cella per l'inserimento del testo prevalorizzata con la dicitura "cerca..." e ci per far s che sia esplicito in ogni browser il fatto che questa sia destinata a ospitare il testo da cercare e ci nel rispetto delle raccomandazioni della W3C cui ispirato il sito. La prevalorizzazione di tale elemento ha per determinato problemi nella navigazione del sito da parte dei non vedenti coinvolti nelle operazioni di test; infatti, questi quando posizionavano il cursore sulla cella per inserirvi il testo da cercare, non erano preavvertiti della presenza del testo e quindi digitavano la parola da cercare immediatamente prima del testo gi inserito trovandosi a ottenere dei risultati assolutamente non conformi a quanto erano convinti di cercare. Abbiamo posto rimedio all'inconveniente inserendo uno script java che cancella il contenuto delle casella di testo ogni volta che in essa viene posizionato il cursore (onfocus).
Funzioni di ricerca
La funzionalit dei sistemi di ricerca interni al sito sono fondamentali per la sua usabilit. Dalle analisi dei test di usabilit risulta che la maggior parte degli utenti tende a preferire il motore di ricerca interno alla navigazione per click. Ci rende estremamente importante uno studio accurato delle modalit di ricerca in modo tale da riuscire a fornire risultati il pi possibile coerenti con le chiavi di ricerca utilizzate e soprattutto ordinati in base a criteri che premino le pagine pi pertinenti alla ricerca eseguita.
Nella prima fase del nostro lavoro, utilizzando il database Access, abbiamo tentato una classificazione dei risultati in base alle occorrenze dei termini cercati all'interno dei campi del DB; tanto pi alto era il numero delle volte nelle quali un determinato termine ricorreva in un determinato campo, tanto pi alto era il punteggio attribuito al record trovato. Ci si potuto realizzare poich il "dialetto" SQL di MSAccess consente l'utilizzo delle funzione instr all'interno delle stringhe SQL. Cambiando database e utilizzando MSSqlServer tale sintassi non risulta pi valida. Ci viene per incontro una funzionalit tipica del server di database predisposta proprio alla valutazione del livello di similitudine tra una chiave di ricerca e i contenuti dei campi esaminati. Tale funzionalit quella dell'indicizzazione full-text.
Il limite rappresentato dall'utilizzo di questa ultima modalit sta nell'impossibilit di poter controllare da parte del programmatore le modalit di calcolo del rango dei risultati. Il vantaggio, enorme, quello di disporre di un sistema affine a quello usato dai grandi motori di ricerca che tiene conto di errori di digitazione, similitudini tra termini e in taluni casi persino dei sinonimi pi comuni delle parole cercate.
Occorre tenere comunque presente che, per quanto grande sia il sito che ci accingiamo a realizzare e conseguentemente anche le risorse tecnico-economiche disponibili, estremamente improbabile riuscire a replicare su un singolo sito le funzionalit disponibili sui grandi motori di ricerca, tant' che sono sempre di pi i siti che si appoggiano a Google, Yahoo e altri motori di ricerca per la gestione del proprio motore interno.
Per un sito, ove la dimensione economica del lavoro non giustifica un investimento cos grande come l'acquisto delle funzionalit di ricerca avanzata di un motore di ricerca, ci vengono incontro taluni tools predisposti dagli stessi motori di ricerca.
Per esempio possibile, semplicemente registrandosi e aprendo un account adsense, inserire sul sito un box di ricerca nel sito che utilizza la funzione cerca nel sito di Google.
In questo modo le ricerche verranno eseguite tra le pagine del sito presenti negli indici di Google, quindi prendendo in considerazione non tutte le pagine del sito. Il sistema quindi funziona solo quando il sito predisposto a farsi navigare e indicizzare correttamente dagli spider di Google.
Barra di chiusura
Contiene il rimando al sito http://webxact. watchfire.com/ sul quale possibile eseguire automaticamente un test di verifica dell'accessibilit.
Gli Strumenti
Codici
Nelle pagine che seguono abbiamo estrapolato alcune parti topiche sulle quali opportuno spendere qualche riga di analisi e commento.
Gli esteti rigorosi del codice di programmazione tenderanno ad arricciare il naso, noi, ribadiamo, abbiamo comunque voluto creare un sistema usabile e accessibile senza rinunciare a quegli elementi, come le tabelle, normalmente utilizzati dalla maggior parete degli sviluppatori. Quindi, rimarchiamo a un concetto pi volte espresso nei documenti di riferimento, ovvero rendere accessibile una pagina Web non significa rinunciare all'utilizzo di elementi problematici ma viceversa usare criterio e attenzione nel predisporre i layout e gli elementi delle pagine.
Inoltre, va tenuto presente che i codici html risultano da un'elaborazione asp che elabora i contenuti del database e monta al volo le pagine. Ci significa che i codici devono essere modulari, ripetibili ed espandibili secondo le esigenze specifiche di ogni pagina senza interventi puntuali di adattamento.
Codice di header
Internet senza Barriere
Nota: dichiarato il linguaggio naturale, in questo caso l'italiano. I browser vocali pi evoluti eseguono le funzioni di pronuncia in lingua basandosi su questa dichiarazione html lang="IT". Il titolo della pagina: consigliabile che non sia eccessivamente lungo pur mantenendo una buona rappresentativit dei contenuti della pagina. Soprattutto importante che le pagine del sito abbiano un titolo sempre diverso in modo da non creare confusione durante la navigazione tanto a chi utilizza browser particolari, tanto a chi utilizza browser standard senza troppa maestria. A tale proposito bene che il titolo della pagina che restituisce i risultati delle ricerche all'interno del sito corrisponda alla stringa di ricerca utilizzata. I meta tag keywords e description assumono importanza soprattutto nel dialogo tra siti e motori di ricerca.
Questi ultimi possono essere alleati importanti nel concretizzare la buona accessibilit del nostro sito, a patto che i nostri contenuti siano classificati correttamente. Quindi particolarmente opportuno definire una descrizione ed una serie di parole chiave pertinenti ad ogni pagina.
Le chiamate ai fogli di stile sono tre e corrispondono alle tre alternative offerte per la dimensione dei caratteri. Il passaggio da un foglio di stile all'altro realizzato con lo script java styleswitcher.js.
Codice testata
Codice form di ricerca
I form costituiscono l'elemento interattivo pi delicato da gestire. Speso infatti alcune funzioni di navigazione vengono delegate a tali elementi pregiudicando spesso l'accessibilit del sistema.
Una regola generale che sarebbe opportuno seguire sempre quella di non delegare mai la scelta di un link di destinazione ad elenhi combo. Quando fosse assolutamente necessario passare attraverso questo strumento tassativamente da evitare l'utilizzo di comandi java come onchange o onselect in grado di eseguire in automatico l'invio del form, poich questi renderebbero assolutamente impossibile il loro utilizzo a chi non fosse in grado di vederli e fosse costretto a far scorrere il cursore attraverso la combo leggendone il contenuto riga per riga.
Come si nota scorrendo il codice del form di ricerca, ogni elemento definito con un proprio label al quale corrisponde una id. Questo sistema rende pi facilmente comprensibili i form ai browser speciali.
Poich le guide sull'accessibilit impongono una prevalorizzazione dei campi testo dei form, e poich alcuni browser per non vedenti producono errori nel momento in cui il cursore viene posizionato all'interno della casella di testo, si optato per l'utilizzo di un codice java (onfocus="if(this.value= ='cerca ...')this.value='';") in grado di azzerare il contenuto della cella quando uguale alla stringa prevalorizzata, nel nostro caso "cerca ...".
Codice menu verticale categorie