Legge Stanca: approfondimenti e considerazioni

[deborahdc]

Legge Stanca: approfondimenti e considerazioni

Buongiorno a tutti, ciao Massi.
Come promesso apro questo post per parlare della Legge Stanca.
Come sai è da aprile che lavoro al progetto del sito del Parco di Pinocchio di Collodi. http://www.pinocchio.it

Questo post è un resoconto dall'inizio alla fine di tutti i consigli che mi sono stati dati per arrivare al risultato finale.
Spero possa essere d'aiuto a tutti coloro che avranno la necessità o ancor meglio la sensibilità di fare siti accessibili per disabili.
Premetto che molto probabilmente ci saranno ancora tanti errori. Quindi spero nella collaborazione di tutti per continuare a creare il post nella maniera più corretta possibile.

Per motivi di tempo, farò un copia incolla di tutto ciò che ho chiesto e di tutto ciò che mi è stato risposto (... hehe apparte le bischerate che ci siamo detti nei ritagli di tempo ...). Rimango comunque a disposizione per chiarimenti, qualora quello che ho scritto non è chiaro.

21/04/2007
**Deborah scrive: **
Ciao ragazzi, ho una proposta da farvi, un mega post dove però ho bisogno della collaborazione di tutti voi:
Partiamo dall'inizio cosi capite il caso nella pratica:
sto facendo un sito istituzionale e vorrei farlo in ottica seo, ottica w3c, legge stanca css, strict 1.0.

Sono notoriamente una schiappa con i css, il problema più grosso è che ho trovato un sacco di template guida per il transitional ma ancora niente per lo strict 1.0 con lay posizionato al centro pagina. La mia esigenza è quella di far apparire il menu in alto poi il testo di centro dove metto le cose più importanti, poi quelle di sx e di dx.
Problema W3C Legge stanca
Con il w3c mi destreggio abbastanza bene ma il problema riguarda la legge stanca per i form. Non sono ancora riuscita a trovare la soluzione a questo problema. Ho trovato una forma per far validare il form in strict 1.0 ma non è accessibile stanca ed ho bisogno del consenso obbligatorio per legge per inviare email con il consenso della normativa della privacy http://www.giorgiotave.it/forum/w3c-...tml-1-0-a.html
2) Prendendo come riferimento questa pagina tralasciando il fatto che non c'è la possibilità di aumentare il carattere altrimenti sballa quali altre accortezze per la legge stanca?

21/04/2007
Hogudo scrive:
La legge Stanca richiede, come avrai potuto appurare al convegno di Bologna (OT domani se riesco posto a tutti sto convegno che mi pare interessante), cose aggiuntive rispetto ad una valutazione del classico Validator W3. Il tuo sito mi sembra adatto molto al porting su strict, ma per poter fare una analisi un po' sensata avrei bisogno di sapere a quale tipologia di sito appartiene, quale tipologia di ente, numero di pagine medie e magari facci vedere una bozza di layout se hai qualcosa di definitivo.

Per i CSS è naturale che l'aspetto visuale cambi utilizzando un carattere a dimensione variabile in "em" dentro un layout in "px".
Non c'è layout che tenga anche perchè, ad esempio, potresti essere costretta a mettere un percorso di eventi della vita che ti fa sballare il numero dei caratteri.

In siti di PA c'è molta discussione sul tipo di unità di misura da usare, se fissa o variabile. Per l'accessibilità forse, ma dico forse, sarebbe meglio quella a larghezza fissa, ma la variabile percentuale ti toglie molte castagne dal fuoco.

Per i form ti consiglio, anche se in parte ti avevo risposto allora, questa discussione http://www.giorgiotave.it/forum/w3c-usabilita-accessibilita-qualita/33923-form-e-accessibilita.html

27/04/2007
Deborah scrive
Eccoci si parte.
Faccio un riepilogo al volo:
La pagina è validata XHTML 1.0
il css è validato
per il contrasto colori ho utilizzato http://www.webaccessibile.org/css/default.asp
e le I sono tutte blu

Il css è stato preso e rielaborato dal sito ConStile. http://www.constile.org/template/nuovo_layout_a_tre_colonne/esempio_3.html

Poi seguendo il link di Silvia B, mi sono presa, il css per il testo nascosto e anche quello per la stampa.

Citazione:
nel post definitivo metterò anche il css per la stampa e il css della pagina

Ho dato una controllatina IE, FF, Netscape, MAC con Cibino, Opera. Io li vedo bene ma attendo anche le vostre conferme.

27/04/2007
Hogudo scrive:
Io non utilizzerei per la grandezza del testo e dei bordi sia em che px che %
La percentuale ed i px per il layout, mentre gli em per il testo, compresi gli "hn"

Bello però! Il lavoro, prendendo spunto da alcuni template IWA (come fanno quasi tutti), con il tuo tocco e le tue idee sta venendo bene e si è accresciuto di armonia

27/04/2007
Conversazione tra Elvino e Deborah
Rieccomi

Posto, con la sua approvazione, uno scambio di opinioni avuto in privato con Elvino, ne sono uscite di cose interessanti:

** Problema riscontrato: avevo messo validazione xhtml 1.1 **

[20.15.17] Elvino scrive: il sito è fatto con un cms?
[20.15.21] Deborah scrive: no
[20.15.25] Deborah scrive: codice a mano
[20.16.12] Elvino scrive: quindi l' xhtml 1.1 non va bene
[20.16.20] Deborah scrive: si comincia bene
[20.16.21] Elvino scrive: massimo xhtml 1.0 strict
[20.16.59] Elvino scrive: basta che vai nelk sito del w3c e ti leggi le specifiche dell' xhtml 1.1
[20.17.15] Elvino scrive: va servito solo come application/xhtml+xml
[20.17.39] Deborah scrive: ok modificato

** Contrasto di colori **
[20.19.11] Elvino scrive: comuque per il contrasto colori ti consiglio di usare un' estenzione per firefox
[20.19.29] Elvino scrive: la trovi in http://juicystudio.com/

** Direzione di lettura**
[20.20.53] Elvino scrive: nel tag html aggiungici l' attributo dir
[20.21.01] Elvino scrive: la direzione della lettura
[20.21.08] Elvino scrive: dir="ltr"
[20.21.16] Elvino scrive: left to right
[20.21.32] Deborah scrive: non l'avevo mai trovato dove lo devo inserire di preciso
[20.22.18] Deborah scrive: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it" dir="ltr">
[20.22.25] Elvino scrive: si

** Nascondere il testo**
[20.23.57] Elvino scrive: per nascondere <div id="saltamenu" class="nascosto"><a href="#contenuti" accesskey="c">Vai ai contenuti</a></div>
[20.24.06] Elvino scrive: hai usato il display none
[20.24.10] Elvino scrive: non va bene
[20.24.22] Elvino scrive: gli screen reader non lo leggono
[20.24.26] Deborah scrive: apposto
[20.24.32] Deborah scrive: come lo devo mettere?

[20.25.11] Elvino scrive:
position : absolute;
top : -9000px;
left : -9000px;
z-index : 9;
[20.25.21] Elvino scrive: lo sposti fuori in poche parole
[20.25.58] Elvino scrive: c'è chi usa:
[20.26.00] Elvino scrive: .nascosto {
display: block;
text-indent: -9999px;
}
[20.26.07] Elvino scrive: oppure
[20.26.09] Elvino scrive: .nascosto {
position: absolute;
left: -9999px;
}
[20.26.29] Deborah scrive: ti da problemi con i motori di ricerca?
[20.26.34] Elvino scrive: no

[20.27.17] Elvino scrive: cmq se vuoi approfondire
[20.27.19] Elvino scrive: http://css-discuss.incutio.com/?page=ScreenreaderVisibility
[20.27.37] Deborah scrive: ottimo

** Una regola semplice ma che non tutti applicano **
[20.31.29] Elvino scrive: ti spiego una regola semplice che io applico
[20.32.55] Elvino scrive: il deve essere visibile e navigabile con:
[20.33.02] Elvino scrive: risoluzione 800 x 600

[20.33.37] Elvino scrive: con IE 6 carattere molto grande
[20.34.12] Elvino scrive: opera grandezza 150%
[20.34.43] Elvino scrive: firefox dimensione testo aumenti 2 volte
[20.34.55] Elvino scrive: bel casino eee

[20.37.20] Deborah scrive: acciderbolina non avevo mai fatto questi controlli!
[20.37.31] Elvino scrive: per progettare un layout che sia veramente accessibile non è una passeggiata

** Distanza tra i link**

[20.38.33] Elvino scrive: i link nei menu nella colonna sx andrebbero distanziati
[20.38.44] Elvino scrive: e colorati all' hover
[20.38.57] Deborah scrive: distanziati di quanto
[20.39.26] Elvino scrive: per la legge stanca le liste di link vanno distanziate di minimo 0.5 em
[20.39.33] Deborah scrive: ok perfetto

** Il sito di Elvino**
[20.43.25] Elvino scrive: se vuoi prendere qualche spunto dal mio sito
[20.43.33] Deborah scrive: link
[20.43.46] Elvino scrive: non è una meraviglia, è molto semplice, ma non ha problemi di accessibilità
[20.43.51] Elvino scrive: http://www.elvino.it/
[20.45.05] Elvino scrive: la sottolineatura nei link viene fatta con un borser-bottom
[20.45.09] Elvino scrive: border
[20.45.19] Elvino scrive: no text-decoration

[20.48.16] Elvino scrive: a:link, a:visited {
background : #fefefe;
color : #05a;
text-decoration : none;
border-bottom : 1px solid;
}
a:hover {
text-decoration : none;
background :;
color :;
}
[20.48.41] Elvino scrive: così la sottolineatura è piu distanziata
[20.48.56] Elvino scrive: e puoi anche ingrossarla, cambiarla di colore ecc

[20.55.53] Elvino scrive: mancano le briciole di pane per la navigazione
[20.56.17] Elvino scrive: nel css per la stampa
[20.58.01] Elvino scrive: per la stampa imposta una grandezza dei caratteri in pt
[20.59.34] Elvino scrive: il testo giustificato va bene per la stampa, ma non per il web
[21.00.39] Elvino scrive: se usi gli accesskey come in <div id="saltamenu" class="nascosto"><a href="#contenuti" accesskey="c">Vai ai contenuti</a></div>
[21.00.45] Elvino scrive: usa i numeri
[21.00.49] Elvino scrive: da 0 a 9
[21.00.56] Elvino scrive: 10 sono anche troppi
[21.01.09] Elvino scrive: ma comunque vanno sempre più in disuso

** Template a due colonne o a tre colonne? **
[29/04/2007 16.38.31] Elvino scrive: in prima pagina ok le 3 colonne
[29/04/2007 16.38.43] Elvino scrive: ma sarebbe meglio 2 quando ci sono contenuti
[29/04/2007 16.38.55] Deborah scrive: ok ti spiego una cosa però
[29/04/2007 16.39.05] Deborah scrive: ci sarà una pagina di apertura
[29/04/2007 16.39.12] Deborah scrive: perchè questo è un portale che contiene
[29/04/2007 16.39.48] Deborah scrive: la butterfly, il giardino di villa garzoni, il parco di pinocchio,la fondazione collodi
[29/04/2007 16.40.00] Deborah scrive: quindi questa è la home page della sezione
[29/04/2007 16.40.16] Deborah scrive: domanda perchè è meglio due quando ci sono i contenuti?
[29/04/2007 16.41.13] Elvino scrive: ti trovo un link con la spiegazione bella dettagliata
[29/04/2007 16.41.30] Deborah scrive: perfetto grazie infinite
[29/04/2007 16.42.55] Elvino scrive: mi sembra qui
[29/04/2007 16.42.57] Elvino scrive: http://www.subvedenti.it/Saggio/Saggio_v2.asp
[29/04/2007 16.43.14] Elvino scrive: questa è la versione vecchia invece
[29/04/2007 16.43.16] Elvino scrive: http://www.subvedenti.it/Legge9/Legge9.asp
[29/04/2007 16.44.14] Deborah scrive: ok posto anche questi due link su moderatori
[29/04/2007 16.45.21] Elvino scrive: cmq il concetto è la chiarezza
[29/04/2007 16.45.40] Elvino scrive: è utile per ipovedenti, per utenti con problemi cognitivi
[29/04/2007 16.45.47] Elvino scrive: immagina per esempio un' anziano
[29/04/2007 16.46.39] Elvino scrive: l' hover nei link nerl menu in alto
[29/04/2007 16.46.46] Elvino scrive: che manca
[29/04/2007 16.47.02] Elvino scrive: le briciole di pane che mancano

Come scrivere il footer
[29/04/2007 16.47.49] Elvino scrive: per l'indirizzo sotto usa il proprio tag semantico
[29/04/2007 16.47.54] Elvino scrive: <adress>
[29/04/2007 16.48.24] Elvino scrive: address
[29/04/2007 16.48.53] Deborah scrive: ok per l'hover nei link in alto
[29/04/2007 16.48.54] Elvino scrive: ricordati di marca le abbreviazioni, gli acronimi e i cambi di lingua
[29/04/2007 16.49.05] Deborah scrive: le briciole di pane le userei nelle pagine interne
[29/04/2007 16.49.10] Deborah scrive: le devo usare anche qui?
[29/04/2007 16.49.22] Elvino scrive: no no va bene la
[29/04/2007 16.49.23] Deborah scrive: per l'indirizzo sotto usa il proprio tag semantico
[16.47.54] Elvino scrive: <adress>
[16.48.24] Elvino scrive: address
[29/04/2007 16.49.39] Deborah scrive: no no va bene la? cosa intendi nelle pagine interne?
[29/04/2007 16.50.13] Elvino scrive: <address><strong>Nome e Cognome Via - Partita iva 0000 0000 000 - Webmaster</address>
[29/04/2007 16.50.19] Elvino scrive: per esempio
[29/04/2007 16.50.49] Elvino scrive: PT è un'abbreviazione, la devi marcare
[29/04/2007 16.51.12] Deborah scrive: ok questo tag address proprio non lo conoscevo ma come fai a saperli tutti!!
[29/04/2007 16.51.27] Elvino scrive: (<abbr title="provincia di...">PT</abbr>)
[29/04/2007 16.51.50] Elvino scrive: passando 12 ore al giorno a studiare i siti degli altri
[29/04/2007 16.51.52] Elvino scrive: ahahahahhaaha
[29/04/2007 16.51.55] Elvino scrive:
[29/04/2007 16.52.46] Elvino scrive: se per caso l'abbreviazione è per una parola di un'altra lingua, devi usare gli attributi xml.lang e lang
[29/04/2007 16.52.56] Elvino scrive: xml:lang
[29/04/2007 16.53.25] Elvino scrive: per marcare il cambio di lingua di una parola singola, uso lo span
[29/04/2007 16.54.20] Elvino scrive: <span xml:lang="en" lang="en">apple</span>
[29/04/2007 16.54.33] Deborah scrive: ok quando metto abbr però a video non si vede niente è normale?
[29/04/2007 16.54.40] Elvino scrive: dipende
[29/04/2007 16.54.50] Elvino scrive: puoi modificare dai css
[29/04/2007 16.54.52] Deborah scrive: ti faccio vedere
[29/04/2007 16.55.00] Deborah scrive: per il title non si vede
[29/04/2007 16.55.01] Elvino scrive: si dovrebbe vedere il cambio del cursore di default
[29/04/2007 16.55.09] Elvino scrive: il title quando ci vai sopra
[29/04/2007 16.57.46] Elvino scrive: ovviamente il borser sotto lo modifichi con i css
[29/04/2007 16.57.53] Elvino scrive: border
[29/04/2007 16.58.13] Elvino scrive: di default si cerca di mettere il border dotted
[29/04/2007 16.58.51] Deborah scrive: HO CAPITO è con IE che non si vede con FF si
[29/04/2007 16.58.57] Elvino scrive: e il cursore help
[29/04/2007 16.59.08] Elvino scrive: ma con IE non si vede un tubo...
[29/04/2007 16.59.10] Elvino scrive: heheheh
[29/04/2007 16.59.12] Deborah scrive: hahah
[29/04/2007 16.59.19] Elvino scrive: nel mio sito per esempio:
[29/04/2007 16.59.22] Elvino scrive: acronym, abbr {
cursor : help;
border-bottom : 1px dotted #333;
}
[29/04/2007 17.00.10] Elvino scrive: io non lo metterei così però
[29/04/2007 17.00.12] Elvino scrive: <abbr title="Provincia di Pistoia">(PT)</abbr>
[29/04/2007 17.00.42] Deborah scrive: come
[29/04/2007 17.01.10] Elvino scrive: ti do un link di un sito che vedi come hanno fatto e come andrebbe fatto
[29/04/2007 17.01.15] Elvino scrive: un sito a noerma della stanca
[29/04/2007 17.01.23] Elvino scrive: http://comune.sala-consilina.salerno.it/
[29/04/2007 17.01.40] Elvino scrive: te hai marcato anche le parentesi
[29/04/2007 17.01.48] Elvino scrive: le parentesi devono stare fuori
[29/04/2007 17.01.58] Elvino scrive: l' abbrevazione è PT , no (PT)
[29/04/2007 17.02.06] Elvino scrive: che meticolosooooo
[29/04/2007 17.02.09] Elvino scrive:
[29/04/2007 17.02.40] Deborah scrive: no no è perfetto
[29/04/2007 17.04.09] Elvino scrive: visto il sito? capito la differenza?
[29/04/2007 17.05.58] Deborah scrive: si aggioranta anche per la partita iva

**Ultimi controlli **
[29/05/2007 11.44.38] Elvino scrive: 1 vedi un po gli avvisi per i css
[29/05/2007 11.44.50] Elvino scrive: se riesci a migliorare un po
[29/05/2007 11.45.02] Deborah scrive: si css e validatore li devo ancora ricontrollare bene
[29/05/2007 11.45.47] Deborah scrive: tu fai tutte le critiche che mettiamo
[29/05/2007 11.45.59] Deborah scrive: cosa controllare prima di mettere online:
[29/05/2007 11.46.06] Deborah scrive: i punti caldi della legge stanca:
[29/05/2007 11.46.17] Deborah scrive: uin vademecum dettagliato
[29/05/2007 11.46.22] Elvino scrive: l' hover nei link è assente nel menu in alto
[29/05/2007 11.46.39] Elvino scrive: e poco contrastato in quello a sx
[29/05/2007 11.47.12] Elvino scrive: anche se al test del contrasto colore passa
[29/05/2007 11.47.16] Deborah scrive: ci posso mettere un dashed i puntini?
[29/05/2007 11.47.25] Elvino scrive: intendo non in senso assoluto, ma rispetto al link attivo
[29/05/2007 11.47.42] Deborah scrive: l'hover intendi?
[29/05/2007 11.47.49] Elvino scrive: si
[29/05/2007 11.47.54] Deborah scrive: a si ok
[29/05/2007 11.48.01] Deborah scrive: ma devo mettere l'underline
[29/05/2007 11.48.07] Deborah scrive: oppure la posso omettere?
[29/05/2007 11.48.08] Elvino scrive: e poi il menu in alto non ha proprio un hover
[29/05/2007 11.48.21] Deborah scrive: si quello hai ragione
[29/05/2007 11.48.23] Elvino scrive: non è indispensabile
[29/05/2007 11.48.30] Deborah scrive: volevo sapere se posso omettere l'underline
[29/05/2007 11.48.35] Deborah scrive: ok perfetto
[29/05/2007 11.48.38] Elvino scrive: l' importante è che sia ben comprensibile il link e il cambio del focus nel link

** Problemi con testo giustificato per gli utenti **
[29/05/2007 11.51.48] Elvino scrive: ** cosa ho vistoooo**
[29/05/2007 11.51.55] Deborah scrive: oddio
[29/05/2007 11.51.55] Elvino scrive: il testo giustificatoooooo
[29/05/2007 11.52.17] Deborah scrive: nse pò?
[29/05/2007 11.52.28] Elvino scrive: mmm sarebbe da evitare
[29/05/2007 11.52.38] Elvino scrive: solo magari per cortissimi paragrafi
[29/05/2007 11.53.01] Elvino scrive: se mi fai un paragrafo di 10/15 righe in giustificato diventa pensante
[29/05/2007 11.53.09] Elvino scrive: intendo da leggere
[29/05/2007 11.53.15] Elvino scrive: pensa sempre all'utente
[29/05/2007 11.53.55] Elvino scrive: ovvio che l' effetto estetico è diverso senza "giustificazione"
[29/05/2007 11.54.12] Deborah scrive: se mi dici cosi lo metto a sinistra
[29/05/2007 11.54.26] Deborah scrive: aggiorna
[29/05/2007 11.54.30] Deborah scrive: non è poi cosi male
[29/05/2007 11.54.37] Elvino scrive: perchè il testo giustificato si sballa di piu ingrandendo il tutto
[29/05/2007 11.54.48] Deborah scrive: ok perfetto
[29/05/2007 11.54.49] Elvino scrive: perchè anche gli spazi fra le parole si allargano
[29/05/2007 11.55.02] Elvino scrive: basta che fai un test con opera al 150%
[29/05/2007 11.55.26] Deborah scrive: ottimo materiale per la relazione

Link con attributo blank sito validato strict 1.0

[28/06/2007 14.08.56] Deborah scrive: posso fare aprire delle pagine in _blank?
[28/06/2007 14.08.58] Elvino scrive: c'è una bella risorsa
[28/06/2007 14.09.21] Elvino scrive: l'attributo target è deprecato nello strict
[28/06/2007 14.09.26] Elvino scrive: non puoi usarlo
[28/06/2007 14.09.28] Deborah scrive: lo so
[28/06/2007 14.09.42] Deborah scrive: ma io vorrei non perdere la navigazione del sito
[28/06/2007 14.09.50] Deborah scrive: non c'è una soluzione a questo problema?
[28/06/2007 14.10.06] Elvino scrive: asp che cerco lo script
[28/06/2007 14.10.15] Elvino scrive: è fatto apposta per l'accessibilita
[28/06/2007 14.11.39] Elvino scrive: http://wili.diegolamonica.info/
[28/06/2007 14.15.48] Elvino scrive: clikkando in un link in javascript, l' utente può segliere se aprire le finestre in altre nuove o no
[28/06/2007 14.16.03] Elvino scrive: e se non ha il javascript abilitato si aprono nella stessa
[28/06/2007 14.16.56] Elvino scrive: oppure se vuoi farla facile metti il link normale dentro href e aggiungi il javascript per aprire in una nuova finestra, ma lo devi avvisare con il title
[28/06/2007 14.19.35] Elvino scrive: prova
[28/06/2007 16.33.30] Elvino scrive: <p><a rel="external" accesskey="1" href="http://www.elvino.it" onclick="window.open(this.href, 'window', 'status=no,toolbar=yes,scrollbars=yes,titlebar=yes,menubar=yes,resizable=yes,directories=no,location=yes');return false;" onkeypress="window.open(this.href, 'window', 'status=no,toolbar=yes,scrollbars=yes,titlebar=yes,menubar=yes,resizable=yes,directories=no,location=yes');return false;" title="apre il sito elvino.it in una nuova finestra">elvinot</a></p>
[28/06/2007 14.20.00] Deborah scrive: sei un mito!!

**Sanzioni Legge Stanca **
[28/06/2007 14.23.12] Deborah scrive: sanzioni per i siti non a norma legge stanca sai dove posso trovare?
[28/06/2007 14.23.24] Elvino scrive: nei sogni...

[28/06/2007 14.24.31] Elvino scrive: ma non è a norma lo stesso per colpa dell' uso del click
[28/06/2007 14.27.29] Elvino scrive: in realtà non esisono sanzioni
[28/06/2007 14.27.35] Elvino scrive: infatti la legge deve essere modificata
[28/06/2007 14.27.46] Elvino scrive: esiste solo la nullità del contratto in essere