p4tdw305

blog del laboratorio DW3 Lxweb 2005

Monday, January 02, 2006

Usability and Accessibility

Usabilità
Lo standard ISO definisce così l’usabilità: “la misura in cui un prodotto può essere usato da determinati utenti per raggiungere determinati obiettivi con efficacia, efficienza e soddisfazione in un determinato contesto d'uso”

Però data la giovane età del mezzo a cui ci riferiamo – il web – di fatto non esistono linee guida ben stabilite per creare siti usabili. Sicuramente c’è da distinguere l’usabilità dal buon web design che di per sé non fa di un sito un sito usabile. I siti necessitano di essere progettati perché siano usabili, l’opera di web design viene dopo nel processo di costruzione di un sito. In un sito usabile l’utente naviga bene pur non conoscendolo e trova tutte le informazioni che sta cercando senza dare particolari contributi personali per la comprensione di link e similari.Banalmente la barra di navigazione deve stare sempre al medesimo posto in tutte le pagine, lo stesso dicasi per tutti gli altri tasti funzionali. Le icone utilizzate (i.e. per la stampa, per cambiare pagina ecc ecc) saranno sempre le stesse, i colori di riferimento per ciascuna area del sito saranno anche loro sempre gli stessi. Si deve sviluppare un modello che poi si applica all’intero sito, ovviamente per sviluppare questo modello necessita una ampia riflessione sulle modalità d’uso del target ed è consigliabile una somministrazione in corso d’opera per potere apportare i giusti correttivi cammin facendo.

I padri dell’usabilità
jakob nielsen
donald norman
bruce tognazzini
jeff raskin, il papà del mac

Accessibilità
Il glossario delle Web Content Accessibility Guidelines del W3C definisce così un contenuto accessibile: “Un contenuto è accessibile quando può essere usato da qualcuno con una disabilità”.
I motivi per cui questa area è molto attenzionata al momento sono molteplici: morali, legali e anche ovviamente economici. Infatti se ci pensiamo bene i motori di ricerca sono i primi utenti non vedenti del web. Al riguardo ho trovato una cosa che mi piace citare, scritta da Kartsen M. Self –io l’ho trovata sul sito del w3c-:"The Kiss of the Spiderbot : Google is, for all intents, a blind user. A billionaire blind user with tens of millions of friends, all of whom hang on his every word. I suspect Google will have a stronger impact than [laws] in building accessible websites.". Mi pare renda bene il concetto.
Riguardo all’accessibilità in molti paesi del mondo inizia a nascere una normativa specifica. In genere sono regole a cui si devono attenere gli enti pubblici (o le web agency che lavorano per loro) nella creazione dei loro siti web. La norma più famosa al momento è quella degli States, la Section 508. In Italia c’è qualcosa di simile: Circolare 13 marzo 2001, n. 3/2001: “Linee guida per l'organizzazione, l'usabilità e l'accessibilità dei siti web delle pubbliche amministrazioni”.

I padri dell’accessibilità
david clark
andrew kirkpatrick
joe clark


Usabilità vs. Accessibilità
Creare un sito accessibile non necessariamente significa creare un sito usabile. Infatti quand’anche, per esempio, un sito sia corredato di tutti i testi alternativi necessari e siano stati immessi gli ordini di tabulazione ecc.; se, di partenza, l’impostazione del sito non lo rende usabile –cioè se gli utenti non riescono a trovare le cose che cercano o se la navigazione non è intuitiva- non lo sarà neppure avendo tutti i requisiti di accessibilità.
In sintesi le caratteristiche di usabilità ed accessibilità sono differenti e sono due ‘standard’ a cui ci si deve adeguare quando si progetta e costruisce un sito web; entrambi necessari nessuno dei due sufficiente.

L’attenzione dei webdesigner riguardo ai problemi di accessibilità
Chi fa siti ovviamente deve tenere conto di una serie di variabili che possono dipendere dagli utenti e che possono compromettere l’accessibilità ai siti.
Per citarne alcune:
- versioni diverse di browser
- settaggi diversi dei browser
- monitor a risoluzioni differenti
- velocità di connessione ad internet
- uso di user agent diversi dai browser tradizionali
- uso di devices diversi da un pc per la connessione ad internet

In tutti i casi sopra citati, ed in molti altri ancora, perché tutti gli utenti possano vedere nello ‘stesso’ modo un sito web chi lo progetta deve utilizzare alcuni accorgimenti.

L’annosissimo problema delle versioni diverse di browser è abbastanza al termine, infatti da quando tutti i produttori hanno aderito al web standards project i browser supportano tutti abbastanza bene gli standard dei vari linguaggi di markup e programmazione. Negli anni passati era veramente difficile che un sito che si vedeva bene in IE4 si vedesse altrettanto bene in Netscape 4. Ma questo per fortuna è passato. Soprattutto affidandosi ad Xhtml 1.0 transitional e facendo un corretto uso dei CSS (sia esterni che importati) si riesce a risolvere il problema della visualizzazione su browser diversi visto che i produttori hanno ormai deciso di conformasi appunto agli standard.

Il problema dei settaggi del browser (almeno per ciò che riguarda pulsanti, barre, caratteri) vanno abbastanza a braccetto. Infatti sono due variabili che influenzano la dimensione ‘fruibile’ del video. Il problema si risolve utilizzando quella che si chiama web safe area (la massima area disponibile su un browser, prima che venga aggiunta la scroll bar), che ovviamente va calcolata per ciascuna risoluzione video.
Ecco alcuni esempi:
risoluzione 640 per 480 safe area 600 per 300
risoluzione 800 per 600 safe area 760 per 420
risoluzione 1024 per 768 safe area 955 per 600
Oggi si progetta considerando la risoluzione 800 per 600 come standard inferiore.
Per ciò che riguarda i caratteri all’interno delle pagine web è importante definire sempre un font generico di riserva, nel caso in cui il font utilizzato non sia residente sul pc dell’utente; per ciò che riguarda la dimensione dei caratteri è consigliabile usare le unità em (1 em equivale all'altezza media di un carattere per un dato font), che essendo una unità di misura relativa consente all’utente di vedere in termini relativi le differenze di corpo tra i caratteri stabilite da chi ha scritto la pagina usando come base ciò che da lui è settato.
Riguardo alla velocità di connessione ad internet con la diffusione delle linee adsl a basso costo moltissimi riescono ad accedere ad internet ad una velocità accettabile, tuttavia esistono ancora utenti modem e moltissimi utenti gprs. Quindi bisogna tenere conto della pesantezza (in kb) delle pagine da downloadare; scrivendo un codice pulito certamente si fa molto tuttavia ove necessiti l’uso di immagini (per esempio il sito di un fotografo) alleggerire i siti non è sempre facile. Ci possono essere varie alternative come : dare una preview delle immagini e fare scaricare la versione a più alta definizione (o di dimensione maggiore) dall’utente secondo una sua precisa scelta oppure creare una versione light del sito.
Il problema dell’accessibilità dei siti consultati attraverso user agent diversi (i.e. screen reader, browser testuali, ma anche i crawlers dei motori di ricerca, ecc) o attraverso devices come palmari, telefoni cellulari di nuova generazione ecc, il discorso è più complesso. Innanzitutto i testi alternativi sono imperativi, è altrettanto importante usare i tag tipografici corretti (i.e. strong al posto di bold o emphatize al posto di italic) che possano consentire una lettura appropriata; si deve fare uso di long description per tutte quelle immagini che lo richiedono, bisogna prevedere l’ordine di tabulazione per accedere alle diverse parti delle pagine e per muoversi dentro le barre di navigazione. Ovviamente si deve parlare di layout con CSS puro o misto. Tutti questi ed altri accorgimenti permetteranno di navigare il sito anche in assenza di mouse, permetteranno ai reader di interpretare correttamente il testo e così pure ai browser testuali.

Come rendere accessibile una tabella: gli attributi summary, caption, col, colgroup, th, thead, tbody, tfoot

summary
lo scopo di questo attributo è fornire una descrizione completa della tabella (struttura e contenuto). Il contenuto di summary non viene riprodotto dai browser grafici infatti è destinata a user agent non visuali.

caption
è l’intestazione della tabella o se vogliamo una sua sintetica descrizione

th, thead, tbody, tfoot
sono tutti tag che consento di individuare gruppi di righe di una tabella (rowgroup). Vediamo come:
thead (table header) definisce una cella contenente le informazioni di intestazione, è la parte iniziale della tabella
th definisce le celle che stanno dentro al thead quindi dando informazioni su ciascuna riga e/o colonna della tabella (di default il contenuto di queste celle sarà grassetto e centrato). th dunque aggiunge un contenuto strutturale.
tfoot è il piede, cioè la fine della tabellam ma contrariamente a ciò che si potrebbe pensare non sta fisicamente alla fine della tabella, bensì prima di tbody di modo che il browser facendo il rendering del codice possa tenere conto della parte iniziale e finale della tabella.
tbody è ovviamente il corpo della tabella con il contenuto vero e proprio

colgroup, col
servono per la formattazione delle colonne, colgroup ci permette di formattare un certo numero di colonne insieme mentre useremo col –all’interno di colgroup- quando desideriamo attribuire più esplicitamente lo stile ad una colonna.

Definizione di browser
Differenze tra browser tradizionali, browser solo testo, screen-reader e altri web user agents.
Un web browser è un programma che consente la navigazione del www, esso interpreta il linguaggio di markup e lo visualizza sotto forma di ipertesto. Quando si parla di web browser si intendono i browser visuali. I più diffusi oggi sono: IE della Microsoft, Mozilla (in particolare nella sua variante Firefox), Netscape Navigator e Opera.

Browser solo testo
I browser testuali di solito lavorano sotto Dos o sotto consolle Linux, come si intende sono browser che leggono solo il testo, ci si sposta dentro le pagine con i tasti freccia, con invio e con il tab. Il più famoso browser testuale oggi è Lynx.

Screen reader
I lettori di schermo sono dei programmi –che normalmente si eseguono all’avvio del pc- che consentono agli utenti non vedenti o ipovedenti di avere il controllo del sistema operativo. Questi programmi trasformano in voce il testo che appare sullo schermo consentendo l’interattività. Il più famoso oggi é Jaws.

Altri user agent
possono essere i crawler (o spider) dei motori di ricerca, i bot, che comunque leggono le pagine web come un utente non vedente in quanto si tratta di programmi residenti su internet i quali si interfacciano con il resto del mondo del www leggendo i testi e di certo non vedendo le immagini. Di contro se si desidera che questi programmi non leggano i nostri siti o parti di essi è possibile controllarlo attraverso il “Robot Exclusion Standard” che non altro che un file residente sul sito che indicherà dove non è gradito l’accesso.

Palmari, telefoni cellulari di ultima generazione, ecc.
Questo tipo devices ha delle evidenti difficoltà di visualizzazione delle pagine web. I problemi sono svariati: le ridotte dimensioni dello schermo, il minore numero dei colori, la più bassa velocità di navigazione e sicuramente la minore potenza di calcolo.
Ovviamente hanno altri vantaggi come la tascabilità e di conseguenza l’enorme trasportabilità. In ogni caso sono molto utilizzati e quindi bisogna tenere conto anche delle esigenze di lettura di questi dispositivi (come illustrato in questa stessa ricerca al paragrafo web designer e accessibilità).

Utilità dei CSS per l’accessibilità
I fogli di stile ci vengono molto in aiuto per applicare a media specifici o a gruppi di media formattazioni specifiche ed adatte a loro. E’ possibile definire all’interno di un foglio di stile le categorie generiche di media a cui quel dato foglio di stile è applicabile, a parità di markup possiamo quindi rendere ‘leggibile’ il nostro sito a user agent diversi. Ciò permette agli interpreti di evitare di recuperare fogli di stile inappropriati o di leggere in modo inappropriato una pagina web.

fonti:
http://www.theusabilitycompany.com/
http://www.html.it/
http://www.section508.gov
http://www.governo.it/presidenza/web/
http://www.webaccessibile.org/
http://www.wikipedia.org/
http://www.fucinaweb.com/
http://www.freedomscientific.com/
http://www.webxtutti.it/
http://www.mediamente.biz/

0 Comments:

Post a Comment

<< Home