accesskey_mod_content

WCAG 2.1 i EN 301-549

  • Escoltar
  • Imprimir PDF
  • Compartir

S'ha desenvolupat i aprovat una nova versió de l'EN 301-549, la  EN 301-549 v2.1.2 (2018-08)(Obri en nova finestra)

Esta nova versió de l'EN 301-549 està alineada amb la versió de les WCAG 2.1 i per tant introduïx tots els nous criteris.

A més, la nova versió de l'EN 301-549 ha sigut declarada el 21 de desembre de 2018 per la Comissió Europea com a estàndard harmonitzat per a l'aplicació de la Directiva d'Accessibilitat Web i per tant és l'estàndard que aplica en les Administracions Públiques espanyoles.

Guia ràpida d'aplicació WCAG 2.1(Obri en nova finestra)

Les WCAG 2.1(Obri en nova finestra) introduïx 17 nous criteris de conformitat, 12 dels quals tenen un nivell de conformitat A o AA. Estos són:

  • Pauta 1.3 Adaptable:
    • 1.3.4 Orientació (AA)
    • 1.3.5 Identificar el Propòsit de l'Entrada (AA)
    • 1.3.6 Identificar el Propòsit (AAA)
  • Pauta 1.4 Distingible:
    • 1.4.10 Reflux (AA)
    • 1.4.11 Contrast sense text (AA)
    • 1.4.12 Espaiat de text (AA)
    • 1.4.13 Contingut en el cursor o focus (AA)
  • Pauta 2.1 Teclat Accessible:
    • 2.1.4 Travesses de tecles de caràcters (A)
  • Pauta 2.2 Temps Suficient:
    • 2.2.6 Temps d'espera (AAA)
  • Pauta 2.3 Convulsions i reaccions físiques:
    • 2.3.3 Animació de les Interaccions (AAA)
  • Pauta 2.5 Modalitats d'entrada:
    • 2.5.1 Gestos del punter (A)
    • 2.5.2 Cancel·lació del punter (A)
    • 2.5.3 Etiqueta en Nom (A)
    • 2.5.4 Accionament de moviment (A)
    • 2.5.5 Grandària objectiva (AAA)
    • 2.5.6 Mecanismes d'entrada simultanis (AAA)
  • Pauta 4.1 Compatible:
    • 4.1.3 Missatges d'estat (AA)

Els nous criteris de conformitat s'inclouen entre les Pautes ja existents excepte para la pauta 2.5 “Modalitats d'entrada”, la qual és una nova pauta introduïda en les WCAG 2.1. Està dedicada específicament a facilitar la interacció a través de diferents dispositius d'entrada més enllà de la interacció mitjançant teclat, especialment des de dispositius mòbils.

Les Pautes d'Accessibilitat per al Contingut Web (WCAG) 2.1 ( Web Content Accessibility Guidelines 2.1(Obri en nova finestra) ) és l'última versió de les pautes d'accessibilitat del contingut en la Web del World Wide Web Consortium (W3C). El 5 de juny de 2018 es va publicar la recomanació definitiva després d'un procés d'elaboració de quasi 10 anys des de la publicació de Web Content Accessibility Guidelines 2.0 l'11 de desembre de 2008.

Entre les novetats que tanca esta nova versió respecte del seu antecessor estan:

  • S'han afegit 17 nous criteris de conformitat (5 nous criteris de conformitat de nivell A, 7 de nivell AA i 5 de nivell AAA)
  • S'han afegit nous termes al glossari
  • S'afig una nova pauta (2.5 "Modalitats d'entrada") al segon principi (Operabilidad), passant de tindre 12 pautes a 13
  • S'afig en l'enunciat del criteri 1.3.3 específicament el color i es lleva en conseqüència la nota del criteri 1.4.1
  • S'afig una nota addicional en el requisit 5.2.2 "Pàgines completes"
  • S'afig un punt addicional en "Components opcionals de la declaració de conformitat" de la secció de conformitat

cal esmentar que esta nova versió no s'han modificat els criteris de conformitat de les WCAG 2.0, ni tan sols la seua numeració.

Les WCAG 2.1 sorgixen amb l'objectiu de millorar l'accessibilitat principalment de tres grups d'usuaris:

  • Persones amb discapacitat cognitiva o de l'aprenentatge
  • Persones amb baixa visió
  • Persones amb discapacitat que accedixen des de dispositius mòbils

Es considerava que les WCAG 2.0 no cobrien com era d'esperar les necessitats de determinats tipus de discapacitats com les cognitives o les necessitats de persones amb baixa visió. Així mateix, en els últims anys les tecnologies i les formes d'accedir al contingut web han variat de forma significativa donant lloc a situacions no contemplades originalment en les WCAG 2.0.

Les WCAG 2.1 pretenen cobrir un major conjunt de recomanacions per a fer la web més accessible. Estes Pautes aspiren a millorar l'accessibilitat del contingut web tant en entorns d'escriptori i portàtils com en tablets i dispositius mòbils.

Sí, les WCAG 2.1 tenen compatibilitat cap a arrere amb les WCAG 2.0.

Les WCAG 2.1 es poden considerar com un superconjunto que conté a les WCAG 2.0. Aquells criteris de conformitat de les WCAG 2.0 que es consideraven millorables han sigut complementats amb altres nous criteris més específics, però sense canviar la redacció original dels requisits originals els quins seguixen sent vàlids. Per tant, com les WCAG 2.1 estenen les WCAG 2.0, no existixen requisits que siguen incompatibles entre una versió i l'altra.

Esta estratègia d'ampliació ajuda a deixar clar que si una pàgina web és conforme a les WCAG 2.1 també serà conforme a les WCAG 2.0. I en sentit contrari, si una pàgina web és conforme a les WCAG 2.0 es podrà actualitzar a les WCAG 2.1 sense incompatibilitats.

Així, per exemple, mentre en les WCAG 2.0 es demanava únicament un contrast suficient entre el color del text i el color de fons (SC 1.4.3) en les WCAG 2.1 el requisit de contrast s'estén també al contingut no textual mitjançant la incorporació d'un nou criteri de conformitat (SC 1.4.11).

No, com s'ha comentat en la pregunta anterior, els criteris de conformitat de les WCAG 2.0 s'han mantingut sense modificar dins de les WCAG 2.1. Podem dir que les WCAG 2.0 estan incloses tal qual dins de les WCAG 2.1.

Les novetats s'inclouen en forma de nous criteris de conformitat, noves definicions per a la seua explicació i un parell de noves consideracions a tindre en compte en els requisits generals de conformitat.

No, la numeració dels criteris de conformitat de les WCAG 2.0, així com el seu nivell de conformitat, es manté sense modificar en les WCAG 2.1. D'igual forma, també es manté la numeració de les tècniques suficients, tècniques complementàries i fallades associades als criteris de conformitat. D'esta forma no és necessari canviar cap de les referències existents a la documentació de les Pautes realitzades des d'informes, guies, ferramentes, etc.

Per a preservar la numeració de les WCAG 2.0 els nous criteris de conformitat s'afigen a continuació dels ja existents en les Pautes corresponents. No obstant açò, esta estratègia d'actualització en la qual no es modifica la numeració té com a conseqüència que en les WCAG 2.1 es perd l'orde dels criteris sobre la base del seu nivell de conformitat dins de cada pauta, on estaven ordenats des del nivell A fins a l'AA.

Així, per exemple, la Pauta 1.4 contenia 9 criteris de conformitat, des de l'1.4.1 de nivell A fins a l'1.4.9 de nivell AAA. En les WCAG 2.1 s'afigen a esta pauta quatre nous criteris continuant amb la numeració existent (1.4.10 fins a 1.4.13) sent tots de nivell AA.

Sí, s'introduïx una novetat important a tindre en compte a l'hora de considerar si una pàgina web és conforme amb les WCAG 2.1 (apartat 5.2).

S'afig una nota addicional en la qual s'indica que perquè una pàgina siga conforme l'ha de ser també en cada variació de la pàgina que es presenta de forma automàtica per a diferents grandàries de pantalla (p. ex. les variacions d'una pàgina web “responsive” o adaptable). Per tant, un lloc web que tinga un disseny web adaptable (Responsive web design) amb diferents maquetacions per a mòbil, tablet i escriptori haurà de complir tots els criteris de conformitat en cadascuna de les seues possibles visualitzacions.

Un dels principals objectius de les WCAG 2.1 és millorar l'accessibilitat de les pàgines web per a les persones amb discapacitat que accedixen des de dispositius mòbils.

Per a aconseguir este objectiu s'han inclòs una sèrie de nous requisits que apunten en eixa direcció. No obstant açò, i en relació directa amb la visualització en dispositius mòbils, el criteri de conformitat 1.4.10 Reflow exigix que el contingut es present sense pèrdua d'informació o funcionalitat i sense necessitat de realitzar scroll en dos dimensions en àrees de visualització reduïdes (320x256 píxels CSS). Si ben este criteri està pensat inicialment per a millorar l'experiència de les persones amb baixa visió assegurant que es puga fer zoom fins a almenys un 400% de la grandària original sense que es produïsca un doble scroll (partint d'una resolució de 1280x1024), en la pràctica i implícitament també suposa que la pàgina s'ha de “adaptar” correctament a diferents grandàries de finestra.

En el propi criteri de conformitat s'indica que permetre el reajustament del contingut es coneix també com a Disseny Web Adaptable (Responsive Web Design) i es considera com la forma més efectiva per a aconseguir complir este criteri. Així, entre les tècniques indicades està l'ús de mitjana queries per a establir punts de ruptura i reformatear el contingut per a diferents amples de visualització. Estos punts de ruptura es disparen d'igual forma tant si es reduïx la grandària de la finestra com si es fa zoom sobre el contingut.

Precisament, s'ha determinat un valor de 320 píxels CSS com a objectiu perquè es considera la grandària mínima raonable per al qual és factible maquetar un lloc web. També s'ha triat este valor perquè coincidix amb l'ample de pantalla més xicotet dels dispositius mòbils més comuns i perquè es correspon amb un zoom de 400% en un navegador d'escriptori amb un ample de finestra de 1280px.

No obstant açò, és important tindre en compte que este requisit contempla com a excepcions aquelles parts del contingut que requerixen d'una presentació i maquetació en dos dimensions para poder transmitir su significado o para poder emplearse de forma correcta.

Dins d'esta excepció es poden incloure les imatges i continguts multimèdia ja que per naturalesa tenen dos dimensions, encara que és possible la seua redimensión fins a adaptar-los a la grandària de la finestra. Una excepció més clara és el cas de les taules de dades, en les quals les relacions entre les cel·les s'establixen en un context bidimensional. Per tant, les taules de dades, especialment les taules de dades complexes, estan fora de l'abast d'este requisit.

Un altre contingut que es pot considerar com una excepció són aquelles interfícies d'usuari complexes com les quals proporcionen barres de ferramentes per a editar continguts que s'han de mostrar simultàniament juntament amb la barra de ferramentes (editors de text, editors gràfics, etc.). D'altra banda, encara que no s'esmente de forma explícita en les WCAG 2.1, es poden considerar també com a excepció els formularis o tràmits de notòria complexitat, tant a nivell d'interacció com de visualització, de manera que no són raonablement operables des de dispositius mòbils.

No, els nous criteris de conformitat a tindre en compte en dispositius mòbils van més enllà d'una correcta maquetació o visualització dels continguts.

Així, el criteri de conformitat 1.3.4 Orientació ens indica que el contingut no pot restringir la seua visualització i funcionalitat a una única orientació de la pantalla (horitzontal o vertical) llevat que aquesta orientació específica siga essencial. Alguns usuaris tenen els dispositius ancorats en una posició fixa (p. ex. sobre una cadira de rodes) i no poden modificar la seua orientació. Per exemple, un usuari amb una tablet ancorada en posició vertical no podria accedir a un lloc web que només es mostrara en posició horitzontal.

El criteri de conformitat 2.5.1 Gestos del Punter indica que tota la funcionalitat que empre gestos multipunto o dependents del traç realitzat també s'ha de poder realitzar emprant un únic punt de contacte i sense traços, mitjançant una pulsació senzilla amb un dit o amb un punter. Per exemple, si és possible fer un gest de pinça amb dos dits per a fer zoom sobre un mapa o un moviment lineal per a desplaçar-se sobre el mateix llavors també ha d'haver-hi un parell de botons que permeten fer zoom i altres botons (p. ex. roda de quatre punts) que permeten el desplaçament. L'objectiu d'este criteri és assegurar que el contingut es pot operar des d'un gran nombre de dispositius d'entrada senzills de manera que les persones amb problemes de mobilitat els puguen realitzar.

El criteri de conformitat 2.5.4 Activació Mitjançant el Moviment indica que qualsevol funcionalitat que es puga operar mitjançant el moviment del dispositiu també s'ha de poder realitzar a través de l'interfície d'usuari i també s'ha de poder desactivar aquesta operació mitjançant el moviment per a evitar accions no desitjades. Açò beneficia a les persones que tenen els seus dispositius ancorats en posicions fixes (p. ex. una cadira de rodes) i no poden interactuar mitjançant el moviment. També s'evita que persones amb problemes de mobilitat executen certes accions accidentalment en realitzar moviments no controlats.

D'altra banda, encara que el contingut es veja correctament en un dispositiu mòbil no s'ha de bloquejar la possibilitat de fer zoom sobre el mateix. Es considera un error emprar, per exemple, elements fique amb “maximum-scale” o “minimum-scale” o bé amb “user-scalable=no” o “user-scalable=0”.

Finalment, i amb un caràcter més general, en el requisit de conformitat Pàgines Completes s'indica que perquè una pàgina web es puga considerar conforme també ha de ser-ho en cadascuna de les seues diferents formes de visualització. És a dir, també s'han de complir tots els criteris de conformitat en cadascuna de les versions de la pàgina web (mòbil, tablet, escriptori, etc.).

En relació als formularis les WCAG 2.1 inclouen algunes novetats importants a tindre en compte.

El criteri de conformitat 1.3.5 Identificar el Propòsit de l'Entrada indica que s'ha de poder determinar automàticament la finalitat d'aquells camps d'introducció de dades que sol·liciten informació sobre les persones. L'objectiu és que les aplicacions d'usuari puguen extraure esta informació i oferir-li-la a les persones en diferents modalitats o ben autocompletar aquesta informació per a facilitar la interacció amb els formularis.

En alguns casos pot paréixer suficient amb els nous tipus d'elements d'HTML5 tipus “tel”, “email”, “password”, etc. No obstant açò, encara que estos camps aporten certa informació sobre la naturalesa del tipus de dada a introduir, les categories que es poden emprar són massa genèriques. Per exemple, servixen per a indicar que un camp es tracta d'un email o un telèfon, però no aclarixen quin és la dada concreta al que es referixen (telèfon o email de l'usuari o d'una altra persona?).

Per tant cal emprar tècniques alternatives com l'atribut “autocomplete” d'HTML 5.2(Obri en nova finestra) i un valor que indique el tipus d'informació sol·licitada(Obri en nova finestra) (p. ex. "name", "honorific-prefix", "given-name", "additional-name", "family-name", ...).

D'altra banda, el criteri de conformitat 2.5.3 Etiqueta en el Nom demana que per als components de la interfície d'usuari que disposen d'una etiqueta textual (o imatge de text) aleshores el seu nom programàtic o nom accessible (etiqueta

Si bé en les WCAG 2.0 només s'exigia un contrast mínim per al contingut textual, incloent el text mostrat en imatges, en les WCAG 2.1 este requisit s'estén també per a aquell contingut no textual la informació visual del qual és necessària per a la seua comprensió o identificació. Així, és necessari assegurar un mínim de contrast en tots els elements visuals necessaris per a reconéixer i identificar els diferents components que formen part de la interfície d'usuari i els seus possibles estats (excepte en el cas dels components inactius). Per exemple, els enllaços, botons, camps de formulari, icones que actuen com a enllaços (no acompanyats de text), l'indicador del focus del teclat, etc.

Este requisit també és aplicable, de forma general, a totes aquelles parts dels continguts gràfics que siguen necessàries per a la seua comprensió. És el cas, per exemple, de qualsevol imatge que transmeta informació com les icones sobre el format de documents o aquells que indiquen estats, identifiquen avisos, accions, xarxes socials, etc. Açò també inclou els diferents elements gràfics que formen part de diagrames, infografies o gràfiques com poden ser les línies, els fons, límits dels objectes, formes, etc., a més del propi text que poguera formar part de les mateixes.

Este criteri de conformitat exigix que si l'usuari ajusta la presentació del contingut a certs paràmetres, no es perda contingut o funcionalitat. Els paràmetres a justar són els següents:

  • Alt de línia: almenys 1.5vegades la grandària de la font.
  • Espai entre paràgrafs: almenys 2 vegades la grandària de la font.
  • Espai entre lletres (tracking): almenys 0.12 vegades la grandària de la font.
  • Espai entre paraules: almenys 0.16 vegades la grandària de la font.

Per a validar este criteri es pot utilitzar el Bookmarklet de Steve Faulkner, disponible en https://www.html5accessibility.com/tests/tsbookmarklet.html

Este criteri de conformitat fa referència al contingut addicional que es mostra quan un element rep o perd el punter (hover) o el focus del teclat (focus), per exemple el menú desplegable que es mostra quan es posa el punter per damunt d'un element. Ha d'existir un mecanisme addicional que permeta descartar el contingut addicional sense necessitat de moure el punter o canviar el focus del teclat.

Quin mecanisme es pot utilitzar per a descartar el contingut addicional sense necessitat de moure el punter o canviar el focus del teclat?

Les opcions que es proposen són l'ús de la tecla ESC o un botó específic per a tancar (el típic botó “X” o “Tancar”), si ben el botó ha de tindre ja el focus en el moment de mostrar-se el contingut addicional perquè no faça faltada desplaçar el focus fins al mateix.

Sempre ha d'existir un mecanisme que permeta descartar el contingut addicional sense necessitat de moure el punter o canviar el focus del teclat?

No, si el contingut addicional que es mostra informa sobre un error en l'entrada de dades o si no tapa o reemplaça un altre contingut, no és necessari oferir aquest mecanisme, ja que no entorpix la visualització de cap contingut.

El contingut addicional que es mostra o oculta la presentació visual de la qual està controlada per l'aplicació d'usuari i no pels desenvolupadors com, per exemple, el tooltip que mostra el contingut de l'atribut title (títol), tampoc està afectat per este criteri.

El criteri si aplica, per exemple a menús desplegables, pop-ups no modals, tooltips personalitzats…

En els components de l'interfície d'usuari (com els camps de formulari, botons, enllaços, controls que es puguen generar mitjançant scripts com sliders, tabs, treeviews…) és necessari que el text visible (que actua com la seua etiqueta i que servix per a reconéixer-los visualment) també forme part del seu nom accessible (usat pels agents o ferramentes d'usuari per a mostrar el contingut a persones amb discapacitat).

Per a complir este criteri s'ha de complir que el Nom accessible siga el contingut de l'etiqueta accessible i opcionalment es pot posar un poc més, però el començament del nom accessible ha de ser idèntic al contingut de l'etiqueta accessible, perquè el que es mostra en pantalla (etiqueta) i el que les ferramentes utilitzen (nom accessible) comence exactament igual.
 

Nom accessible = Etiqueta accessible + [xxxx]

Cada component d'interfície d'usuari té un nom accessible per defecte o bé el nom accessible pot determinar-se usant l'ÀRIA. Si s'usa l'ÀRIA, preval sobre el nom per defecte.

Cada component d'interfície d'usuari té un nom accessible per defecte (contingut de l'element, valor d'un atribut o element associat). A continuació es mostra el nom accessible per defecte per a cada component d'IU:

Component de la IU Nom accessible per defecte
Nom accessible per defecte

Contingut de l'element associat

Valor de l'atribut value=”XXXX”

Valor de l'atribut alt=”XXXX”

Contingut de l'element

XXXX

Contingut de l'element

XXXX

Cal veure el que es mostra per pantalla i veure si coincidix amb el nom accessible.

A continuació es mostren exemples per a aclarir el criteri.

En els següents casos el text que apareix per pantalla i el nom accessible COINCIDIXEN:




               
               
               
               
Buscar

 

En els següents casos el text que apareix per pantalla NO COINCIDIXEN amb el nom accessible:
 

Per pantalla apareix “Go” i el nom accessible és “Find in this site”

 

Per pantalla apareix “Download specification” i el nom accessible és “Download gizmo specification”

Download gizmo specification

 

Per pantalla apareix “Search” i el nom accessible és “find in this site”


               
               
               
               
Find in this site

Material relacionatMaterial relacionat