Architetture e normative dei siti web per enti culturali · Architetture e normative dei siti web...

95
Architetture e normative dei siti web per enti culturali dott.ssa Damiana Luzzi

Transcript of Architetture e normative dei siti web per enti culturali · Architetture e normative dei siti web...

Architetture e normative dei siti web

per enti culturali

dott.ssa Damiana Luzzi

2

Sommario

  Sito Web e profili professionali

  Accessibilità   W3C: WAI e WCAG 2.0   Unione Europea   In Italia

  Usabilità (“cenni”)

  Valutazione e Validazione

  Enti culturali

  Architettura dell’Informazione

  Esempi

  Riferimenti bibliografici

Damiana Luzzi: [email protected]

3

Ingredienti di un sito web

Damiana Luzzi: [email protected]

+ + +

Architettura delle

informazioni e navigazione

Design delle pagine

Contenuti Interazione

4

I profili professionali: macroaree e attività

Damiana Luzzi: [email protected]

IDEAZIONE

PROGETTAZIONE

RELIZZAZIONE

MARKETING

nascita dell’idea

formalizzazione del progetto

definizione dello scopo

analisi di mercato

marketing puro

progettazione strategica

(comunicazione e marketing)

pianificazione dei tempi

definizione del personale necessario

progettazione tecnica

SEO

SEM testing e valutazioni

sviluppo

pubblicazione (sistema tecnico

e contenuti) produzione di contenuti

http://www.skillprofiles.eu/stable/profili_professionali_web_stable.pdf

IWA Italy Web Skill Profile, 2010

RELIZZAZIONE

PROGETTAZIONE

IDEAZIONE

MARKETING

5

Dal webmaster tutto fare… ai nuovi profili professionali

Damiana Luzzi: [email protected]

1. Web Project Manager

2. Account

3. Market Research Analyst

4. User Experience Design

5. Functional Analyst

6. DB Administrator 7. Search Engine Optimizator

8. Search Engine Marketer

9. Community Manager

10. Advertising Manager 11. Front-end Web Developer

12. Server Side Web Developer 13. Web Content Manager

14. Web Content Editor

15.Web Server Administrator

16. Creative Information Architect

17. Digital Strategic Planner

6

1. Web Project Manager

Damiana Luzzi: [email protected]

7

5. Functional Analyst

Damiana Luzzi: [email protected]

8

8. Search Engine Marketer

Damiana Luzzi: [email protected]

9

9. Community Manager

Damiana Luzzi: [email protected]

10

13. Web Content Manager

Damiana Luzzi: [email protected]

11

14. Web Content Editor

Damiana Luzzi: [email protected]

12

14. Creative Information Architect

Damiana Luzzi: [email protected]

13

17. Digital Strategic Planner

Damiana Luzzi: [email protected]

Accessibilità

15

Il termine

Damiana Luzzi: [email protected]

accessibile un concetto comprensibile

16

L’Accessibilità in informatica

“La capacità dei sistemi informatici, nelle forma e nei limiti consentiti dalle conoscenze tecnologiche, di erogare e fornire informazioni fruibili, senza discriminazioni, anche da parte di coloro che a causa di disabilità necessitano di tecnologie assistive” [Legge 4/2004 – Art. 2]

È la capacità di un dispositivo, di un servizio o di una risorsa essere fruibile con facilità da una qualsiasi tipologia d'utente.

Il termine è comunemente associato alla possibilità anche per persone con ridotta o impedita capacità sensoriale, motoria, o psichica (ovvero affette da disabilità sia temporanea, sia stabile), di fruire dei sistemi informatici e delle risorse software a disposizione.

Damiana Luzzi: [email protected]

17

Sito web accessibile = maggiore fruibilità per tutti!

Damiana Luzzi: [email protected]

Spesso si da per scontato che il sito web sia visualizzato e navigato unicamente attraverso il “classico” computer fornito di mouse, tastiera e monitor, ma non sempre è così.

Un sito web può essere consultato anche da chi utilizza:

  dispositivi mobili (smartphone, tablet pc, ecc.), talvolta con schermi piccoli

  una connessione di rete lenta

  sistemi operativi e browser non di ultima generazione

  tecnologie assistive

18

Le tecnologie assistive

“Gli strumenti e le soluzioni tecniche, hardware e sofware, che permettono alla persona disabile, superando o riducendo le condizioni di svantaggio di accedere alle informazioni e ai servizi erogati dai sistemi informatici.” [Legge 4/2004 – Art. 2]

Risorse on line:

EASTIN <http://www.eastin.info> FORTEC <http://www.is.tuwien.ac.at> REHADAT <http://www.rehadat.de> INCLUSIVE Tecnologies <http://inclusive.com>

Damiana Luzzi: [email protected]

19

Accessibilità per …

non vedenti:   software che “legga” qualsiasi informazione

  tutte le informazioni devono venire fornite anche in forma testuale “leggibile” dalle tecnologie assistive (es: screen reader)

  identificazione chiara delle funzionalità presenti nella pagina con lettura in modo ordinato (es. form)

  possibilità di identificare i blocchi di informazione per scegliere se “leggerli”

Damiana Luzzi: [email protected]

chi ha problemi di vista:   poter ingrandire i caratteri e un adeguato contrasto tra testo e sfondo sono di

supporto agli ipovedenti

  ottenere informazioni e interagire con esse senza che siano identificate da un determinato colore è di supporto a chi ha disabilità visive legate alla percezione dei colori (es. daltonici, ecc.)

  possibilità di ingrandire aree dello schermo e/o di scegliere un’impostazione ad alto contrasto

20

Accessibilità per …

chi non sente: •  funzionalità che consentano di fruire in modo visivo delle informazioni fornite

tramite audio (es. avvisi di errore, ecc.)

•  utilizzare formati per la visualizzazione di video e animazioni con sottotitoli

Damiana Luzzi: [email protected]

chi ha disabilità motorie: • funzionalità che consentano di interagire con il Web senza l’uso di mouse e/o periferiche di puntamento

• possibilità di attivare le combinazioni di tasti in modo differenziato (sticky keys)

• necessità che le aree cliccabili della pagina web siano sufficientemente distanziate l’una dall’altra

chi ha disabilità cognitive: •  ogni disabilità cognitiva necessita di soluzioni specifiche (hardware e/o software

•  garantire una comprensione delle interfacce mantenendo l’uso di comandi e istruzioni conosciuti dall’utente, ereditando quindi le interfacce dell’ambiente operativo.)

21

L’Accessibilità per tutti al 100%

E’ pura teoria

Lo scopo ragionevole sarà quello di garantire il maggior livello di fruibilità al maggior numero possibile di utenti.

Damiana Luzzi: [email protected]

22

L’Accessibilità in informatica riguarda:

Hardware: accessibilità delle periferiche

Sistemi operativi e applicazioni software: accessibilità delle interfacce e dei controlli di navigazione

Web: accessibilità dei contenuti, dei programmi di navigazione (browser), dei programmi di sviluppo (authoring)

Damiana Luzzi: [email protected]

23

L’Accessibilità del Web: raccomandazioni, standard e norme

Raccomandazioni WCAG (1.0 e 2.0) [Web Content Accessibility Guidelines] ATAG (1.0 e 2.0) [Authoring Tools Accessibility Guidelines] UAAG 1.0 [User Agent Accessibility Guidelines] ARIA [Accessible Rich Internet Applications]

Standard ISO 9241-151 (web user interface) ISO 9241-171 (software accessibility)

Normativa italiana Legge 04/2004 DPR 75/2005 DM 8 luglio 2005

Damiana Luzzi: [email protected]

Accessibilità

W3C: WAI e WCAG 2.0

25

W3C e WAI

Damiana Luzzi: [email protected]

Consorzio di aziende ed associazioni che sviluppa tecnologie per garantire l’interoperabilità (specifiche, linee guida, raccomandazioni, software, e applicazioni) per guidare il WWW fino al massimo del suo potenziale. <http://www.w3.org>

Motto del W3C: “Guidare il World Wide Web fino al massimo del suo potenziale”.

Progetto, all’interno del W3C, dedicato all’accessibilità. <http://www.w3.org/WAI>

Motto della WAI: “La forza del Web sta nella sua universalità. L’accesso da parte di chiunque, indipendentemente dalle disabilità, ne è un aspetto essenziale.” (Tim Berners-Lee)

26

WAI: linee guida, linguaggi e documenti tecnici

Damiana Luzzi: [email protected]

WAI

WCAG (Web Content Accessibility Guidelines): linee guida per produrre contenuti Web accessibili. WCAG 1.0: 1999, accessibilità dei contenuti HTML WCAG 2.0: 2008, più generale, accessibilità dei contenuti Web

ATAG (Authoring Tools Accessibility Guidelines): linee guida per produrre strumenti di pubblicazione (editor, CMS, ecc.) che generino contenuti accessibili (si rivolge agli sviluppatori). ATAG 1.0: 2000, periodo in cui non vi era ancora larga diffusione dei prodotti Web-based

UAAG (User Agent Accessibility Guidelines): linee guida per l’accessibilità dei programmi utente (browser, media player, tecnologie assistive e altri programmi di navigazione) (si rivolge ai produttori). UAAG 1.0: 2002. UAAG 2.0: in fase di sviluppo, nonostante l’evolversi di nuove tecnologie legate alle RIA (Rich Internet Applications)

EARL (Evaluation and Report Language): linguaggio per rappresentare il risultato dei test di verifica dell’accessibilità in modo indipendente rispetto agli strumenti di verifica che producono report in formati proprietari.

ARIA (Accessible Rich Internet Applications): suite di documenti tecnici per generare applicazioni e contenuti Web dinamici accessibili. (Candidate Recommendation: 18 gennaio 2011)

27

WAI: organizzazione

Damiana Luzzi: [email protected]

28

WCAG 2.0: come sono organizzate

Damiana Luzzi: [email protected]

29

WCAG 2.0: documenti di supporto

Damiana Luzzi: [email protected]

30

WCAG 2.0: tre definizioni importanti

Damiana Luzzi: [email protected]

Pagina Web Nelle WCAG 2.0 questo termine non si limita alle pagine HTML: ingloba qualsiasi risorsa raggiungibile tramite un URI. Ad esempio, il termine “pagina Web” può contenere anche un filmato interattivo.

Determinati tramite programmazione (Programmatically Determinated) Diversi criteri di successo richiedono che il contenuto (o alcuni aspetti di esso) possa essere "determinato tramite programmazione". Ciò significa che il contenuto è espresso in modo tale che i programmi utente, tra cui le tecnologie assistive, sono in grado di estrarre e presentare le informazioni agli utenti in diverse modalità.

Tecnologia che supporta l’accessibilità (Accessibility Supported) Si tratta di una tecnologia (HTML,CSS, ecc.) in grado di essere interpretata sia dalle caratteristiche di accessibilità previste nei browser che dalle tecnologie assistive. Solo le tecnologie “Accessibility Supported” possono essere utilizzate per raggiungere la conformità ai criteri di successo mentre le tecnologie non conformi (esempio: non utilizzabili con tecnologie assistive), possono comunque essere utilizzate anche se…

31

WCAG 2.0: Linee guida e criteri di successo

Ogni principio contiene delle linee guida il cui scopo è quello di aiutare a rispettare il principio stesso.

Uno dei principali obiettivi delle linee guida è quello di garantire che il contenuto sia direttamente accessibile al maggior numero di persone possibili e che sia in grado di essere rappresentato in forme diverse per soddisfare le diverse necessità sensoriali, fisiche e capacità cognitive.

All’interno di ogni linea guida sono presenti dei criteri di successo (success criteria) che descrivono in modo specifico che cosa sia necessario implementare per essere conformi a questa indicazione tecnica. I criteri di successo sono simili ai punti di controllo (checkpoint) presenti nelle WCAG 1.0. Le caratteristiche dei criteri di successo sono:

  conformità (un contenuto Web può essere conforme o meno)

  verificabilità (un contenuto Web può essere verificato in modalità automatizzata, con il parziale o totale ausilio di un utente)

  indipendenza (applicabili indipendentemente

Damiana Luzzi: [email protected]

32

WCAG 2.0: criteri di successo e livelli di conformità

  Ogni criterio di successo contiene un livello di conformità:

  Livello “A” (A). Per essere conforme al livello minimo “A”, un contenuto Web deve essere conforme a tutti i criteri di successo di livello “A” delle WCAG 2.0 oppure, deve fornire un contenuto alternativo conforme al livello “A” (che dovrà contenere le medesime informazioni e funzionalità, aggiornato come il contenuto non conforme e che sia raggiungibile senza difficoltà).

  Livello “Doppia A” (AA). Per essere conforme al livello “Doppia A”, un contenuto Web deve essere conforme a tutti i criteri di successo di livello “A” e di livello “Doppia A” delle WCAG 2.0 oppure deve fornire un contenuto alternativo conforme al livello “Doppia A” (che dovrà racchiudere le medesime informazioni e funzionalità, aggiornato come il contenuto non conforme e che sia raggiungibile senza difficoltà).

  Livello “Tripla A” (AAA). Per essere conforme al livello “Tripla A”, un contenuto Web deve essere conforme a tutti i criteri di successo di livello “A” , di livello “Doppia A” e di livello “Tripla A” delle WCAG 2.0 oppure deve fornire un contenuto alternativo conforme al livello “Tripla A” (che dovrà racchiudere le medesime informazioni e funzionalità, aggiornato come il contenuto non conforme e che sia raggiungibile senza difficoltà).

ed inoltre:   un collegamento alle tecniche sufficienti (a raggiungere la conformità al criterio di

successo) e consigliate (per incrementare l’accessibilità rispetto al criterio di successo).   collegamenti alla descrizione delle motivazioni di implementazione del criterio di successo,

inclusi benefici ed esempi.

Damiana Luzzi: [email protected]

33

WCAG 2.0: 4 principi

Damiana Luzzi: [email protected]

WCAG 2.0

2. Utilizzabile

4. Robusto

1. Percepibile

3. Comprensibile

34

WCAG 2.0: 1. Percepibile

Damiana Luzzi: [email protected]

Requisito 1 - Alternative testuali Fornire alternative testuali per qualsiasi contenuto non di testo in modo che lo stesso contenuto possa essere trasformato in altre forme fruibili secondo le necessità

Requisito 2 - Contenuti audio, contenuti video, animazioni Fornire alternative testuali equivalenti per le informazioni veicolate da formati audio, formati video, formati contenenti immagini animate (animazioni), formati multisensoriali in genere

Requisito 3 - Adattabile Creare contenuti che possano essere rappresentati in modalità differenti (ad esempio, con layout più semplici), senza perdita di informazioni o struttura

Requisito 4 - Distinguibile Rendere più semplice agli utenti la visione e l'ascolto dei contenuti, separando i contenuti in primo piano dallo sfondo

Le informazioni e i componenti dell'interfaccia utente devono essere presentati in modo che possano essere fruiti attraverso differenti canali sensoriali

35

WCAG 2.0: 2. Utilizzabile

Damiana Luzzi: [email protected]

Requisito 5 - Accessibile da tastiera Rendere disponibili tutte le funzionalità anche tramite tastiera

Requisito 6 - Adeguata disponibilità di tempo Fornire all'utente tempo sufficiente per leggere ed utilizzare i contenuti

Requisito 7 - Crisi epilettiche Non sviluppare contenuti che possano causare crisi epilettiche

Requisito 8 - Navigabile Fornire all'utente funzionalità di supporto per navigare, trovare contenuti e determinare la propria posizione nel sito e nelle pagine

I componenti dell’interfaccia utente e i comandi in essa contenuti devono essere utilizzabili senza ingiustificati disagi o vincoli per l’utente

36

WCAG 2.0: 3. Comprensibile

Damiana Luzzi: [email protected]

Requisito 9 - Leggibile Rendere leggibile e comprensibile il contenuto testuale

Requisito 10 - Prevedibile Creare pagine Web che appaiano e che si comportino in maniera prevedibile

Requisito 11 - Assistenza nell'inserimento di dati e informazioni Aiutare l'utente ad evitare gli errori ed agevolarlo nella loro correzione

Gli utenti devono poter comprendere le modalità di funzionamento dell’interfaccia e le azioni in essa contenute necessarie per ottenere servizi e informazioni

37

WCAG 2.0: 4. Robusto

Damiana Luzzi: [email protected]

Requisito 12 - Compatibile Garantire la massima compatibilità con i programmi utente e con le tecnologie assistive

Il contenuto deve essere abbastanza robusto da poter essere interpretato in modo affidabile da una vasta gamma di programmi utilizzati dall’utente, comprese le tecnologie assistive

Accessibilità

Unione Europea

39

2002: Piano d’azione eEurope (raccomanda di adottare gli orientamenti della WAI soprattutto in riferimento ai siti Web pubblici)

2005: Piano d’azione eEurope (riprende la raccomandazione di adottare e considerare le WCAG 1.0 della WAI uno standard de facto per l’accessibilità dei siti Web) <http://ec.europa.eu/information_society/activities/einclusion/policy/accessibility/com_2008/index_en.htm>

2008: COM (2008) 804: Comunicazione della Commissione al Parlamento Europeo, al Consiglio, al Comitato Economico e Sociale e al Comitato delle Regioni

Verso una società dell’informazione accessibile Gli Organi Europei di Normalizzazione (OEN) dovranno rapidamente adottare norme europee in materia, a seguito della creazione di orientamenti aggiornati in materia del Web (WCAG 2.0) da parte del W3C. Gli Stati membri dovranno lavorare più intensamente per rendere i siti Web pubblici accessibili e prepararsi tutti assieme alla rapida adozione delle norme europee in materia di accessibilità dei siti Web. La Commissione terrà sotto controllo, renderà pubblici i progressi compiuti e potrà dare seguito successivamente a questa politica con opportune iniziative legislative.

<http://ec.europa.eu/information_society/activities/einclusion/policy/accessibility/com_2008/index_en.htm>

Damiana Luzzi: [email protected]

L’Unione Europea

40 Damiana Luzzi: [email protected]

L’Unione Europea e l’aggiornamento alle WCAG 2.0

Conclusioni del Consiglio sulla “Società dell’informazione accessibile”:

“7. Invites the Member States to… adopt, and better implement measures, to promote e-accessibility and particularly to implement the WCAG 2.0 guidelines. A common approach could be expressed through a Recommendation from the Commission in order to avoid a fragmented European Market.

Moreover, as WGAG 1.0 is becoming outdated a recommendation from the Commission could avoid that some Member states still apply different certification standards than recommended by the W3C”.

<http://www.consilium.europa.eu/uedocs/cms_data/docs/pressdata/en/trans/107014.pdf>

Accessibilità

in Italia

42

Normative in Italia

2004: Legge 4/2004 Disposizione per favorire l’accesso dei soggetti disabili agli strumenti informatici (Legge n.4 del 09/01/2004, pubblicata nella G.U. il 17/01/2004) <http://www.pubbliaccesso.gov.it/normative/legge_20040109_n4.htm>

2005: DPR 75/2005, Regolamento di attuazione della legge 4/2004 per favorire l’accesso dei soggetti disabili agli strumenti informatici

<http://www.pubbliaccesso.it/normative/regolamento.htm>

DM sui Requisiti tecnici e i diversi livelli per l’accessibilità agli strumenti informatici (08/07/2005, pubblicato in G.U. 08/08/2005),

<http://www.pubbliaccesso.it/normative/DM080705.htm>

Direttiva per la qualità dei servizi on line e la misurazione della soddisfazioni degli utenti (27/07/2005, pubblicata nella G.U. il 18/10/2005)

<http://archivio.cnipa.gov.it/site/_files/dw_Direttiva%20MIT%20del%2027%20luglio%202005_c.pdf

2008: DM Regole tecniche disciplinanti l’accessibilità agli strumenti didattici e formativi a favore degli alunni disabili (30/04/2008, pubblicata nella G.U. il 12/06/2008) <http://www.pubbliaccesso.gov.it/normative/DM300408.htm>

Damiana Luzzi: [email protected]

43

Legge 9 gennaio 2004 n. 4 in materia di accessibilità

Basata su:

 quanto indicato nelle Linee Guida del W3C ed in particolare a quelle del progetto WAI

 Section 508 del Rehabilitation Act degli USA, emanata il 21 dicembre 2000 dalla US Access Board per l’accessibilità dei siti Web delle amministrazioni pubbliche statunitensi rappresenta uno dei primi esempi di normativa sull’accessibilità a livello nazionale.

 standard e specifiche tecniche dall’ISO (International Organizzation for Standardization)

 esperienze acquisite nell’ambito della Pubblica Amministrazione

Ha contribuito alla stesura l’IWA-Italy

Damiana Luzzi: [email protected]

44

Legge 9 gennaio 2004 n. 4

Testo della Legge, Disposizioni per favorire l’accesso dei soggetti disabili agli strumenti informatici (12 articoli) (entrato in vigore dopo la pubblicazione dei due Decreti previsti nella Legge stessa: Art. 10)

  tutti i siti internet che saranno realizzati o rinnovati, in futuro dalle pubbliche amministrazioni dovranno rispettare i requisiti di accessibilità

  negli acquisti di prodotti informati (hardware e software) da parte delle pubbliche amministrazioni l’accessibilità diventa titolo preferenziale

  per i privati il provvedimento non genera obbligo di accessibilità per i siti internet, ma è fattore di stimolo a promuovere l’accessibilità dei loro siti

  tutti i libri di testo delle scuole, ove possibile, saranno resi disponibili in formati leggibili al computer da non vedenti o ipovedenti o con altre disabilità

DPR 75/2005, Regolamento di attuazione della legge 4/2004per favorire l’accesso dei soggetti disabili agli strumenti informatici (9 articoli)

  i criteri e i principi operativi e organizzativi generali per l’accessibilità   i contenuti di cui all’art. 6 comma 2 legge 4/2004

o  le modalità con cui può essere richiesta la valutazione o  i criteri per la eventuale partecipazione del richiedente ai costi dell’operazione o  il marchio o logo con cui è reso manifesto il possesso del requisito stesso

  i controlli esercitabili sugli operatori privati che hanno reso nota l’accessibilità dei propri siti e delle proprie applicazioni informatiche

DM 8 luglio 2005, Requisiti tecnici e i diversi livelli per l’accessibilità agli strumenti informatici (8 articoli e 6 allegati)

  le linee guida recanti i requisiti tecnici e i diversi livelli per l’accessibilità   le metodologie tecniche per la verifica dell’accessibilità dei siti Internet, nonché programmi di

valutazione assistita utilizzabili a tale fine

Damiana Luzzi: [email protected]

45

DM 8 luglio 2005: Allegati

Il DM ha 6 allegati, i primi due (A e B) si riferiscono all’accessibilità dei siti Web:

  Allegato A indica la verifica tecnica e i requisiti di accessibilità delle applicazioni basate su tecnologie Internet. 22 Requisiti tecnici <http://www.pubbliaccesso.it/biblioteca/manualistica/Scano-Cap4.htm>

  Allegato B espone la metodologia e i criteri di valutazione per la verifica dell’accessibilità e delle applicazioni basate su tecnologie internet

Damiana Luzzi: [email protected]

46

Aggiornamento normativo in Italia: novità

Rottamare per migliorare [Direttiva n. 8/2009 (riduzione siti Web delle PA)]

Introduce l’obbligo per le PA di rendere identificabili i propri siti istituzionali, eliminando gli innumerevoli siti registrati, attivati e non più aggiornati affinché non siano raggiungibili dagli utenti né direttamente né tramite i motori di ricerca.

Damiana Luzzi: [email protected]

Monitoraggio dei siti pubblici per valutare periodicamente l’utilizzo e l’efficienza dei servizi, la loro qualità.

Accessibile è uno strumento a disposizione dei cittadini per migliorare la qualità dei siti pubblici e segnalare i siti da rottamare. www.accessibile.gov.it

47

Aggiornamento normativo in Italia: novità

Linee Guida per i siti Web pubblici: versione preliminare maggio 2011

Damiana Luzzi: [email protected]

http://blog.iwa.it/disegni-di-legge/pubblicate-le-linee-guida-per-i-siti-web-pubblici-2011/

http://www.innovazionepa.gov.it/lazione-del-ministro/linee-guida-siti-web-pa/indice/indice-dettagliato-linee-guida.aspx

48

Aggiornamento normativo in Italia: novità

10 giugno 2010: Bozza Nuovi requisiti e punti di controllo per l’accessibilità Web. (Aggiornamento DM 8 luglio 2005) <http://www.accessibile.gov.it/accessibilita/bozza-nuovi-requisiti-e-punti-di-controllo-per-accessibilita-web/>

Recepisce le WCAG 2.0

Come riferimento è stata acquisita la traduzione ufficiale in lingua italiana delle WCAG 2.0 <http://www.w3.org/Translations/WCAG20-it/>

Damiana Luzzi: [email protected]

Usabilità

(“cenni”)

50

Caratteristiche di un prodotto usabile

Damiana Luzzi: [email protected]

I siti web della PA devono contenere informazioni e servizi facilmente utilizzabili da tutti, qualsiasi sia la loro competenza informatica o abilità fisica

Per essere usabile un sito deve:

 essere adeguato alle necessità e alle aspettative di specifici utenti che lo utilizzano in specifici contesti d'uso

 essere facile da capire, da imparare, da usare ed essere gradevole

 consentire di eseguire le specifiche attività lavorative in maniera corretta, veloce e con soddisfazione

 generare pochi errori non critici

51

Principi di usabilità

Damiana Luzzi: [email protected]

Percezione informazioni e comandi necessari per l’esecuzione dell’attività devono essere sempre disponibili e percettibili

Comprensibilità informazioni e comandi necessari per l’esecuzione delle attività devono essere facili da capire e da usare

Operabilità informazioni e comandi devono consentire una scelta immediata della azione adeguata per raggiungere l’obiettivo voluto

Coerenza simboli, messaggi e azioni devono avere lo stesso significato in tutto l’ambiente

Salvaguardia della salute

l’ambiente deve possedere caratteristiche idonee a salvaguardare il benessere psicofisico dell’utente

Sicurezza l’ambiente deve possedere caratteristiche idonee a salvaguardare il benessere psicofisico dell’utente

52

Principi di usabilità

Damiana Luzzi: [email protected]

Trasparenza l’ambiente deve comunicare all’utente lo stato, gli effetti delle azioni compiute e le informazioni necessarie per la corretta valutazione della dinamica dell’ambiente stesso

Apprendibilità l’ambiente deve possedere caratteristiche di utilizzo di facile e rapido apprendimento

Aiuto e documentazione

funzioni di aiuto, quali le guide in linea, e documentazione relativa al funzionamento dell’ambiente devono essere di facili reperimento e connesse al compito svolto dall’utente

Tolleranza agli errori

l’ambiente, pur configurandosi in modo da prevenire gli errori, ove questi, comunque, si manifestino, deve fornire appropriati messaggi che individuino chiaramente l’errore occorso e le azioni necessarie per superarlo

Gradevolezza l’ambiente deve possedere caratteristiche idonee a favorire e mantenere l’interesse dell’utente

Flessibilità l’ambiente deve tener conto delle preferenze individuali e dei contesti

Valutazione e

validazione

54

Test di accessibilità e usabilità

Damiana Luzzi: [email protected]

55

Metodologia di valutazione dell’accessibilità e dell’usabilità

Damiana Luzzi: [email protected]

Validazione con strumenti semi-automatici

Analisi con l’utente Analisi dell’esperto

56

Quali pagine sottoporre a validazione?

Damiana Luzzi: [email protected]

Come procedere se le pagine di un sito Web sono 1.000 o più?

In questo caso è opportuno selezionare un campione di pagine Web in base alle loro diverse funzionalità:

  home page

  pagina generica di contenuti

  pagina con moduli o form

  pagina di ricerca e/o ricerca avanzata

  pagina con elementi multimediali

57

Accessibilità: caratteristiche strumenti di validazione

Damiana Luzzi: [email protected]

Individuazione di errori o avvisi

Riepilogo generale di errori o avvisi (rapporto)

Soluzioni proposte per la risoluzione di singoli errori o avvisi

Segnalano:   la riga o le righe di codice contenti errori o avvisi   l’identificazione dell’errore o avviso   il codice di marcatura dell’elemento contenente errori o avvisi   l’annotazione della tipologia per errore o avviso

58

Accessibilità: problemi degli strumenti di validazione

Damiana Luzzi: [email protected]

Impossibilità di analizzare automaticamente, ad esempio, che:

  il linguaggio utilizzato sia chiaro e semplice è un requisito non verificabile in modalità automatica: necessita del controllo del valutatore

  il valore dell’attributo <title> o dell’attributo <alt> sia corretto. Uno strumento di validazione potrà segnalare se non è stato associato un testo ad un’immagine, ma non potrà valutare la qualità o la pertinenza dei testi

59

Accessibilità: classificazione degli strumenti di validazione

Damiana Luzzi: [email protected]

Sono classificabili secondo:   standard e linee guida (WCAG 1.0 e/o Section 508)

  gratuiti o a pagamento/commerciali (la scelta dipende dalla capacità d’uso dell’utente, dal numero di pagine presenti nel sito Web in esame e dalle informazioni che devono essere raccolte)

  piattaforma   servizio online [solitamente gratuito, es. Cynthia Says, Wave, WebXact]: inserendo l’URL della pagina Web in esame e selezionando le opzioni di valutazione effettua una verifica del codice, segnala gli errori in un rapporto finale e stabilisce il grado di conformità alle norme di accessibilità   all’interno del browser, installati come estensioni, forniscono un menu extra di opzioni o toolbar (AIS Accessibility Toolbar, Web Developer Extension for Mozilla-based Browser, Accessibility Extension for Internet Explorer, Accessibility Extension for Mozilla/Firefox)   all’interno di strumenti di sviluppo come plug-in (Macromedia Dreamweaver o Microsoft FrontPage)   installati nell’hard drive o nel server (Deque Ramp, InFocus by SSB, Bobby)

  cosa esaminano o in relazione al loro utilizzo   una pagina alla volta (strumenti di validazione reperibili online o quelli installati come estensione nella toolbar del browser) immettendo l’URL della pagina Web da testare   requisiti specifici (strumenti di validazione reperibili online o quelli installati come estensione nella toolbar del browser) utilizzando l’URL della pagina da testare   tutto il sito (installazione del software nell’hard drive o nel server. Tali software sono a pagamento/commerciali)

  solo validazione o validazione e riparazione (alcuni strumenti hanno funzioni di guida e/o correzione automatica degli errori riscontrati nella validazione)

60

Browser: Toolbar per l’accessibilità

Damiana Luzzi: [email protected]

È uno degli strumenti fondamentali per l’esame di alcuni aspetti dell’accessibilità di un sito Web

La Toolbar comprende un insieme di strumenti per: •  esaminare molteplici aspetti (struttura/codice/contenuto) di una pagina Web •  facilitare l’utilizzo di applicazioni sviluppate da terze parti •  simulare l’esperienza d’uso di diverse tipologie di utenti •  fornire riferimenti e risorse aggiuntive

Accessibility Evaluation Toolbar

Web Accessibility Toolbar <http://webaccessibile.org/articoli/la-barra-dell-accessibilita-versione-20/>

<https://addons.mozilla.org/it/firefox/addon/accessibility-evaluation-toolb/>

61

Esempio verifica accessibilità (WCAG 2.0)

Damiana Luzzi: [email protected]

Principio 1. Percepibile. Le informazioni e i componenti dell’interfaccia utente devono essere presentati agli utenti in modo da poter essere percepiti. Questo significa che l’utente, deve essere in grado di percepire le indicazioni indipendentemente dalla propria disabilità.

Linea guida 1.1. Alternative testuali. Fornire alternative testuali per qualsiasi contenuto non di testo in modo che possa essere trasformato in altre modalità fruibili secondo le necessità degli utenti come stampa a grandi caratteri, Braille, sintesi vocale, simboli o linguaggio più semplice.

Immagine

62

Loghi o immagini che contengono testo

Damiana Luzzi: [email protected]

<img src="/images/layout/ministri.jpg" alt=”Governo Italiano - Presidenza del Consiglio dei Ministri" />

Nel caso di un logo l’equivalente testuale deve corrispondere al testo presente nell'immagine

<img src="pallino.gif" alt=”” width="5" height="5" />

<img src="spaziatore.gif" " alt=”” width="15" height="10" />

Il testo alternativo si può omettere per le immagini puramente decorative, i pallini e le immagini spaziatrici.

63

Grafico

Damiana Luzzi: [email protected]

<img src="/images/grafico.jpg" alt=”organizazione di consultazioni pubbliche tramite web o e-mail" />

Nel caso di un grafico l’equivalente testuale deve corrispondere al titolo del grafico o nome della tabella

In Italia, rispetto ad altre nazioni europee, la tendenza ad utilizzare le consultazioni pubbliche dei cittadini tramite internet è ancora molto scarsa (consulta i dati).

È necessario fornire anche le informazioni del grafico in modo alternativo, ad esempio riassumendo i dati in forma testuale.

64

Link (collegamenti ipertestuali)

Damiana Luzzi: [email protected]

Un link è come un cartello stradale: si deve vedere e indicare la meta in modo inequivocabile.

Da evitare enunciati troppo generici come approfondisci, continua, clicca qui

Il testo del link deve essere chiaro e breve

È sconsigliato l’utilizzo solo di simboli grafici cliccabili, ad esempio frecce o icone.

Quando un link punta ad un file, indicare anche il tipo di documento e le sue dimensioni

65

Quale fra questi link è il più efficace?

Damiana Luzzi: [email protected]

1. Clicca qui per partecipare al nostro sondaggio e vincere un premio

2. Clicca qui per partecipare al nostro sondaggio e vincere un premio

3. Partecipa al sondaggio e vinci

Enti culturali

67

Ente o soggetto culturale

  Archivio

  Biblioteca

  Museo

  Patrimonio culturale diffuso sul territorio (patrimonio archeologico, architettonico, paesaggistico)

  Evento temporaneo (festival, mostre, altri eventi)

  Uffici di gestione e di tutela

  Centri di ricerca e formazione, scuole

  Progetti digitali Culturali

Damiana Luzzi: [email protected]

68

Linee guida anche per i siti web pubblici culturali

Manuale per la qualità dei siti Web pubblici culturali, Ministero per i beni e le Attività Culturali e Progetto MINERVA, febbraio 2004 (seconda edizione dicembre 2005) http://www.minervaeurope.org/publications/qualitycriteria-i.htm

Dieci Principi sulla Qualità dei siti web pubblici culturali, Progetto Minerva, 2003 http://www.minervaeurope.org/structure/workinggroups/userneeds/documents/cwqp-i.htm

Mostre virtuali on line. Linee guida per la realizzazione, draft 0,9, 1 aprile 2011 http://www.otebac.it/index.php?it/320/mostre-virtuali-online-linee-guida-per-la-realizzazione

Damiana Luzzi: [email protected]

Architettura dell’

Informazione

70

Architettura dell’informazione

Damiana Luzzi: [email protected]

L’architettura delle informazioni è il livello “più nascosto” del sito ma è il primo passo da compiere nella progettazione. Gli schemi classificativi più tipici sono

  Per ordine alfabetico (modello “Elenco del telefono”)   Per ordine cronologico (modello “archivio quotidiani”)   Per ordine geografico (modello “cartina geografica”)

  Per tipo di utente (modello “servizi bancari”)   Per tipo di compito (modello “ufficio anagrafe”)   Per macrocategorie (modello “biblioteca”)   Per metafora (Modello “realtà virtuale”)

  Nuove tendenze (tag, comportamenti emergenti, associalzio locali..

71

Navigazione per categorie

Damiana Luzzi: [email protected]

http://store.apple.com/it

72

Navigazione per categorie

Damiana Luzzi: [email protected]

http://www.amazon.com/

73

Navigazione per task

Damiana Luzzi: [email protected]

http://www.automobile.it/

74

Navigazione per tipo di utenti e servizi

Damiana Luzzi: [email protected]

http://www.intesasanpaolo.com/

75

Tipi di navigazione

Damiana Luzzi: [email protected]

  Navigazione fissa o principale

  Navigazione locale

  Navigazione contestuale

  Navigazione di orientameno (briciole di pane)

  Navigazione di servizio

  Struttura globale delle informazioni

  Informazioni di secondo livello, Approfondimenti

  Task specifici, correlazioni (oggi questo aspetto si è molto allargato)

  Correlazioni gerarchiche (oggi meno usato)

  Identità, login, personalizzazioni (oggi questo aspetto è determinante)

76

Navigazione principale

Damiana Luzzi: [email protected]

In alto (poche opzioni) o a sinistra (molte opzioni). Anche a destra va bene se è chiara la loro natura. E’ presente in ogni parte del sito

Serve a muoversi nelle aree principali del sito e dare un’idea dei contenuti principali

Errori da evitare  mettere link esterni  mettere link a materiali  mescolare mele con le pere  tassonomia incomprensibile  ritorno alla home  link a pagine vuote

77

Navigazione locale e navigazione contestuale

Damiana Luzzi: [email protected]

Navigazione locale

A sinistra, oppure a destra se il menù principale è a sinistra

Serve a dare le opzioni di “azione” concreta all’utente nell’area che ha scelto e approfondire parti

Errori da evitare  titolatura incoerente  troppe voci di menù  istruzioni incomprensibili

Navigazione contestuale

Tipicamente a destra e a centro della pagina, dentro il testo

Serve a dare accesso ai materiali, fornire link o associazioni ad altre pagine, effettuare azioni

Errori da evitare  mancata divisione tra pagine e materiali  mancata divisione tra pagine interne ed esterne

78

Navigazione di orientamento e navigazione di servizio

Damiana Luzzi: [email protected]

Navigazione di orientamento

Tipicamente in alto, sotto al logo e al menù principale

Serve a dare la posizione in profondità nel sito e risalire per categorie

Errori da evitare  posizionamento errato  finta briciola  la briciola finale è uguale alle altre  il titolo della pagina è diverso dal titolo della briciola

Navigazione di servizio

Tipicamente in alto, a fianco del logo e sopra il menù principale

Serve a dare informazioni sul sito, istruzioni e servizi, a gestire l’identità e le personalizzazioni

Errori da evitare  mettere cose diverse  mescolare servizi e menù principale  mescolare “contatti” e “Chi siamo”

79

Regole generali per la progettazione di un menu

Damiana Luzzi: [email protected]

Coerenza: il titolo della voce di menù è anche il titolo della pagina

Feedback: i menù attivi e i pulsanti cambiano stato (es. quello attivo non è cliccabile ed è di un colore diverso)

Memorizzabilità: ogni box del menù non ha più di 7 collegamenti

Learneability: i menù di navigazione rispecchiano il più possibile la struttura informativa del sito

Prevedibilità: la tassonomia deve rispecchiare le aspettative dell’utente

Scelte esplicite: se il sito è grande i sottomenù principali stanno in sotto-home page. No ai sottomenù a comparsa

Convenzioni: usare icone standard e convenzionali

80

Nuove tendenze

Damiana Luzzi: [email protected]

Classificazioni fluide (tag)

Associazioni contestuali tra i contenuti (notizie correlate, task correlati)

Inline navigation (es. Wikipedia)

Navigazione globale stretta (poche voci – aumento navigazione contestuale)

Navigazione task centrata (voci legate al “fare” dell’utente)

Classificazioni a faccette (e commerce)

Gestione identità (profili, personalizzazioni)

Comportamenti emergenti (più visti, più scaricati ecc)

81

Associazioni contestuali

Damiana Luzzi: [email protected]

http://www.youtube.com/?gl=IT&hl=it

82

Inline

Damiana Luzzi: [email protected]

http://it.wikipedia.org /

83

Classificazione fluida: tag

Damiana Luzzi: [email protected]

http://gallica.bnf.fr/

84

Navigazione per tipo di utenti

Damiana Luzzi: [email protected]

http://www.louvre.fr/

85

Modelli di architettura dell’informazione

Damiana Luzzi: [email protected]

  MUSEO&WEB: Modello di architettura di un sito web di un museo medio piccolo http://www.minervaeurope.org/structure/workinggroups/userneeds/prototipo/protomuseo/strutturacontenuti.html

  BIBLIOTECA&WEB: Modello di architettura di un sito web di una biblioteca http://www.otebac.it/index.php?it/185/biblioteca

  ARCHIVIO&WEB: Modello di architettura di un sito web di un archivio http://www.otebac.it/index.php?it/202/archivio

  SOPRINTENDENZA&WEB: Modello di architettura di un sito web di una soprintendenza del MiBAC http://www.otebac.it/index.php?it/173/struttura-e-contenuti-larchitettura-ideale-di-un-sito-web-di-una-soprintendenza-del-mibac

Esempi

87

British Library

Damiana Luzzi: [email protected]

http://www.bl.uk/

88

Gallica

Damiana Luzzi: [email protected]

http://gallica.bnf.fr/

89

Moma

Damiana Luzzi: [email protected]

http://www.moma.org/

90

The J. Paul Getty Museum

Damiana Luzzi: [email protected]

http://www.getty.edu/museum/index.html

91

Louvre

Damiana Luzzi: [email protected]

http://www.louvre.fr/

92

Museo Galileo

Damiana Luzzi: [email protected]

http://www.museogalileo.it/

93

Polo Museale Fiorentino: Uffizi

Damiana Luzzi: [email protected]

http://www.uffizi.firenze.it/musei/uffizi/

94

Polo Museale Fiorentino: Uffizi

Damiana Luzzi: [email protected]

http://www.internetculturale.it /

95

Riferimenti Bibliografici

Damiana Luzzi: [email protected]

•  Boscarol Maurizio, 2003. Ecologia dei siti Web, Milano, Hops.

•  Gnoli Claudio,Marino Vittorio, Luca Rosati Luca, Organizzare la conoscenza, Tecniche Nuove, Milano, marzo 2006.

•  Nielsen Jakob, Loranger Hoa, 2006. Prioritizing Web Usability, Indianapolis, New Riders Publishing.

•  Polillo Roberto, 2004. l check-up dei siti Web. Valutare la qualità per migliorarla, Milano, Apogeo.

•  Rosenfeld Luis, Morville Peter, Information Architecture for the World Wide Web: Designing Large-Scale Web Sites, O’Reilly, maggio 2009.

•  Scano Roberto, 2004. Accessibilità: dalla teoria alla realtà, Trento, Venezia, IWA Italy.

•  Scano Roberto, 2005. Legge 04/2004. Dalla teoria alla realtà. Normativa, sviluppo e verifica dell’accessibilità dei siti Internet, beni e servizi informatici della Pubblica Amministrazione, Venezia, IWA Italy.

•  Scano Roberto (a cura di), 2009. Appunti di accessibilità WCAG 2.0, lulu.com, Morrisville NC.

•  Troiani Gianluca, 2005. CSS Guida Completa, MIlano, Apogeo.

•  Visciola Michele, 2006. Usabilità dei siti Web. Curare l’esperienza d’uso in Internet, Milano, Apogeo.

•  Zeldman Jeffrey, 2003. Designing with Web Standards, Berkeley CA, New Riders.