 dei TemiWalkers con imbarata di valida degli accessibilità. Com'è già detto Daniele, mi presenta Antonio Gianni Schiavone. Sono lavorato informatica e ho lavorato per alcuni anni con sinistri di ricerca all'accennere occupandome di usabilità e accessibilità. Adesso sono un consulente agito su un progetto d'amettire con le vinti da digitali, comunque per i miei contatti il corpuno vuole seguirmi. Dove erano rimasti? L'anno scorso, anzi, nove mesi fa, realmente ero di nuovo qui, a parola di accessibilità, con un talk dove ho affrontato la materia in maniera un po' più ampia e generale, sempre unque ne dà nel contesto di WordPress. Dove ho sviscerato varie tematiche e vari problemi, però sia per chi non c'era, sia per chi c'era, ma magari non ricordo i dettagli, prima di andare nel vivo di questo talk, volevo un po' recuperare alcuni concetti per poter comprendere di ciò che si parla. In premise, cosa intendiamo per accessibilità? Questa è la definizione dell'attuale legge sull'accessibilità, e noto anche come legge stanchia, che define l'accessibilità come la capacità di sistemi informatici, nella forma in cui non sentite la tecnologia, di erogare servizi e fornire informazioni fornibili senza disfimiazione, anche la parte di coloro che, a causa di disabilità, necessitano particolari configurazioni. Quindi questo ci fa capire tre cose, innanzitutto che il focus è l'accessibilità e la fruabilità di dare ai servizi. Quindi mentre magari spesso in un guaggio comune per accessibile intendiamo qualcosa che è raggiungibile, sia in termini fisici, un luogo raggiungibile, sia in termini astratti, un oggetto al prezzo accessibile, in realtà informatica la chiave non solo sull'accesso, su di raggiungere l'informazione del servizio e quelle che è la base, ma consentire di utilizzare con informazione quel servizio sia fruibile. La seconda cosa è l'elita di disfimiazioni anche a tutti stati tecnologico. Nel scorso settimane si è aperta una discussione, anche forse un po' forzata, sul fatto che l'HTTPS potesse alterare, diciamo, in peria accessibilità di alcuni servizi, visto che appesentisce la comunicazione fra browser e server. Questo magari è un po' un'estremizzazione, però anche solo ricosturire un'applicazione non richieda necessariamente l'ultimo modello di iPhone oppure una banda da 8 GB al secondo, ma permette di utilizzare un'applicazione con risorse tecnologiche normali, basilari, e ha sotto un aspetto di accessibilità, quindi non fornere barriere anche tecnologiche. E poi che l'accessibilità è chiaramente orientata e disabile, che sono la categoria più debole che vogliamo nell'accesso a un servizio, ma non è limitato solo a quelli, non richiedere una banda altissima, c'era l'ultima generazione colpisce anche persone che non hanno problemi di disabilità. Che quanto è importante questa accessibilità di tenere un progetto web? Beh, secondo chi l'ha fondato, senza metterlo in un web, Tinsbenders lì, con l'autorio V3C, nella sua visione l'accessibilità dovrebbe essere un'aspetto intrinsico di ogni progetto web. L'anno scorso è un progetto anche le v-calves. Il quals'autorio le v-calves sono le linee guida nello sviluppo di siti applicazioni web, rilasciate dal V3C, o meglio da una particolare, sotto se se non è l'accessibilità. C'è una versione 2.0 e anche una norma ISO. Vedete, sbarrata 2.0, perché pochi mesi fa state rilasciate un aggiornamento di 2.1, che integrano nuovi requisiti orientati a tutto in ambito mobile, giusto un po' ai giorni fa si è pubblicata anche la traduzione d'italiano, anche la prima traduzione mondiale, quindi abbiamo anche questo piccolo primario, grazie al gruppo abitando da Robert Poscano. Diciamo, definiscono revocabile e requisiti in quattro categorie, allora ho fatto di vici in guide, qui terri, in vari livelli, diciamo dal più basilare, quindi stringente a quelle, diciamo, meno stringenti e meno fondamentali. Poi, diciamo, revocale, che sono inizia un documento normativo, ma se ma adesso arrivano dei documenti esplicativi, l'understanding, che sono documentati al fondimento, e le tecniche invece, con in certo totalmente degli esempi, molto già di sviluppa loro. Qui di queste sono, sono essenzialmente nella principale normativa di riterimento con pista tecnica. Invece, quanta riguarda la metodologia, quindi come cercherai di garantire l'accessibilità, hanno visto tre diversi approcci. Il primo, l'esperienza di accessibilità, c'è una persona fisicamente analisa un sito web e trove problemi, una persona non delmiata con presenza. La seconda è il gruppo di votazione, cioè, che mette insieme un gruppo di persone che hanno dei tipi d'accessibilità e si chiede di provare un sito web, un'applicazione web, un gruppo prodotto. Il terzo dà l'accessibilità, che sono dei software, che prendono in un pasto, diciamo, un sito web, e, diciamo, compiono determinate analisi e danno un risponso. Brevemente, prege difetti dei tre approcci. L'esper, l'esper, se una persona è realmente capace, è quello che dà maggiori garanzie, però ha un costo, come tutti i professionisti, e anche dei tempi, magari anche lunghi, raccolta la dimensione del progetto. Dopo l'irritazione, il problema è riuscire a creare un mix di persone che rappresentano un po' tutte le possibili problematiche. Per esempio, se io in questo gruppo porto delle persone con difficoltà auditive, persone non vedenti, però mi dimentico persone che hanno problemi di riconoscimento dei colori. Quindi, persone che hanno problemi di riconoscere le rosso, altri problemi rigati alla visione dei colori, se c'è un problema sui colori, quindi creare il mix giusto è un elemento critico. E anche in concorganizzare, diciamo, il test, può essere, non semplice, in difficoltà logistiche, in difficoltà di farli effettuare, ma anche in periodi diversi, quindi confrontare le esperienze, può essere semplicissima e non può essere non economicissima. Io vedo che se i tempi, invece, hanno il vantaggio di essere un'attruzione mediamente poco costosa, alcuni provo gratuiti, altri, alcune aziende offrono i prodotti al pagamento, ma con costi realmente contenuti. Problema è che non tutti i controlli possono essere riuscindimenti automatizzabili. Per esempio, un'analisi sul contenuto e sia comprensibile anche a persone con capacità intellettive ridotte, lì una macchina a capire quanto è difficile il testo, è un problema non traspurabile e anche altri problemi problematiche. Prasichemente, è un'attruzione che ci permette di esenziare un certo numero di problemi da facile e veloce. Questo slide non si viene solo coro perché l'anno scorso parliamo anche delle iniziative che Wordpress a livello di core ha fatto per migliora l'accessibilità della piattaforma. Il problema è che non è solo il core generare diciamo il risultato finale di un sito web, ma ci sono vari strati che contribuiscono a vari livello a creare il risultato finale. Quindi il core, i plug-in, i vari opzioni di configurazione, i temi e poi veramente il contenuto che gli editor creano e inseriscono all'interno sul sito, quindi sono vari strati che contribuiscono al risultato finale e anche solo uno può compromettere l'accessibilità di risultato finale. Quindi bisogna operare con l'accessibilità di operare su tutti i livelli diciamo gelatria. Oltre al lavoro sulla core, come di Wordpress ha lavorato anche a livelli di temi. Infatti da alcuni anni permette di quando si sottopone un tema sulla piattaforma Wordpress di proporre anche come tema l'accessibilità di livelli. Chiaramente dietro c'è dei volontari espressibilità che si oppure di analizzare il tema, rificare se effettivamente è accessibile. Qualora venga ritenuto effettivamente un tema accessibile e viene flaggato con questa opzione. In realtà è che quando uno va a selezionare sulla piattaforma Wordpress all'interno dei livelli e poi, diciamo, nei filtri anche accessibili e, diciamo, selezionare la sua ricerca dei temi anche che siano accessibili. A questo punto non le vedete, vabbè, ma se c'ho dei temi già pronti accessibili perché dovermi occupare l'accessibilità di un sito, cioè c'è l'oggia con gli accessibili. Il problema è che poi nella partita comune magari uno c'è già un sito o già un tema che utilita danni o magari è quello imposto dall'azienda perché è già stato sviluppato internamente questioni di immagine, branding, etc. Quindi, diciamo, ci sono vanti per cui un è vincolato a un particolare tema e non deve usare selezionare quello, però comunque può lavorare per cercare di migliorarlo. Quindi, praticamente il tema per cercare di migliorare un tema che c'è proprio per similare l'accessibilità. A cui non si le preminali, chiaramente non lavorate in un'ambiente produzione. Sembra un consiglio banale ma spesso, nella fretta nelle scadenze, c'è da uno lavorare live per qualche altro disastro, quindi chiaramente non lavorate in ambiente di produzione. La seconda cosa è cercare di importare i temali come un progetto d'unite, questo perché spesso, ultimamente, i temali sono strutture molto complicate. Quindi, ci sono vari script PHP che generano col piccolo snippet del tema che, ma è quello di via problemi, c'è da capire qual è effettivamente lo snippet che c'è il problema per essere complicato. Se lo caricate in unite, fate una ricetta del progetto e risolverete in pochi secondi. Un'altra cosa importante preferibilmente anzi è molto consigliato lavorare su un tema child. Questo perché, se magari non è un tema vostro, ma hai unico agli acquistati da un produttore eccetera, voi fatele le nostre modifiche. Arriva l'aggiornamento del tema di cancio d'ottima modifiche tornate a cavo. Quindi, evitate di lavorare su temi, vedi è proprio, ma lavorate su temi child in realtà qualunque aggiornamento in storia diciamo compromettere o comprendere mai a grave le modifiche che avete fatto. Per chi non sapesse cosa sono i temi child, preganci un tema che eleggia le funzionalità di un altro tema dei nomi del genitore e quindi permette di aggiungere estende la funzionalità del genitore. Ne permette di modificare che colice child sostanzialmente vasto va a scrivere le funzionalità e comunque sul sito Codex.org per ulteriori informazioni e esercizioni più approfondite cosa è un tema child. Comunque, sostanzialmente creazione un tema child è molto banale uno crea una direttoria all'interno dell'altra direttoria dei temi nomi a direttori senza, va beh, che non tenga spazio solitamente come buona pratica di aggiungere child, per quindi diciamo anche a colpo d'occhio da dire che si tratta di un tema child e di chi è figlio per il genitore quindi poi si crea un file cestare css per questo informazione per cui preghi anche di poi definisce wa di termini del padre, in un nome del template avviene questa associazione al temi padre quindi vengono sopra scritte a alcuno, tutte le funzionalità del padre. Quindi, ulteriori consigli di non lavorare su un tema generale in produzione preferibilmente comunque è consigliato di lavorare su una resource disponibil online e non in locale questo perché se vogliamo lavorare con i validatori una piccola parte lo mette anche di fettore il cat and paste del codice quindi uno può, dalla sua installs in locale, copiare il codice però questo è una percentuale molto ristretta che permette di usare le opzioni a maggior parte, lavoro non solo su risorse per l'ambiente online quindi, lavorare su una resource un server di test un'installazione in nostro demo semplifica molto le cose e permette anche di avere una piaccia scelta di quale validatore usare un altro consiglio è quello di verificare anche la correttezza dell'HTML generato la correttezza dell'HTML non è necessariamente un requisito di accessibilità però è anche vero che un codice pulito, siamo sicuri che viene facilmente tappetato da tutte quelle tecnologie che poi disabiliutano al web ovvero, il codice di tecnologie assistive quindi screen reader, ecc. avere un codice html guasto ci lascia un po' di certezza magari un screen reader ci passa sopra, un altro si blocca insomma comunque con un codice pulito è corretto e la cosa è migliore analogamente se è un tema molto vecchio che non usa i tag semantici trotti dall'HTML 5.0 in poi in 5.1 e 5.2 meritare anche di aggiornare il contenuto introducendo questi tag semantici anche qui non è un obbligo l'accessibilità però il loro uso sicuramente rende più facile la vita al tecnologie assistive quindi siamo ancora, diciamo, rendendo più digeribile il nostro termale allora quali validatori utilizzeremo per nostro esempio di oggi il primo è Modo che è un validatore online che è frutto di un progetto di ricerca di l'instituto di scienze ecologiche di informazione di continuazione alle ricerche di PISA e compatibile con l'EPUCAG 2.0 stanno adesso lavorando per la giornale del 2.1 e fra i caratteristiche peculiari permette anche i validari i validari siti responsivi perché simula l'accesso come se l'accesso fosse fatto da un dispositivo mobile oppure ed ex come se non c'era possibilità di selezionare il validario di simulare l'accesso di un dispositivo la reportistica è code driving cosa voglio dire che entro alcuni validatori come reportistica fanno home rendering della pagina mettendo dei pallini segnalatori dove trovano i problemi oppure danno una report numerico finale quindi non sono trovato 5 errori ma non danno indicazione per l'interno del codice una reportistica orientata a codice per non sviluppare molto è migliore perché facilita il lavoro poi di risoluzione ai problemi indico all'interno del codice dove il punto c'è il problema e tu puoi subito intervenire e modificarlo questo è il lavoro del sito e questo è uno screenshot di tour per l'intervento di oggi è total validator che invece non è online ma un software si stalla localmente sul computer supporti principali system operativi è un software freedom quindi c'è una versione basic gratuita più se volete funzionalità aggiuntiva c'è quell'appagamento compadibili con le vocabili 2.0 e la section 508 che invece è la legge americana per la sensibilità è valida anche HTML CSS quindi effettiva una validazione di due linguaggi mentre MOV NO lui fornisce un report orientato al codice quindi ok questa era poi l'appresentazione adesso proviamo a fare un piccolo tempio dal vivo comunque questo test fa un un tosù in fretta e furia un piccolo sitarello di esempio un pazzo ora ci siamo quindi ho messo su veramente in fretta e furia un piccolo sitarello di esempio proprio banale, banale, banale dove ho ci ho creato un piccolo articolo di esempio un classico lore mix devo messo un po' di tag di testo liste una tabella in fondo una citazione insomma stupidissimo pagina lore mix e ho caricato diciamo un paio di chiaramente il classico 20.17 più altri due temi uno che chiama responsi dell'altro per uno anche di solo far vedere la possibilità di creare i temi child fatto anche fare anche i temi child una prima cosa che volevo farmi vedere è come la stessa pagina però con temi diversi ha un'accessibilità diversa allora abbiamo attivato il 20.17 questo è quindi la nostra pagina di esempio col tema 20.17 e proviamo a darlo in pasto ai nostri qualitatori qui abbiamo un modo un postato l'analisi con le bucavi da a livello di conformance a lo chiama anche quello intermedio quello che è realmente richiesto anche dalle varie leggi europee proprio con l'italiano etc e provo a chiedere di analizzarlo ci metterà un po' e lui dice va beh solo un problemino un errore però diciamo sonsalmente sia che il tool va abbastanza bene cioè che il tema va abbastanza bene come controprova proviamo anche a vedere con total validator quello qua quello gratuito è questo questo sì che quella c'è la versione sia gratuita sia appagamento ma allora sono un validatore e c'è caratteristiche diverse per un esempio un modo analizzante aspetto di css cosa il validator non fa mi sono a volte le differenze anche di interpretazione dei requisiti infatti ne consiglio in generale quando uno fa un analisi con dei validatori prende in considerazione almeno T4 insomma anche per vedere un po' come interpretano le varie regole come vedete qui anche qui abbiamo solo due piccoli warning quindi diciamo un tema che è certificato per essere accessibile anche i validatori hanno dato un giudizio abbastanza parecchio positivo sonsalmente basta già cambiare la i template attiviamo quest'altro v3c l'organizzazione si metti la urla qui v3c non c'è un entri v3c c'è un validatore del v3c si comporta uguale si si si il 99% che non è il 100% ragiona sulle urle qualcuno permette anche di caricare un file oppure fare cat in paste per esempio questa opzione già total validator che no, permette solo di analizzare le urle altri vari, insomma, sicuramente tutti ragionano intermini di urla, quello tu preganti tutti poi le altre opzioni dipende per far vedere come già cambiando solo il tema è cambiato e qui, se prima avevamo solo un piccolo errore e poi già ne andiamo al 16 e ho solo cambiato il tema la pagina è la stessa e continuo dello stesso però basta solo questo il giudizio e anche il total validator più o meno dallo stesso punto aumentano gli errori se cambiamo ancora il tema chiamo questo aumentano ancora i più ma addirittura qua siamo allo di me centinaia perché c'è un problema su i CSS si ripercote su tutto il sito quindi io ho cambiato solo i temi, tre temi in cui uno praticamente era quasi privo di errori uno per tentare una serie di errori un altro, c'è un numero consistenza di errori quindi già fa vedere come già solo il tema in quello in quello stack di livelli che aiutano a generare il risultato cambia solo un livello può compromettare l'accessibilità generale di risultati vogliamo andare un attimino a guardare un problema e cercare di capire come risolverlo qui era la validazione fatta per questo reattivo allora qui mi trova per esempio mi trova un problema sulla forma, infatti se notate qual'è il problema? lui ha definito una lambe un'etichetta che in teoria dovrebbe essere associata un campo un segnimento di errori che è concettualmente il problema che hanno fatto il for dal momento sul foro del name e non su l'indì questo è anche un errore di HTML però sicuramente fa saltare l'associazione tra le etichette e il for quindi il nostro screen reader non riesce a fare questa associazione molto probabilmente se dalle regole non dovrebbe riuscire a fare questa associazione quindi lo screen reader non riesce a leggere etichette corretta per il campo testoale quindi utente non vedente arriva tutto il campo e i formi non cagli scelta del serie analizzando già non solo con questi strumenti vuoi vedere dove il problema molti forniscono anche per esempio la possibilità di cliccare e andare a vedere il riferimento e uno può andare a trovare la parte del codice che ha questo problema modificarla e risolverlo è una cosa abbastanza banale se volete farciò, ma se abbiamo pochi minuti insomma è veramente una banalità cercare il codice mettere un id all'input e correggere il for con il nome l'indì che abbiamo detto e quindi poi rilanciando in tutta questa pagina il problema un altro problema per esempio che andiamo qui è su CSS perchè probabilmente questa pagina per indicare i font size di elementi usa i pics ma sapete che i font size possono essere le spessi secondo varie unità di inizura i pics la percentuale o i m il problema dei p o anche altri è non aiuto allo web browser o finrider per persone di povedenti a scalare bene il contenuto quindi quando il inconsolato modulo nota che a quell'oggetto associato un espliciton size basato fix dice che è un errore e consiglia di quindi utilizzare o una faccia in quala meglio ancora gli m per chi uno vuole modificare il tema ci sono in rete vari tool che permettono di effettuare una conversione da pixel to m per esempio uno questa ma ce ne sono vari in cui stanzialmente uno può inserire il pics la dimensione base e poi quindi ottenere quindi per esempio quel caso era un 18 se la dimensione basa del del sito e 18px è quella normale in m diventa 1.25m quindi possiamo andare sul css e per ogni ricorrenza 18px potete seguire con gli m e quindi questa aiuterà a in grandire a scala dimensione del test in maniera più facile possiamo fare qualcosa al volo per esempio un altro errore ci siamo qui vedere era un fatto di utilizzare questo un errore che sto deprecato in caso avessi vari link uno dei trovi altro potete grupparli sto deprecato recentemente un altro problema è spesso si note questo qui il fatto di avere un id ripetuto su più elementi questo è calio spesso quando si hanno sezioni ripetute già questo è un errore di html che gli ti dovrebbe essere avere un valore unico per un determinato elemento comunque già avere ripetuti nella pagina permette a uno scrivere di non riuscire ad identificare un singolo elemento all'interno della pagina e quindi andare in confusione mi fanno segno che insomma il mio tempo è scaduto quindi se qualcuno vuole fare qualche domanda