 Hola a tots, gràcies per vindre. Avui tenim una xerrada molt, molt interessant, que crec que tindria que estar sempre present a totes les Worldcamps. Avui l'accessibilitat és un tema dels grans desconeguts i pocosat. Avui tenim aquí a Vincent, que és un expert consultor d'accessibilitat digital, a més és experta en ciències de la visió. Ella, a més, també és una espècie de evangelitzador per totes les Worldcamps, que, innombrables, l'has castat i ha anat a posar en el seu missatge. Insisteixo, tindria que ser una xerrada obligatòria en totes les Worldcamps. Ell també fa els definiments gratuïts com el WP Accessibility Day. I són coses més a part que jo he estat aquests dies abans de conèixer i anar a mirar els seus vídeos i anar a mirar la seva web i m'ha semblat un món superapassionant. Avui ens vindrà a parlar de 10 més dos bàsics d'accessibilitat. I jo, almenys, superemocionat que estigui aquí a Barcelona. Gràcies per vindre-me. Un fort aplaudiment. Gràcies, Jordi, per la presentació. Gràcies a tots per vindre-me. I bé, estic molt content de vindre-me avui aquí a Barcelona i poder fer una xarra amb Valencià. És la primera vegada que parla amb Valencià en una Worldcamps. Gràcies. En presente. Yo soy Visan Sanchez, consultor de accesibilidad. Tinc un doctorat en optometria i ciències de la visió. I, quan jo em dedica a la ciència, era un tio seriós. Amb ansietat, síndrome de l'impostor i totes aquestes històries. Ara, tinc el monió un poquet més llarg, un poquet més desenfadat. A fer punyetes. Soc envaisador de Raiola Networks. Aquí vull agrair el recolzament per poder vindre a la Gorka i donar-vos aquesta xarra. La seva ajuda seria difícil. I vull aclarir una cosa. No soc director de TV3. El dit jo us mateixa. Em van mencionar un tuit amb una coneguda periodista de TV3. No soc jo, no soc família, no conec. Però jo avís molt TV3 i m'ha influït molt. Aquesta xarra veureu algunes de les coses que se m'han quedat gravades en la ment i algunes de les moltes passions. He podut trobar a Byzantics.com, a la meva comunitat d'accessibilitat.accesihab.es i al meu canal de YouTube conjunt de terroristes d'accessibilitat digital Equipodoblia.digital amb Joseu Manes. Anem cap a banda. Acessibilitat. L'accessibilitat és molt important. No cal que insistes que totes les vegades que parlen. Però vos ho explicaré amb un poema. Aquest poema té dues paraules. Tu. Tu. Tu. L'accessibilitat és bona per a tothom. He passat sempre i després de alguns dels títols, una cita. En aquest cas, el creador de la web, Tim Berners-Lee, té claríssimament clar que l'accés a la informació de totes les persones independentment de la seva discapacitat és una qüestió fonamental per a la web. I quan parlem d'accessibilitat hi ha moltíssima gent que considera que és una qüestió o ve de codi i de disseny. Però a mi això és més simplista. En recorda un poc aquesta frase de Carmen de Mairena. Yo soy elegante, perdarrere el codi, perdabant el disseny. Aprofita també per a reivindicar la figura d'aquesta dona que va viure una dictadura i amb el canvi de la democràcia no va poder viure dignament la seva identitat. I damunt veïn d'aquí de Barcelona. Doncs ve, realment l'accessibilitat depèn del codi, del disseny i del contingut. No he trobat millor emojit, però a més o menys se manté. Doncs comencem a la xarxa. De un mes dos. Qui coneix de un mes dos? Val. Quan no vull abusar del copyright, ho farem així, amb un colorect. Punt número 1. Idioma. No existeix idioma que no pugui ser malinterpretat. Ha fet és jo, sobretot, si l'idioma del text no correspon al idioma en què pronuncia el lector de pantalla. I tingueu aquí una demo de com llits la web de la Workup, un lector de pantalla. En català, però el lector... No sé si és lligirable del tot. Mira aquí. No. Aprendre dos d'Aisper, aprendre i per descobrir-nos aïs. Nusca en sex. Altres formes de utilitzar WordPress. Compartir dos d'Aisper, compartir con AXMX. Experiències. Anecdotes. I també per aportar el teu gran acte sòra per WordPress. Deu dir dos d'Aisples de abracades i d'encaixades de mas. Abracades. Una trobada entre companys i col·legues de professió que entri que exa totum. Totum. Em va encantar. M'ha arribat a la patata. No es ve. Es queden com... No entiendo nada. No se entén res. És important definir l'idioma en el que està redactat el contingut del web. El contingut és català. Cal trastocar el codi per indicar el llenguatge de la pàtina en general. Afortunadament no. Perquè a WordPress, opcions i idioma del lloc, català ja ho posarà a totes les pàgines. Però fixeu-vos un momentet en la cinta que posarà a la cinta d'Aisples. Fins i tot. Fins i tot. Fins i tot. La cinta de la creditació. Què diu? Code is poetry. Si a la pàtina de la Workam volem afegir aquesta frase d'Orient de Didly, això sí que s'ha de fer en codi, que aquest paragraf el llenguatge està en anglès. Si... o volem localitzar un poquet més, doncs... Code is poetry. Fins i tot indicar el idioma d'una paraula en concret. I si algú no recorda el Petri, el Petri tenia el Petri Monopatí i el Petri Fax. Vos recordeu, veritat? No sóc jo el més beianco de la sala, amb aquestes coses. Va, segon punt. Estructura. Per Aristòtil, el de veritat, el de la sèrie, no. El de 10 mesos, no. A força de construir bé s'arriba a bon architecte. Barcelona, architecte... És que som el fan de l'Axanel. Barcelona, architecte... Gaudí. Enteniu per què no puc fer l'Axarra de València? L'originalitat consisteix en el retorn a l'origen. Així, doncs, original és allò que torna a la simplicitat de les primeres solucions. Simplicitat, solucions. Per l'endemà de estructura, que millor que aquesta imatge. Esperava la Sagrada Família, però no. Que és això? Una maqueta d'estudi de distribució de pesos que li servia a Gaudí per a dissenyar les seves estructures, les seves edificis. Això a mi en recorda un wireframe, d'alguna manera. Imaginem que això és un wireframe d'un web normal. I correntaria diferents seccions, diferents columnes, etcètera. Si volem veure el mòbil, queda un poc xicoteta. La lletra serà xicoteta, serà difícil de llegir. Si ampliem, tindrem poc camp de visió per anar llegint. Haurem de fer scroll en horizontal i en vertical. Red flag total. Scroll només en una direcció i a poder ser en vertical. Si demanem que s'ajuste, què passa? Que sí, s'ajusta, però el text va ser difícil de llegir. Què ens deia Gaudí? Retorn amb els orígens. Orígens en arquitectura, griegos romanos, són todos humanos. Mientras vivieron, pues bueno... Dórica, dórica, hónica, hónica, corintia, corintia, corintia, corintia... Conheixeu els bistecs? Per favor, jo em ve que sí. Però aquí no conegueu els bistecs. Va ser un grup d'electrodisgusting d'aquí de Barcelona. Molt divertides. Nos ve, disseny en columna. Si aquest wireframe canvia la seva disposició a una columna, el contingut s'adapta al dispositiu. Per tant, vull que vos quedeu en tres conceptes, referents a d'alguna manera de la estructura. Mobile First, pensat primer en esmòbils. Responsive Design, que el contingut s'adapte al tambien de la finestra o del dispositiu. I Accessibility Ready. Consultoria rápida i gratuita sobre qui digital. Que estoy un poquito hasta las narices y por eso lo digo en castellano, para que así todo el mundo lo entienda y se quede grabado. Consejo gratis. En el repositorio de WordPress, tenemos un filtro de características y podemos marcar la primera opción, preparado para accesibilidad y espera accesibilidad. Eso es temas, los ha revisado, un equipo y la revisión es para confirmar que cumplen con cierto estándar que he prometido que no iba a mencionar en la charla. Tanqueme el paréntesis. Seguim. Capsaleres. Así yo normalmente dic en capsalamés, pero son capsaleres. Si el periodismo es en cara a una fuerza cega, la culpa es del periodista. Eugenio María de Ostos, no sé qui és. Jo vaig fer una búsqueda i una lectura en diagonal, perquè tots ja veu que ningú hi és les webs. Mirem en diagonal. És una cosa molt moderna, molt actual. Doncs no, senyores, ni senyores. Una fúria de periodi de 1929. Hi ha capsaleres. Les capsaleres servien per a indicar en quin lloc de la pagina començava cada notícia. I és el que ens serveix com a estratègia visual per anar buscant. La web fem exactament el mateix, buscar la informació que ens està interessant. I sobre les capsaleres, que el tindré en compte un parell de consells, deuen organitzar el contingut. A la Wikipedia, per exemple, a la Wikipedia sobre Barcelona tenim una capsalera ideal, Barcelona, la següent assassí, geografia, localització, i aquesta taula de continguts, en realitat, són les capsaleres. Les capsaleres també han de descriure el tòpic o propòsit. Si tenim una capsalera d'història, dins d'aquesta capsalera trobarem subcapsaleres que segueixi la temàtica d'història. I per últim cal respectar la jerarquia. Tots tothom, o tot un, en diuen, sí, jo respecte la jerarquia. Con diria Palomino. Mentira! Mentira. Mentira. Què respecta la jerarquia? Fem un remàs. Tenim 6 nivells de capsaleres. La jerarquia no significa que hem de gastar la Q, després la A2, l'A3, l'A4, sucessivament, sinó que, per simplicitat, assumirem que només tenim una Q. L'estàndar acte me li diu una altra cosa, però per simplicitat només n'hi ha una Q. La següent capsalera ha de ser una A2. Després d'aquesta capsalera, si necessitem una altra capsalera, podria ser una A2. Però aquí al mig deu haver-hi contingut. Si no hi ha contingut, no poden repetir capsaleres del mateix nivell. L'alternativa seria posar immediatament una Q3. Aquesta Q3 li podria succedir una A4, si farà falta, o podrien tornar a pujar una A2. Més o menys això és la jerarquia de capsaleres. Text. Com em pregunten com escriure? Sempre responc. Una paraula l'hora. Concaminar. Una pata, la otra, la otra, la otra. Cal evitar les imatges de text. Què és una imatge de text? Això. Per què és una imatge de text? Perquè si amplie, es veuen pixels. Ahir no hi ha text. No hi ha una informació textual. Nosaltres, amb la visió, interpretem que hi ha un text. Però el contingut és imatge. Quan no tenien la possibilitat d'incrustar fons, es recorria aquesta tècnica. Fer gifs amb el text, amb la teva font diferent, tal. Avui en dia no cal. Això és un text real. Es busca la font i no cal recorrer aquestes tècniques. A més, el text ha d'estar alineat a l'esquerre. Per què? Perquè és el sentit d'escriptura occidental. El suig estan acostumats a que la informació comença a l'esquena superior, no al racó superior, a l'esquerre. I això, si avança bé amb els gregos romanos, resulta que els gipsis ja ho tenien clar. Heig a l'inè a venir a la dreta, perquè el seu sentit d'escriptura era el contrari que el nostre. Sí, al mil cent abans de Crist, ja ho feien bé, perquè, guonades, ho india, ho fem mal. Per favor, un poc per favor. I assegureu-vos que, quan feu sum, fins al 200%, no desapareix informació o no se superposo, i que no deu aparèixer un scroll horizontal. Scroll vertical, només. Així, he incrementat tot, més d'un 200%. Fixeu-vos que, allà dalt, archivo, n'hi ha una superposició, allà dalt dice, n'hi ha, se superposa la icona per davant. Confirmeu que passa quan feu molt amplió massa. Quin? En jassos. Així, la cita m'ha costat trobar. És perillós anar sol, prena sol. Algú ha jugat al cel·la, pio l'ha acudit, el personatge es diu link, i li diuen, toma esto, clica aquí. A vegades, l'amor neurònic són un poc d'especials. Doncs bé, respecte als senyassos que el tenen en compte, que s'han de poder identificar a colp d'ull. En aquest text, que l'extre de la web de la Workup, associació no ha, és l'enllaç. Sí, hi ha un canvi de color, però, depenent, no es veu. Si el subrayeu, sempre es veu. A més, es convenien que aquest text siga descriptiu. Feu clica així. Una persona que navega amb un lector de pantalla pot anar saltant d'enllaç enllaç, i escoltarà només el text de l'enllaç. Si només escolta, feu clica així, no entenc què va passar quan fa ser clic. Si escrivim com una cita, no és obligatori al 100%, doncs puc millorar el secretari d'enllaç. Si pot juir el 50% dels als instrumentalistes, pot passar com fa ser clic. Si escrivim com està a la web de la Workup, associació no ha del Val. ¿Podríem millorar com a protectora associació no ha? Sí, images. Si no puc veure, haurem de poder llegir. ¿I qué de poder llegir? El text alternativo. Això és en honor a la work en l'Espanya, online. Si ho busquem ho entendreu. Warpers fa molt fàcil que afegim text alternatiu a les imatges. I, si necessiteu orientació sobre com ha de ser isotext, teniu aquest enllà, o n'hi ha una grà. Set, multimèdia, sempre ens quedarà Warpers TV. I això és la moda frase favorita, perquè m'agrada molt el pasilló. Bàsicament, en multimèdia requereix una alternativa textual. Si parlem només d'àudio, un podcast hauria d'anar a acompanyar d'una transcripció de liàleg amb identificació de qui està parlant i la informació sonora. Si parlem d'un vídeo sense això, una animació, caldria, o bé, una alternativa textual o audiodescripció. Quines més senzilles ha de afegir l'alternativa textual? Si parlem de vídeo, subtítols, audiodescripció, alternativa textual i a poder ser llengua de signes. Técnicament, quines són les més senzilles de afegir? Subtítols i alternativa textual. El tomàtic. Està un poquet poxo. Però s'han recordat desvídeos... Hola, tomàtic. Soc el número de super 8.600 bla, bla, bla, bla. No se'n tenia res. Que feien a la tele, apareixia el text. Hi havia una transcripció del que està vendint per a què entenguerés. Doncs això es tracta. Vull, color. El color comunica Jutja i Gerard Kitzler. A la Guèdela World Camp. Dos dies. 5 de maig, cotxeres de sants. 6 de maig, campos ciutadella. El text et diu ben clar on és cada cosa, per a reforçar-hi la comunicació, a modificar-te el color, per a indicar-te... Ei, són coses diferents, estan relacionades però són diferents. Tota la informació no textual, ara hi té un equivalent textual. Un botó de color verd. Què significa això? Una cosa bona o una cosa roïna? A Sincà no li ha agradat el pebrot. Però a ell és roïn. Però si ha de ser una cosa bona, ha fet un text. Acceptar el color que reforce el missatge. Aquestes etiquetes, en Gatxines, que alguns de vosaltres heu trobat, hi ha comunicació en forma de color, però també s'ha fet forma. És una alternativa per a les persones que no veuen veus i distingin les colors. No, contraste. Cada any es fa un estudi de els errors que hi ha al top one million de Gatxines web d'aquest any. Sempre, sempre, sempre, el principal error és el contrast. Així la cita és fàcil. Catalunya, contrast mal, malament, tra-tra... La Rosalía. Que està mal, eh? La web de la Work on once, fenomenal. Blanc sobre negre, contrasts màxim, és llitx. Si ho ha ben fet en negre, no és bocumpebrot. Però no és necessari posar blanc, es poden posar color sempre i quan hi hagi un contrast adequat. Si comparem els 3, doncs... És el que millor les veu, el que pitjor, i tenim tota una gama de colors per a jugar. WordPress, si definiu un color de text que no contrasta, ve a mi el color del fons, vos donarà un avis, no cal que vos complico más amb les calculadores. Si voleu saber-me sobre contrast, vos recomané la moa de charla de l'any passat a Work on Europe. Veu, navegació per teclat. Així ja té la marinera per trobar una cita. Camela. O era camela o era pedales. Cuando far pa'l'amor, pues bueno... El ratolí no és la única forma de navegar per una web. Hi ha molta gent que utilitza el teclat. Teclat avolador principalment. Així teniu una demo. Intenté comprar una entrada a la web de la Work on. Només utilitzant el teclat. Això que veieu a Idle, és el focus del teclat que t'indica sobre quin element activaria-se el control. Emplenant tots els camps, spoiler, que se m'acaba el temps. A l'altra banda, si ets el meu, no sé qui és. Espero no clavar-me en un embolic. Continueu a... Deu més un. A això ja és el bonus. Tamaña, text, tamaña. TV3, Quim Memé. Uu! Doncs no me duele, sovieres del prop. Se me recordó de dudar que esta señora, no? No hi ha cap norma sobre el tamaïne del text. És una llegenda urbana. Si no hi ha cap norma sobre el tamaïne del text, bueno, m'atissé. Hi ha una norma que ens diu el contrast. Que depèn del tamaïne del pes, però ja ha explicat que això, en una altra xapa, que no era massa significatiu. Si recorrim a les ciències de la visió de quan jo duia un escaveis curt, a 40 centímetres, els tamaïns optins de les llets minúscules estan entre 1,4 i 14 milímetres. Després vos dones la regerència. I, deu més dos. Tipografia. I si posen la còmica sants? I què feu tots els perdins? Tampoc hi ha normes sobre tipografia. Oh, sorprès! Hi ha recomanacions. Triar una tipografia llegible. Què és llegible? No ho sé ni jo. I tinc un doctorat. Resum de estudis. Als anys 30, la gent llegia més ràpid en estudis que es feien. No hi havia diferència. Però si li preguntaven a la gent, preferia llegir fons amb serifes. Als anys 2000, no hi havia diferència, la preferència sants. És allò al que estem acostumats. O sigui que uns consells. Per atrear correctament tipografies. Trio fons amb 16 convencionals. Arial, teins neuroma, verdana, garamondo, calínia, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica, còmica. Però és molt més ramatí, veim que a l'àmbit real es venen còmica, còmica. Les còmicas per l'àmbit real de Barcelona són molt altres. Hi ha còmica. I aquest còmica és un góna, Un patrimoni de partífics. Beit. que es detall sí que en grans. La E, a dintre de un U i proporcionat, una abertura proporcionada, la A també, aquesta és molt difícil i la Mont és una forma que s'ha girat, hi ha moltes fonts que la P, la B, la D i la Q són molt similars. I ara que mire, E, A, E, A... La grimita del Nilo, no et xessem bé, la? És que també m'agrada una visió i com és la setmana que ve, estic en un hype. Els dos últims punts estan explicats a aquesta xarra B que vaig donar a work en Saragossa. Per últim, treballeu amb pantalles que sigui color de la lente, que sigui el brillo, no sé quantos, si que ets i si que ets. Hi ha grimetes i hidratació del suig. I si és el meu consell com a sanitari. I així acabaré. Moltíssimes gràcies. I un momentet, un momentet... alguna pregunta més? Tot el més tímid o ja en preguntes per fer? Sí? Bueno, si no tenen su lloguna, que jo tinc ganes de preguntar-te coses, impressionant. Enganxa, enganxa. Me rebele un poco. Quíupines del dimoni, elementors d'IvyBuilder i totes aquests per... a nivell d'accessibilitat. Això de donar per una xarra... M'hauràs de preguntar, no? Això de donar per una xarrada, dues, no sé què... A veure, pues, qual la dones? Mmm, a Cartagena, parlaré d'elementors. Són ferraments. Les ferraments no són massa responsables per si hi ha una part de còdic que és responsabilitat de la ferramenta, però després hi ha una part que és responsabilitat de qui està utilitzant la ferramenta. Les pistoles són mones o són dolentes? Depèn de com les gastes, no? Has dit que l'escró l'horitzontal és dolent per l'accessibilitat. He entès que l'escró l'horitzontal és dolent per l'accessibilitat. M'hauràs de dir... Les scrós l'horitzontal és inconvenient per a llegir per a qualsevol tipus de persona. Perquè la forma que té el servei de llegir segueixi els patrons. Els patrons, en els quals tu tens una emplada de text, el teu ui va fent parades de fixació, captura la informació, la processa, salta. Si tu tens una línia que no acaba mai, que has d'anar fent scroll, estàs entrant en conflicte amb el mecanisme de lectura. Hi ha persones que tenen dificultats sinerents a l'hora de controlar els moviments oculars. Per tant, seria convenient no abusar de l'escró l'horitzontal. Vale, però hi podria haver excepcions, tu creus? Sí, clar, vull dir. No hi ha receptes universals al 100%. Poden haver excepcions, però si jo et dono llegir el Quijote en una única línia en escró l'horitzontal, m'ha de fer un canvi. Per exemple. Molt interessant la ponència. Gràcies. Veies que l'escró l'horitzontal no és bo, però en cas de mòbil, quan fas zoom, sí que hi ha escró l'horitzontal. És correcte, això, no? Perquè quan fas zoom, la web, un 200%, per nasos, hi ha escró l'horitzontal. Bueno, passa, okay. Amb el versió escritòria sí que no té que haver-hi, no? En escritòria és més difícil justificar que pugui ser acceptable, mòbil. Es pot entendre, es pot entendre. Perfecte, molt sí. Hola, bones. Ja tinc una pregunta, una mica encarata a la gent. Quan utilitza una web amb discapacitat, hi ha sistemes que s'utilitzen al moviment ocular, perquè tenen discapacitat físiques, i llavors, quan tens una web programada que es pugui excedir tota mitjançant el teclat, fa que aquests sistemes permeten utilitzar-la amb el moviment ocular, sigui més fàcil? Depèn de com funciona aquest sistema. Però, en general, les ajudes tècniques d'aquests tipus simulen un teclat. Per tant, si aquest sistema va movent el focus... Sí, estaria bé, estaria bé. Però és molt relatiu, és molt relatiu, de totes formes. L'iTracking també és tot un món, que és tot un món en si mateix. El resum és, si tu fas les coses de la millor forma possible, serà... Conseguiràs una combatibilitat màxima en totes aquelles ferrementes, hardware, i, principalment, software, que esperen complir uns estàndards. Gràcies.De res. Tenim ningú l'auta més, no m'ho puc creure, eh? Això també està clar, però... Com que és un tema tan desconocido, no? Bueno, doncs, si voleu... Tanquem aquí, que si sapigueu que el teniu a la vostra disponibilitat, per si algú ara surt d'aquesta sala, i es troba que té 10 preguntes, doncs el teniu a la sala de ponents, a la vostra disposició d'una estoneta. Moltes gràcies, m'ha encantat. A vosaltres.Gràcies.