Lliçó 3 de 10 · 12 min de lectura · Revisada el 26/10/2026
Llegible i predictible: 3.1.x i 3.2.x, inclòs el 3.2.6 Ajuda coherent
Estàs llegint una lliçó oberta. Matricula't per fer els tests i els exercicis, desar el teu progrés i aconseguir el certificat.
Matricula-m'hi · nivell 4 (49 €)El principi Comprensible exigeix que la informació i el funcionament de la interfície s'entenguin. Les seves dues primeres pautes, Llegible (3.1) i Predictible (3.2), solen rebre menys atenció que el contrast o el teclat, però les seves fallades afecten les persones amb discapacitat cognitiva, els usuaris de lectors de pantalla (que depenen de l'idioma declarat) i les persones que necessiten que el web es comporti sempre igual. Aplicarem les definicions de canvi de context, conjunt de pàgines i mateix ordre relatiu que vas veure a la lliçó 2. Aquesta lliçó detalla com avaluar-los, amb el nou 3.2.6 Ajuda coherent de les WCAG 2.2.
3.1.1 Idioma de la pàgina (A)
L'idioma principal de cada pàgina s'ha de poder determinar programàticament: atribut lang a l'element html amb un codi vàlid (es, ca, eu, gl, en). Els lectors de pantalla trien la veu i les regles de pronunciació a partir d'aquest atribut; un lang="en" en una pàgina en castellà fa que NVDA llegeixi el text amb fonètica anglesa, intel·ligible a mitges. Fallades: absència de l'atribut; valor incorrecte heretat de la plantilla; valor no vàlid (lang="español"); en llocs multilingües, l'atribut no canvia en canviar d'idioma. Prova: inspecciona <html lang> a cada pàgina i a cada versió lingüística; escolta l'inici de la pàgina amb el lector.
3.1.2 Idioma de les parts (AA)
Els passatges o frases en un altre idioma s'han de marcar amb lang a l'element que els conté, tret de noms propis, termes tècnics, paraules d'idioma indeterminat i paraules o frases que formen part del llenguatge habitual del text del voltant («software», «online»). On apareix: selectors d'idioma («English», «Français» han de portar el seu lang), cites, títols d'obres, contingut bilingüe en comunitats amb llengua cooficial, interfícies amb textos en anglès sense traduir. Prova: localitza els canvis d'idioma i comprova l'atribut; amb el lector, escolta si la veu canvia.
Exemple
<html lang="es">
…
<ul aria-label="Idioma">
<li><a href="/ca/" lang="ca" hreflang="ca">Català</a></li>
<li><a href="/en/" lang="en" hreflang="en">English</a></li>
</ul>
…
<blockquote lang="en">The power of the Web is in its universality.</blockquote>3.2.1 En rebre el focus (A) i 3.2.2 En introduir dades (A)
Rebre el focus no pot provocar un canvi de context: obrir una finestra, moure el focus a un altre element, canviar de pàgina o reorganitzar el contingut de manera significativa. Canviar una opció d'un control (seleccionar un valor en un select, marcar una casella) tampoc no el pot provocar, tret que se n'hagi avisat abans. Fallades típiques: select de «ves a» que navega en canviar d'opció sense botó; formularis que s'envien en marcar l'última casella; camps que en rebre el focus obren un modal; avançament automàtic al camp següent en completar un dígit (acceptable només si s'adverteix i és predictible). Un desplegable que mostra o amaga camps relacionats sense moure el focus no és un canvi de context. Prova: tabula per tots els controls i canvia valors amb el teclat sense prémer Retorn; observa si alguna cosa salta.
3.2.3 Navegació coherent (AA) i 3.2.4 Identificació coherent (AA)
Els mecanismes de navegació repetits en un conjunt de pàgines apareixen en el mateix ordre relatiu cada vegada, tret que l'usuari iniciï el canvi. Els components amb la mateixa funció s'identifiquen de manera coherent (el mateix nom, la mateixa icona, el mateix alt). Fallades: menú principal amb elements en un ordre diferent segons la secció; cercador a la capçalera en unes pàgines i al peu en d'altres; icona de lupa amb alt «Cerca» en una pàgina i «Ves» en una altra; «Descarrega» davant d'«Obtén el PDF» per a la mateixa acció. Aquests criteris s'avaluen comparant pàgines, així que es completen en acabar la mostra. Nota: «mateix ordre relatiu» permet que en una secció s'afegeixin o es treguin elements, sempre que els comuns conservin el seu ordre.
3.2.6 Ajuda coherent (A) — nou a la 2.2
Si una pàgina d'un conjunt ofereix algun d'aquests mecanismes d'ajuda, ha d'aparèixer en el mateix ordre relatiu respecte a la resta del contingut a totes les pàgines del conjunt que l'incloguin, tret que l'usuari provoqui el canvi: dades de contacte humà (telèfon, correu, horari), mecanisme de contacte humà (xat amb una persona, formulari), opció d'autoajuda (preguntes freqüents, ajuda) i mecanisme de contacte totalment automatitzat (xatbot).
El criteri no exigeix que hi hagi ajuda, ni que sigui a totes les pàgines: exigeix que, quan hi sigui, sigui sempre al mateix lloc relatiu. Està pensat per a persones amb discapacitat cognitiva que necessiten trobar l'ajuda sense haver-la de buscar cada vegada. Prova: a la mostra, localitza els mecanismes d'ajuda de cada pàgina (capçalera, peu, lateral, botó flotant) i compara'n la posició en l'ordre del contingut; és independent del disseny visual exacte, però l'ordre al DOM i la ubicació general han de coincidir. Fallades: xat d'atenció que apareix com a botó flotant a la portada i només al peu a les fitxes; telèfon de contacte que en unes pàgines apareix a la capçalera i en d'altres, al peu (que una pàgina no inclogui un mecanisme d'ajuda no és, per si sol, una fallada).
Punt clau
Els criteris de coherència (3.2.3, 3.2.4, 3.2.6) no es poden avaluar en una sola pàgina: cal comparar almenys dues pàgines del mateix conjunt. Planifica'n l'avaluació com un pas final de l'auditoria, amb la llista de mecanismes de navegació, identificacions i ajudes de cada pàgina de la mostra.
3.2.5 Canvis a petició (AAA)
Encara que és AAA, és útil com a recomanació: tot canvi de context es produeix només a petició de l'usuari, o hi ha un mecanisme per desactivar els automàtics. Les redireccions automàtiques, les actualitzacions periòdiques i les finestres que s'obren soles l'incompleixen.
Com documentar les troballes d'aquestes pautes
Per a 3.1.x, la troballa ha d'incloure el valor de l'atribut trobat i l'esperat, i l'evidència de la veu incorrecta del lector quan sigui rellevant. Per al 3.2.1 i el 3.2.2, descriu l'acció que provoca el canvi (tabular fins a X, canviar l'opció Y) i el canvi que es produeix (navegació, obertura de finestra, pèrdua del focus). Per als criteris de coherència, aporta captures comparades de dues o més pàgines amb l'element assenyalat, i indica a quin conjunt de pàgines pertanyen (tot el lloc, la seu electrònica, l'àrea privada).
Error freqüent
Registrar el 3.2.6 com a fallada perquè el lloc no té una pàgina d'ajuda o un telèfon de contacte. El criteri no obliga a oferir ajuda; només obliga a situar-la de manera coherent quan s'ofereix. L'absència d'ajuda pot ser una recomanació d'usabilitat, no un incompliment de les WCAG.
Prova-ho tu
Obre la seu electrònica del teu ajuntament. Prem Ctrl+U per veure el codi font i anota el valor de lang de l'element html; si hi ha versió en una altra llengua, repeteix-ho allà i revisa si els enllaços del selector d'idioma porten el seu propi lang. Després localitza el telèfon, el formulari de contacte o el xat en tres pàgines diferents i anota si ocupen el mateix lloc relatiu. Ja tens una primera avaluació del 3.1.1, el 3.1.2 i el 3.2.6.
Resum
- 3.1.1:
langvàlid ahtml, correcte a cada versió lingüística; 3.1.2:langen passatges en un altre idioma, inclosos els selectors d'idioma, amb les excepcions de noms propis i termes integrats. - 3.2.1 i 3.2.2: ni rebre el focus ni canviar el valor d'un control no provoquen canvis de context no anunciats; els
selectque naveguen sols són la fallada clàssica. - 3.2.3 i 3.2.4: navegació en el mateix ordre relatiu i identificació coherent dels components al llarg del conjunt de pàgines.
- 3.2.6: els mecanismes d'ajuda (contacte humà, autoajuda, xatbot) ocupen el mateix lloc relatiu a totes les pàgines que els inclouen; no obliga a tenir ajuda.
- Els criteris de coherència s'avaluen comparant pàgines al final de la mostra, amb captures comparades com a evidència.
Portes 5 lliçons d'aquest curs: que no es perdin
Crea el teu compte i desa el que ja has llegit i segueix el curs amb tot:
- El test d'aquesta lliçó (3 preguntes) per comprovar el que has après
- Exercicis pràctics amb pàgines reals
- El teu progrés desat: continues on ho vas deixar, des de qualsevol dispositiu
- Constància del curs amb les hores i certificat del nivell 4 quan aprovis l'examen
Entres amb el teu compte de Google o només amb el teu correu electrònic. No cal contrasenya.
Matricula-m'hi · nivell 4 (49 €)