accesskey_mod_content

Navegació, llenguatge i comprensió

  • Escoltar
  • Imprimir PDF
  • Compartir

El text dels enllaços ha d'indicar clarament quin és el seu propòsit, el contingut o informació que es troba en el document de destinació. Els enllaços del tipus “clic aquí” no són significatius i no descriuen la seva destinació.

Sempre que sigui possible, s'ha de procurar que els enllaços siguin prou clars quan es llegeixin fos del seu context ja que els usuaris de lectors de pantalla naveguen amb el tabulador saltant d'enllaç en enllaç o extreuen el llistat d'enllaços d'una pàgina, de manera que si el text no és descriptiu no aportarà informació sobre el seu propòsit.

En cas de necessitar algun tipus d'informació addicional podrà ser afegida per mitjà de l'atribut title, el quin contindrà tot el text de l'enllaç a més d'aquesta informació addicional. També es podrà incloure la informació addicional com una part oculta del text de l'enllaç mitjançant una tècnica d'ocultació amb CSS accessible (per exemple, posicionament absolut fora de la pantalla).

Excepcionalment, quan el text de l'enllaç no és descriptiu per si mateix, almenys ha de ser-ho mitjançant el seu context més immediat. S'entén per context immediat aquells elements que un lector de pantalla pot obtenir a partir de l'enllaç com el text de la frase, el paràgraf, l'encapçalat, la cel·la de taula o l'element de llista que conté a l'enllaç.

Si el vincle enllaça amb un document adjunt es podrà mostrar el format del mateix en el propi text de l'enllaç, mitjançant una icona representativa d'aquest format amb el corresponent text alternatiu i a l'atribut title. És recomanable a més indicar la grandària dels documents adjunts perquè els usuaris puguin decidir si els descarreguen o no.

S'hauria d'evitar que els enllaços obrin noves finestres del navegador, però en el cas que no es pugui evitar es informar d'això a l'usuari seguint les normes dictades en la resposta a la pregunta Com s'informa de l'obertura de nova finestra en un enllaç?

Finalment, l'estil dels propis enllaços haurà de permetre que l'usuari els identifiqui adequadament, distingint-los fàcilment de la resta dels continguts dels documents

Encara que sigui un requisit per a un nivell de conformitat AAA, és recomanable especificar l'expansió de cada abreviatura o acrònim, mitjançant els marcadors HTML adequats. A més, la forma expandida de l'abreviatura o acrònim s'hauria d'indicar expressament en el text de la pàgina la primera vegada que s'empri.

Un acrònim és un conjunt de lletres format per les inicials d'altres paraules, per exemple, URL (Uniform Resource Locator). Els acrònims es marcar mitjançant l'element acronym i la seva expansió mitjançant l'atribut title de l'element.

Una abreviatura és la representació escrita d'una o diverses paraules mitjançant una o diverses de les seves lletres, a fi que la paraula o paraules en qüestió resultin més curtes en el text. Les abreviatures es marquen mitjançant l'element abbr i la seva expansió mitjançant l'atribut title de l'element.

Exemple de codi per a un acrònim

ONU


Exemple de codi per a una abreviatura

Avd

 

En el cas que la gramàtica emprada sigui HTML5 es pot emprar sempre l'element ABBR tant per marcar abreviatures com a acrònims ja que l'element ACRONYM passa a considerar-se obsolet.

Si en un document existeix algun extracte en un idioma diferent a l'utilitzat en el contingut general del mateix, s'han de realitzar les següents accions:

  1. Asegurarse de que está correctamente marcado el idioma principal de la página.
Exemple de codi HTML
 

  

  1. Marcar el contingut que es trobi en un altre idioma, mitjançant els atributs HTML amb el codi d'idioma corresponent. 
Exemple de codi HTML

A les 14:00 hores està previst un meeting a la plaça.
A les 14:00 hores està previst un meeting a la plaça.

  

  1. Opcionalment, si es tracta d'un enllaç a una pàgina que es troba en un altre idioma, es recomana utilitzar l'atribut hreflang de l'enllaç per indicar aquest canvi d'idioma.
Exemple de codi CSS
Guia d'HTML en anglès

 

Per ampliar la informació sobre els codi d'idioma disponibles es recomana consultar la llista de codis d'idioma (font: Iana)(Obre en nova finestra)

Un document que posseeixi diversos enllaços amb el mateix text les destinacions del qual són diferents podrà desorientar als usuaris. El text d'aquests vincles no serà prou clar com per identificar la destinació de cadascun dels enllaços llegits fora de context. Això és un problema especialment per als usuaris que utilitzen lectors de pantalla, ja que trobaran dificultats si decideixen realitzar una navegació a través dels enllaços del document.

En el cas que es desitgi que visualment hi hagi diversos enllaços que posseeixin el mateix text es recomana ocultar mitjançant tècniques accessibles la part del text de l'enllaç que ho distingeix dels altres.

En les WCAG 2.0 l'obligatorietat d'avisar de l'obertura de noves finestres o pestanyes del navegador passa a ser un requisit d'AAA, encara que segueix sent una bona pràctica i es recomana el seu ús ja que millora tant l'accessibilitat com la usabilitat de la pàgina.

Les possibles formes d'informar sobre l'obertura de noves finestres variaran depenent de la situació en la qual ens trobem.

Per als enllaços de text:

  • En el text del propi enllaç:
Exemple de codi
Text del vincle (s'obre en finestra nova)

 

  • Aportant un element gràfic ( ) que indiqui a l'usuari visualment (i a través de la seva alternativa) l'obertura de nova finestra:
Exemple de codi
Text del vincle S'obre en finestra nova

 

  •  Una altra possible solució consisteix a incloure el text "S'obre en nova finestra" al propi enllaç, mostrant-ho a manera de tooltip mitjançant tècniques CSS quan es fixa el focus sobre l'enllaç.

 Per als enllaços gràfics:

  • Com a text de l'enllaç, o bé, aportant un element gràfic ( ) que indiqui a l'usuari visualment ( i a través de la seva alternativa) l'obertura d'una nova finestra.
  • Aportant la informació d'obertura en nova finestra  en el contingut de la imatge. Per a això es pot incloure l'element gràfic d'obertura dins de la pròpia imatge, indicant a l'usuari visualment i a través de la seva alternativa la nova obertura de nova finestra.
  • Una altra possible solució consisteix a incloure el text "S'obre en nova finestra" al propi enllaç i mostrar-ho a manera de tooltip mitjançant tècniques CSS en fixar el focus sobre l'enllaç.

 

Quan el contingut complet d'un lloc web no es pot incloure en els menús de navegació, s'ha de proporcionar un Mapa Web o una funció de cerca dins del lloc per facilitar als usuaris trobar el contingut.

Perquè un mapa web sigui correcte ha d'incloure enllaços a totes les seccions i pàgines importants del lloc web. A més, el mapa web ha d'estar enllaçat, almenys, des de cadascuna de les pàgines que es llisten en el mapa web encara que es recomana incloure un enllaç al mapa web des de totes les pàgines del lloc web. Finalment, totes les pàgines del lloc web han de ser accessibles, directa o indirectament, des del mapa web.

La presentació i l'estructura del mapa web han de reflectir l'organització del lloc web. Per a això s'usaran els elements estructurals de forma adequada. Així, per exemple, es podran usar encapçalats, llestes, llistes niades o una combinació de les anteriors sempre que l'estructura del mapa coincideixi amb la del lloc web.

 Així mateix, l'ordre de lectura i l'ordre de tabulació pel mapa web ha de ser el correcte.

Les pautes d'accessibilitat no defineixen el conjunt de metadades mínim que ha d'incloure's en una pàgina web, excepte el títol de la pàgina, però les metadades es poden usar per complir alguns dels requisits d'aquestes pautes.

Així, totes les pàgines hauran d'incloure un títol, element TITLE, que de forma breu identifiqui el contingut de la pàgina i tingui sentit quan es llegeixi fos del seu context. Encara que no sigui necessari, és recomanable que en el títol de la pàgina s'inclogui també el nom del lloc web. D'igual forma, també es recomana que els títols siguin únics per a totes les pàgines del lloc web. En tot cas, el títol de les pàgines ha de tenir relació amb el seu contingut de manera que aquest es pugui identificar clarament a partir del títol.

Altres metadades que es poden usar per complir altres requisits de les pautes són:

  • Declaració de tipus del document (DOCTYPE) per facilitar que els navegadors i altres aplicacions d'usuaris reconeguin la gramàtica usada a les pàgines web.
  • La codificació de caràcters (encoding) per evitar que es produeixin inconsistències entre navegadors en la interpretació dels caràcters especials continguts a la pàgina.
  • Atributs title per proporcionar etiquetes descriptives quan sigui necessari. Per exemple, per identificar el contingut dels marcs, per descriure la funció dels camps de formulari que manquen d'una etiqueta visible, per aportar informació addicional als enllaços, etc.