1 università degli studi di napoli federico ii corso di laurea in ingegneria delle...

15
1 Università degli studi di Napoli “Federico II” Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di Laurea in Reti di Calcolatori Metodologie e tecnologie per la verifica di accessibilità ai disabili di sistemi web Relatore Candidato Ch.mo Prof. Giorgio Ventre Adamo Liberto Matr. 039/1087 Anno Accademico 2002/2003

Upload: carlotta-tedesco

Post on 01-May-2015

216 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

1

Università degli studi di Napoli

“Federico II”Corso di Laurea in

Ingegneria delle Telecomunicazioni

Dipartimento di Informatica e Sistemistica

Tesi di Laurea in Reti di Calcolatori

Metodologie e tecnologie per la verifica

di accessibilità ai disabili di sistemi web

Relatore Candidato

Ch.mo Prof. Giorgio Ventre Adamo LibertoMatr. 039/1087

Anno Accademico 2002/2003

Page 2: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

2

Società dell’informazione

Accessibilità Web e progetto WAI

Contesto

Web Content Accessibility Guidelines

Authoring Tools Accessibility Guidelines

User Agent Accessibility Guidelines

“Content is accessible when it may be used by someone with disability” (Glossario WAI)

WCAG 1.0 14 Guidelines 65 Checkpoint Priority 1

Priority 2

Priority 3

Page 3: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

3

Obiettivi: metodologie per la verifica di accessibilità

• ISO 9241-11

L’usabilità è l’efficacia, l’efficienza e la soddisfazione con cui specifici utenti raggiungono specifici obiettivi in particolari ambienti

• ISO TS 16071

• Normatività WAI

• User Test, User Target

ACCESSIBILITY USER USABILITY

Accessibilità

Usabilità

L’accessibilità è l’usabilità di un prodotto, servizio, strumenti per persone con il più ampio raggio di capacità

Page 4: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

4

Tecnologie Assistive

Software Screen reader

Browser vocali

Magnificatori

Browser testuali

Hardware Tavolette Braille

Tastiere alternative

Puntatori

Disabilità sensoriali (vista, udito) La vista è il senso più coinvolto sul Web

Udito per contenuti multimediali sonori. Ma non solo

Disabilità motorie Principali dispositivi di input: mouse, tastiera

Disabilità cognitive Contenuti semplici, chiari, organizzati e navigabili

Dimensione del problema

Page 5: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

5

Barriere di accessibilità di Screen Reader e Browser vocali

HTML, XML, Java, CSS altro

codice

Broswer+

Screen Reader

Output: sintesi vocali

braille

Home Page reader 3.02

Jaws 3.5, 4.02, 4.5

Windows Eyes

65 Checkpoint for WCAG 1.0 29 Checkpoint for Screen Reader e Vocal Browser

Controllo elementi strutturali

Corrispettivi di testo

Accesso tramite tastiera

Navigazione delle tabelle

Navigazione dei frame

Navigazione dei form

Page 6: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

6

Barriere di accessibilità dei Browser

Sistema operativo/Screen ReaderBrowser

Contenuto del Web

Supporto dei Browser all’Html accessibile

“Best viewed with every Browser”

X “Best viewed with xxx Browser”

Personalizzazione

Layout liquido

Separare il contenuto dalla presentazione

Fogli di stile (CSS) e tabelle a confronto

• Files più leggeri da interpretare dal Browser

• Codice Html semplice, pulito e privo di ridondanze

• Possibilità di cambiare l’aspetto del sito modificando solo un file

• Maggiore coerenza grafica tra le pagine

Page 7: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

7

Limite nel supporto ai CSS

Ipovedenti

Tritanopia

Protanopia

Non vedente

Testo bianco su sfondo nero

Confonde il giallo con il blu

Confonde il rosso con il verde

Screen Reader (Media“Aural”)

Soluzione lato Client

Soluzione lato Server

Javascript

ASP, PHP, JSP

Personalizzazione: Limite nel supporto ai CSS Media “Aural”

Media “Braille”

Media “Handheld”

Selezione della

presentazione

tramite CSS

E . T .

Caso di studio su Form con CSS

Page 8: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

8

Metodologie per progettare siti accessibili

Accessible site Parallel site

Restyling an existing site

Starting from an accessible site

WCAG 1.0 Capacità di trasformazione del Browser

Orientamento, navigazione e comprensione

<img SRC=“eclissisole.jpg” ALT=“Eclissi totale di sole” >

<img SRC= “eclissisole.jpg”ALT = “Evidente difformità della corona solare durante una eclissi totale”.>

<img SRC=“eclissisole.jpg” ALT= “Informazioni dettagliate sul Sole”ecc.>

X <img SRC=“messico.jpg” ALT=“composizione gruppi etnici”>

<img SRC=“messico.jpg” ALT=“composizione gruppi etnici: meticci 56%, nativi americani 29%, europei 15%”>

Page 9: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

9

Barriere di accessibilità dei contenuti

• www.trenitalia.it

• www.repubblica.it

• www.radiorai.it

Plug in, frame, pop-up, javascript

Alt text, frame, difficoltà di navigazione, refresh automatico

Plug in, diversa organizzazione delle pagine

Verifica sperimentale di accessibilità ai non vedenti

Page 10: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

10

Laboratorio per la verifica di accessibilità

web server (Apache,IIS )

DB server

Lan Privata

Lan Pubblica

PDA, Notebook

GPRS,UMTS

Client 2

Wifi

Access point

Client 1

Client 3

Client n

Firewall

PSTN

WEBISDN

XDSL

NAT

Access Server

Validatori sintassi Html, CSS, XML

Vari validatori di accessibilità

Molteplici Browser

Tecnologie assistive• Vari screen reader

• Barra Braille

• Software ingrandienti

• Tastiere espanse, rimpicciolite, copritastiere etc.

Varie velocità di connessione POTS, ISDN, XDSL

Vari E.T. (Pc con differenti configurazioni hardware e software, PDA, WiFi, UMTS, GPRS)

Sito accessibile Ieri

Oggi

Domani

Page 11: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

11

La Validazione e la Verifica

Precondizione per l’accessibilità

Strumenti di validazione

Limiti dei validatori automatici

Bollini e loghi La validazione non è completamente automatizzabile

Minimizza il problema

Non comprensibile per tutti gli utenti

Istantanea della situazione attuale

Soluzione Dichiarazione di quali e quanti controlli di revisione umana

Usare loghi W3C corretti

Inserire gli sforzi fatti per l’accessibilità

Page 12: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

12

Passi del processo di verificaInizio

Lista dei punti di controllo di priorità 1di WCAG 1.0

PROCESSO DI VERIFICA

Esito analisi statica positivo?

Richiesta di adeguamenti tecnici

Adeguamenti tecnici effettuati?

W3C Markup Validation Service

CSS Validator

Vari validatori d’accessibilità

Esito validazione automatica positivo?

Richiesta di adeguamenti tecnici

Adeguamenti tecnici effettuati?

Servizio di test completo?

Sessione di test con un team di disabili

Sessione di test con un team di esperti

Esito analisi dinamica positivo? Richiesta adeguamenti tecnici

Adeguamenti tecnici effettuati?

Emissione del rapporto di prova

Fine

Richiesta di verifica dell’accessibilità

Analisi Statica

Analisi Dinamica

S

S

S

S

S

S

Metodologia di verifica sperimentale di accessibilità

Composizione gruppo di tester

1. Competenze di utenti disabili non simulabili nell’uso di tecnologie assistive

2. Impossibilità di simulare bagaglio culturale o problemi cognitivi

Seguire un percorso di navigazione

• Ricerca informazioni tramite navigazione

• Ricerca informazioni tramite motore di ricerca

• Esecuzione di operazioni per applicazioni interattive in rete

Page 13: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

13

Metodologia di analisi quantitativa

Intervallo di valori

Campione da utilizzare (ridotto o esteso)

Metodo di analisi (analisi del codice o ispezione visiva)

Tipo di valutazione (soggettiva o oggettiva)

Due intervalli di valori 1, 2 o n.v. • 1 se il requisito non è soddisfatto

• 2 se il requisito è soddisfatto

1, 2, 3, 4 o n.v. • 1 se la pagina è inutilizzabile

• 2 se c’è una grossa perdita di informazioni

• 3 se c’è limitata perdita di informazioni

• 4 se la specifica è applicata correttamente

• WCAG 1.0 di difficile implementazione, 29 verifiche: • Tecnologie accessibili (script, applet, plug-in, CSS)

• Accessibilità di form e tabelle

• Barriere sensoriali (colori, caratteri)

• Meccanismi di navigazione e organizzazione delle informazioni

Monitorare l’accessibilità di 77 siti della P.A.

Page 14: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

14

Esempi di verifica

Immagine latrice di informazioni• Grandezza: 4 valori + n.v.

• Campione: Esteso

• Tipo di valutazione: Soggettiva

• Metodo di analisi: Ispezione visiva e codice Html

1. Immagini non commentate e non presenti descrizioni supplementari per immagini ad alto contenuto informativo

2. Immagini utili, parzialmente o non commentate, o non presenti descrizioni supplementari per immagini ad alto contenuto informativo

3. Ben commentate tutte le immagini utili e presenti descrizioni supplementari per immagini ad alto contenuto informativo

4. Tutte le immagini sono ben commentate (utili e non) e presenti descrizioni supplementari per immagini ad alto contenuto informativo

Solo 13 siti sono accessibili, 64 non commentano per niente o non a sufficienza le immagini.

Barriere sensoriali

Analisi pop-up Windows

Tecnologie accessibili

• Grandezza: 2 valori + n.v.

• Campione: ridotto

• Tipo di valutazione: oggettiva

• Metodo di analisi: ispezione visiva

1. Presenti pop-up Windows senza che l’utente ne sia avvertito

2. Presenti pop-up di Windows e l’utente non ne è avvertito

Page 15: 1 Università degli studi di Napoli Federico II Corso di Laurea in Ingegneria delle Telecomunicazioni Dipartimento di Informatica e Sistemistica Tesi di

15

Conclusioni e prospettive future

punteggi

0

10

20

30

40

50

60

70

80

90

100

1 7 13 19 25 31 37 43 49 55 61 67 73

siti

Stato dell’arte della P.A. prima della Legge Stanca

• Miglior sito, 66

• Peggior sito, 28

• Media siti, 43

Solo 19 siti superano il punteggio 50

La situazione non è confortante• Troppa grafica d’effetto, il rivestimento non deve pregiudicare la fruizione

• Pochi servizi reali

• Due siti di P.A. si dichiaravano con loghi dei validatori accessibili, ma non lo sono risultati

Appare interessante ripetere l’analisi una volta in vigore il decreto

Futuro dell’accessibilità: chiave strategica per l’evoluzione del Web

• Un contenuto, più presentazioni

• In molti posti, differenti applicazioni e piattaforme