• User Attivo

    Test di accessibilità su un sito comunale

    Vorrei sapere se mi potete aiutare a testare con più browser possibili questo sito comunale: www.cineto.it
    Vi chiedo di segnalarmi eventuali errori sull'accessibilità del sito e differenze significative di visualizzazione tra 2 o più browser.
    Non vi chiedo quindi commenti sulla grafica, qualità dei contenuti, etc.
    Chiunque trovasse degli errori di accessibilità dovrebbe cortesemente indicarmi:

    • Il suo tipo di browser e versione
    • La risoluzione del suo monitor
    • Eventuali particolari opzioni settate nel suo browser (tipo testo più grande o più piccolo del normale)

    Ovviamente sono sono bene accette anche segnalazioni di errori testuali (tipo parole scritte in modo errato, tag non corrispondenti ai contenuti, etc) e grafici.
    Grazie a tutti per il prezioso aiuto!
    :ciauz:


  • Super User

    Fossi in te passerei all'XHTML, veniamo a noi:

    Firefox 1.5 su macchina Linux i686 a risoluzione 800x600
    Konquerror 3.5.3-0.2 con KDE 3.5.3-0.2 a risoluzione 800x600

    Vanno bene 🙂

    La pagina per le AccessKey falla a parte e chiamala proprio accesskey.html (ok non serve a molto ma butta via... )

    Cmq guarda anche [url=http://webxact.watchfire.com/]questo sito per la validazione automatica dell'accessibilità e ricorda prima di esporre il bannerino delle A, l'accessibilità si misura 50% in modo automatica e l'altro 50% facendo test con persone disabili.

    edit: Il tuo sito non è navigabilissimo senza css (link colore sfondo) e poi, se proprio non puoi modificare la posizione degli elementi (prima andrebbero i contenuti, poi i menu) metti un'img di un px all'inizio del body con un <a name... > che porti ai contenuti del sito e un alt bello descrittivo 🙂

    :ciauz:


  • User Attivo

    Grazie ragazzi per le info e per il benvenuto (anche se non sono nuovo!)

    Innanzitutto preciso che il sito l'ho sviluppato attenendomi esclusivamente a tutti i requisiti della legge stanca e della validazione del w3c per l'html e css. Quindi non conosco ulteriori nozioni di accessibilità, e principalmente mi interessa che sia conforme a quei requisiti.

    La validazione wai-aaa è indicata da questo tool automatico: http://www.contentquality.com/

    Non l'avevo provato il tool di watchfire, correggerò quindi gli errori indicati per validarlo effettivamente wai-aaa

    La sitemap l'ho evitata principalmente per un motivo, tutte le pagine del sito, con l'esclusione di quelle che contengono delle foto grandi di thumbnails, sono accessibili da tutto il sito. Non è comunque un problema inserirla.

    X Il_Rappo: Il sito l'ho testato sia senza css che con un browser testuale (Lynx Viewer), cos'ha che non va esattamente? No ovviamente non posso fare modifiche strutturali al sito. Non ho capito il consiglio dell'immagine di un pixel, a cosa dovrebbe servire?

    Riaggiorno questo topic appena ho corretto gli errori segnalati!

    :ciauz:


  • Super User

    @WebMasterCF said:

    Innanzitutto preciso che il sito l'ho sviluppato attenendomi esclusivamente a tutti i requisiti della legge stanca e della validazione del w3c per l'html e css. Quindi non conosco ulteriori nozioni di accessibilità, e principalmente mi interessa che sia conforme a quei requisiti.

    La validazione va bene, ma per essere accessibile davvero devi passare all'xhtml.
    Nota bene che ho messo la parola accessibile tra virgolette perchè quello che rende un sito accessibile sono tante cose, questa una delle tante 😉

    @WebMasterCF said:

    La validazione wai-aaa è indicata da questo tool automatico: http://www.contentquality.com/

    Non l'avevo provato il tool di watchfire, correggerò quindi gli errori indicati per validarlo effettivamente wai-aaa

    Come già detto su la verifica della tripla A (come tutte le dichiarazioni di accessibilità) è garantita da quelle verifiche per il 50% perchè quelle verificano solo il codice, non come è messo e le cose che scrivi. Per ottenere la tripla A devi far navigare il sito da persone con disabilità (temporanea o parziale) e farti vedere come vedono loro il sito con i loro browser, se è facilmente navigabile, con o senza css, se gli screen-reader lo leggono bene e in modo intelligente (dipende come posizioni i contenuti)

    @WebMasterCF said:

    X Il_Rappo: Il sito l'ho testato sia senza css che con un browser testuale (Lynx Viewer), cos'ha che non va esattamente? No ovviamente non posso fare modifiche strutturali al sito. Non ho capito il consiglio dell'immagine di un pixel, a cosa dovrebbe servire?

    Lynx va benissimo 🙂

    Il consiglio dell'immagine serve principalmente per chi usa uno screen reader. Dato che non puoi fare modifiche strutturali per mettere i contenuti prima dei menu, quella dell'immagine linkata all'inizio dei contenuti è un piccolo espediente per far si che chi usi uno screen reader non si debba sorbire tutti i menu prima di arrivare al contenuto. 🙂
    L'immagine se trasparente e di un px, ma con un alt del tipo: alt="Clicca qui per andare direttamente ai contenuti" è ottimale con un layout come il tuo dove il menu sinistro compare prima del contenuto

    edit: noto solo ora una cosa: hai mai pensato se uno vede il sito con una connessione lenta e per comodità blocca le immagini? 😉

    edit2: (qualche ora dopo...) Fornire altre due versioni del sito, una a forte contrasto e una solo testo aiuta 🙂

    :ciauz:


  • User Attivo

    Allora:

    1. ho messo la pagina [url=http://www.cineto.it/sitemap.html]sitemap

    2. ho corretto la disposizione degli header, ora il tool di watchfire valida WAI-AA

    3. ho convertito le dimensioni del testo in percentuale, ora il testo è ridimensionabile anche con IE (prima no)

    4. ho messo delle descrizioni migliori sui title dei link

    Mi ero dimenticato dell'obbligo alla corretta navigabilità del sito con le immagini disattivate!
    Ora dovrei aver corretto gli errori.
    Purtroppo con firefox c'è il problema che toglie del tutto le immagini (pure i contorni), e fa sballare le zone del sito in cui c'è nella stessa riga testo e foto (tipo http://www.cineto.it/aspetti-storici.html).
    Questo problema non so proprio come correggerlo!
    Per il resto l'uso dell'XHTML, l'espediente del pixel per lo screenreader e le 2 versioni aggiuntive del sito (testuale e a forte contrasto) non mi risultano obbligatorie (parlo sempre per gli standard a cui voglio fare riferimento), giusto?

    :ciauz:


  • Super User

    @WebMasterCF said:

    1. ho corretto la disposizione degli header, ora il tool di watchfire valida WAI-AA

    L'ho detto due volte -.-"
    Sembra che parlo a vuoto 🙂
    La validazione delle A è 50% a mano con persone disabili e 50% con bobby e cynthia (i validatori automatici).

    @WebMasterCF said:

    Per il resto l'uso dell'XHTML, l'espediente del pixel per lo screenreader e le 2 versioni aggiuntive del sito (testuale e a forte contrasto) non mi risultano obbligatorie (parlo sempre per gli standard a cui voglio fare riferimento), giusto?

    Certo allora non parlerei manco lontanamente di sito accessibile.
    Se ti basi solo sulla legge stanca ok, (che dice cmq di usare dove possibile l'xhtml strict 😉 ) ma quel sito non è accessibile 🙂

    Poi.. ai link sarebbe buona norma impostare un colore di background 🙂
    I colori penso vadano bene tranne il rosso, avevo trovato un sito che diceva quali colori era sconsigliato per i daltonici che li vedono diversi... ora non lo trovo -.-"

    Per le accesskey una pagina separata è meglio, difficile che uno va a vedere note legali per cercare i tasti di accesso 😉

    :ciauz:


  • User Attivo

    Ho capito quello che hai detto sulla validazione WAI! 😉
    Ma io dove le dovrei trovare delle persone disabili?

    No la legge stanca non obbliga assolutamente ad usare l'XHTML.
    Obbliga ad usare almeno la versione dell'HTML 4.01 o dell'XHTML 1.0 (consigliato) con dichiarazione di tipo strict.

    Come vi ho spiegato a me interessa rispettare i requisiti della legge stanca (dato che sono obbligato) e validarlo nell'HTML e CSS col tool del W3C.
    Poi il resto è superfluo, metto quello che posso.

    Secondo me voi ora state confondendo accessibilità con usabilità.
    Per dire, il consiglio del pixel e la pagina a parte degli accesskey (che ora ho indicato nel tag title delle note legali) non fanno parte del campo dell'accessibilità, ma dell'usabilità.
    Le lettere sottolineate sui link con gli accesskey non mi risultano obbligatorie.

    I link rossi su sfondo bianco e viceversa (come nel menù a sinistra) raggiungono valori di colore e luminosità che risultano accessibili anche per utenti con pronatopia, deuteranopia e tritanopia.
    Non so se tra queste 3 categorie rientrano anche i daltonici, ma se fosse siamo già fuori dal campo della legge stanca.

    Ora questo sito l'ho fatto in HTML, per i prossimi penso passerò all'XHTML.

    :ciauz:


  • Super User

    @WebMasterCF said:

    Ma io dove le dovrei trovare delle persone disabili?

    Provato a vedere il sito bendato? 🙂
    Con solo la tastiera?
    Ce ne sono tante di prove da fare "in casa" ^_^

    @WebMasterCF said:

    No la legge stanca non obbliga assolutamente ad usare l'XHTML.
    Obbliga ad usare almeno la versione dell'HTML 4.01 o dell'XHTML 1.0 (consigliato) con dichiarazione di tipo strict.

    Hei hei hei, io non ho detto mica che obbliga 🙂
    Ho detto: "che dice cmq di usare dove possibile l'xhtml strict"

    @WebMasterCF said:

    Secondo me voi ora state confondendo accessibilità con usabilità.
    Per dire, il consiglio del pixel e la pagina a parte degli accesskey (che ora ho indicato nel tag title delle note legali) non fanno parte del campo dell'accessibilità, ma dell'usabilità.
    Le lettere sottolineate sui link con gli accesskey non mi risultano obbligatorie.

    Il consiglio dell'immagine a un px è accessibilità per i non vedenti 😉

    Per il fatto delle accesskey posso darti pure ragione, fatto sta che difficilmente uno va a vedersi note legali per cercare gli accesskey 🙂

    @WebMasterCF said:

    I link rossi su sfondo bianco e viceversa (come nel menù a sinistra) raggiungono valori di colore e luminosità che risultano accessibili anche per utenti con pronatopia, deuteranopia e tritanopia.
    Non so se tra queste 3 categorie rientrano anche i daltonici, ma se fosse siamo già fuori dal campo della legge stanca.

    Questo non me lo ricordo con precisione assoluta, ti dò ragione 🙂

    :ciauz:


  • Moderatrice

    Perdonatemi sono completamente a digiuno di accessibilità, magari quello che sto per chiedere è ovvio ma vorrei fare il primo sito veramente accessibile ai disabili.
    Considerando che un sito ha passato la validazione w3c XHTML 1.0 Strict e da http://webxact2.watchfire. com è scomparsa quel terribile punto esclamativo giallo () ...
    Ho un pò di domande:

    1. C'è una logica a livello nazionale o mondiale nell'uso degli access key esempio Homepage l'accesskey è (H) per la Sitemap il tasto accesskey riconosciuto a livello mondiale è (S) inoltre, ho visto dei siti dove nel menu c'era scritta accanto la lettera dell'accesskey tra parentesi come ho scritto sopra. Esiste un modo ugualmente comprensibile ai disabili evitando di metterlo così

    2. Cosa usano i disabili per "leggere" un sito. Quale programma? Quanto costa? Dove lo trovo?

    3. Qualcuno di noi conosce un disabile che può testare i nostri siti e darci qualche dritta? Magari facciamo errori incredibili senza saperlo ......
      La legge Stanca prende in considerazione tutti i fattori per rendere il sito veramente accessibile?

    Non è una questione economica e non devo fare un sito istituzionale vorrei solo fare siti veramente accessibili per dar modo a chiunque di accedere ad internet e sicuramente questo è il forum giusto per queste cose.
    Sviolinata per Giorgio... 😄


  • Super User

    @deborahdc said:

    1. C'è una logica a livello nazionale o mondiale nell'uso degli access key esempio Homepage l'accesskey è (H) per la Sitemap il tasto accesskey riconosciuto a livello mondiale è (S) inoltre, ho visto dei siti dove nel menu c'era scritta accanto la lettera dell'accesskey tra parentesi come ho scritto sopra. Esiste un modo ugualmente comprensibile ai disabili evitando di metterlo così

    Se non ricordo male

    [url="/"]Home

    Dove indichi che lettera ha l'accesskey, ma non so se lo leggono.

    @deborahdc said:

    1. Cosa usano i disabili per "leggere" un sito. Quale programma? Quanto costa? Dove lo trovo?

    Oddio, dipende che tipo di disabilità intendi 🙂
    Cmq Jaws come screen reader (ciechi)
    Lynx e altri ancora..

    @deborahdc said:

    1. Qualcuno di noi conosce un disabile che può testare i nostri siti e darci qualche dritta? Magari facciamo errori incredibili senza saperlo ......

    Prova a vedere il sito bendata, con degli occhiali colorati (tipo quelli per vedere 3D) e cose così, magari senza mouse..

    @deborahdc said:

    La legge Stanca prende in considerazione tutti i fattori per rendere il sito veramente accessibile?

    Direi di no 🙂

    :ciauz:


  • User Attivo

    @ludus said:

    Ok, però devi tenere presente che la legge Stanca è una cosa e i livelli A, AA e AAA sono un'altra. Se i requisiti della legge non comprendono tutte le linee guida dei 3 livelli, allora devi scrivere che il sito rispetta la legge Stanca, non che ha raggiunto il tale livello se poi di fatto non lo ha raggiunto 🙂

    Mi puoi indicare quali punti delle linee guida WAI (fino a livello AA) non ho rispettato? :mmm:


  • User Attivo

    @ludus said:

    ma te li avevo indicati nella pagina precedente 🙂

    per esempio da:

    Do not use the same link phrase more than once when the links point to different URLs. alle linee 173, 177, 177, 179, 180, 181, 182

    Ma che tool hai usato per quel risultato?
    Guarda che nel sito non c'è nessun anchor text uguale per url differenti.
    A meno che non stai considerando dei commenti, che ora stanno li per facilitare i primi aggiornamenti al comune e che poi spariranno


  • Super User

    @WebMasterCF said:

    Ma che tool hai usato per quel risultato?

    È lo stesso della pagina prima

    http://www.webxact.com/
    http://webxact3.watchfire.com/

    Accessibilmente,
    Rappo 😄


  • Moderatore

    Ciao.

    ti butto alcune cose al volo:
    hai dichiarato come lingua l'italiano ma usi termini inglesi senza dichiararli (homepage, sitemap, credit..)
    hai messo dei link tutti sulla stessa riga, senza separazione a parte un |
    alcuni colori imho non sono sufficentemente visibili (vedi il celeste su sfondo rosso)
    utilizzi: <div class="titolo">TURISMO</div> quando c'è un tag perfetto per tali occasioni (hx)
    hai usato dimensioni assolute per i margini ed il padding (diciamo che le dimensioni in pixel non dovrebbero mai esser utilizzate, tranne, forse, per i margini)
    e soprattutto il carattere è troppo piccolo e cmq aumentando la grandezza degli stessi il testo non risulta leggibile a causa di sovrapposizioni errate (prova ad aumentare di un paio di volte con firefox [ctrl+]...noterai come i titoli celestini si perdano sullo sfondo bianco e si vanno a mischiare con il testo attiguo.

    Spero ti possa esser stato di aiuto. 🙂

    :ciauz:


  • User Attivo

    @massy said:

    Ciao.

    ti butto alcune cose al volo:
    hai dichiarato come lingua l'italiano ma usi termini inglesi senza dichiararli (homepage, sitemap, credit..)
    hai messo dei link tutti sulla stessa riga, senza separazione a parte un |
    alcuni colori imho non sono sufficentemente visibili (vedi il celeste su sfondo rosso)
    utilizzi: <div class="titolo">TURISMO</div> quando c'è un tag perfetto per tali occasioni (hx)
    hai usato dimensioni assolute per i margini ed il padding (diciamo che le dimensioni in pixel non dovrebbero mai esser utilizzate, tranne, forse, per i margini)
    e soprattutto il carattere è troppo piccolo e cmq aumentando la grandezza degli stessi il testo non risulta leggibile a causa di sovrapposizioni errate (prova ad aumentare di un paio di volte con firefox [ctrl+]...noterai come i titoli celestini si perdano sullo sfondo bianco e si vanno a mischiare con il testo attiguo.

    Spero ti possa esser stato di aiuto. 🙂

    :ciauz:

    le parole inglesi che ho usato sono termini di uso comune che fanno parte del vocabolario internet italiano, e poi stiamo parlando di una minima parte dei testi presenti nel sito!
    Comunque secondo te come lo dovrei dichiarare?
    Non è vero che il celeste su sfondo rosso non va bene perchè come valori fa 530 di colore e 184 di luminosità (500 e 125 sono i valori minimi da raggiungere).
    Solo per utenti con tritanotapia non raggiunge un sufficiente valore di colore (di luminosità si), ma questo non è indicato nella legge stanca (correggimi se sbaglio).

    se cerchi la validazione WAI-AAA).

    Per gli H secondo te quale sarebbe la soluzione migliore? Usare H1 nelle voci fisse del menù a sinistra e le 2 voci a destra (appuntamenti, le foto di cineto) ed usare H2 nel titolo in maiuscolo del centro che cambia in ogni pagina?
    Per i caratteri che risoluzione stai usando? Io 1280x1024 e li vedo bene!
    Il problema del ridimensionamento l'avevo visto, ci devo lavorare su.
    :ciauz:

    X Il_Rappo: l'ho usato il tool di http://webxact3.watchfire.com/ e veramente non lo trovo nemmeno l'errore che dici tu, che tra l'altro non c'è nel sito (è solo temporaneamente sotto forma di commenti).
    :ciauz:


  • Super User

    le parole inglesi che ho usato sono termini di uso comune che fanno parte del vocabolario internet italiano, e poi stiamo parlando di una minima parte dei testi presenti nel sito!

    Qui si potrebbe fare un discorso lunghissimo...
    Diciamo che se rendi i testi e i link importanti in italiano tutto ok, l'importante è usare la testa quando si scrivono testi 😉

    Per gli H secondo te quale sarebbe la soluzione migliore? Usare H1 nelle voci fisse del menù a sinistra e le 2 voci a destra (appuntamenti, le foto di cineto) ed usare H2 nel titolo in maiuscolo del centro che cambia in ogni pagina?

    H1 direi di usarlo solo nel titolo
    H2 & H3 titolo paragrafi e intestazioni
    H4 Sottotitolo
    H5 & H6 testi

    X Il_Rappo: l'ho usato il tool di http://webxact3.watchfire.com/ e veramente non lo trovo nemmeno l'errore che dici tu, che tra l'altro non c'è nel sito (è solo temporaneamente sotto forma di commenti).

    Per me? che errori ti ho trovato? 😄
    Casomai ciccio Ludus

    :ciauz:


  • Moderatore

    Il fatto che sia una minima o una sola cambia poco.

    Devi rendere una pagina a persone che non solo probabilmente non conoscono l'inglese, ma hanno anche magari problemi con l'italiano. Ad esempio dovresti usare un linguaggio semplice e scorrevole etc etc*

    *punto che mi sta in assoluto sulle balle, sinceramente.

    una soluzione potrebbe essere di dichiarare la lingua con <tag lang="en">parola</tab> o, in xml <tag xml:lang="en">parola</tag>.

    Poi il fatto che non possa usare mappa del sito a posto di sitemap o crediti ad posto di credits è discutibile. 🙂

    Ps:

    Per i caratteri che risoluzione stai usando? Io 1280x1024 e li vedo bene!

    E' proprio questo il punto. Tu non puoi sapere quale sia la mia. può darsi che sto con uno smartphone. oppure a 25000*18000 😐

    :ciauz:


  • Super User

    @massy said:

    una soluzione potrebbe essere di dichiarare la lingua con <tag lang="en">parola</tab> o, in xml <tag xml:lang="en">parola</tag>.

    :ciauz:


  • Moderatore

    hreflang è da usare quando la pagina di destinazione è in lingua diversa... 🙂

    quindi

    [url="pippo.html"]credits quando pippo.html è nella stessa lingua dichiarata (in questo caso, italiano) e credits è una parola diversa.

    [url="goopher.html"]crediti se goopher è in inglese

    [url="goopher.html hreflang="]credits entrambe
    🙂


  • Super User

    @massy said:

    hreflang è da usare quando la pagina di destinazione è in lingua diversa... 🙂

    Pardon, avevo capito male 🙂