Les pàgines web utilitzen enllaços per facilitar als visitants contingut nou o addicional. Els enllaços poden ser text i imatges. Els enllaços són eines de navegació poderoses i s'han d'estructurar adequadament per proporcionar la millor experiència possible.

Les pautes d'accessibilitat a contingut web (Web Content Accessibility Guidelines, WCAG) són requisits específics definits per garantir que el contingut és accessible per a tothom. D'acord amb les pautes WCAG 2.2 AA, els enllaços han d'indicar amb quina finalitat es proporcionen, perquè els visitants puguin decidir si els interessa seleccionar-lo o no. Els enllaços han de tenir text discernible per indicar als visitants on se'ls portarà quan els seleccionin.

Què és el text discernible?

Els enllaços normalment tenen dos peces d'informació:

  • URL: Adreça web a la qual l'enllaç envia els visitants quan el seleccionen
  • Text de visualització: Text visible que indica als visitants què poden esperar trobar en seleccionar l'enllaç

Considereu aquestes pràctiques recomanades d'enllaços: Pràctiques recomanades per als enllaços. En el codi font HTML, l'enllaç de les pràctiques recomanades serà així:<a href="#best-practices">Best practices for links</a>

Quan hi manca el text de visualització, o el text entre les etiquetes <a>, l'enllaç no té text discernible. El text discernible és el text de visualització que indica als visitants la finalitat de l'enllaç.

El fet que els enllaços no tinguin text discernible suposa un problema menor. Els problemes menors s'han de corregir per millorar l'experiència. Els enllaços on manca text o el text és vague poden fer que la navegació sigui més confusa i causar frustració a les persones amb discapacitats.

Com utilitzen els enllaços les persones amb discapacitats, enllaç al final de la pàgina

Ally us ajuda a identificar els enllaços als quals els manca text i us explica com corregir-los. Ally fa aquestes comprovacions:

  • Hi ha text entre les etiquetes d'enllaç <a>?
  • El text entre les etiquetes <a> està amagat?
  • Les imatges que s'utilitzen com a enllaços tenen descripcions alternatives?

Si l'enllaç no passa alguna de les comprovacions, Ally marca l'enllaç com un problema.

Utilitzar Ally per trobar els enllaços als quals els manca text

Utilitzeu l'Informe d'accessibilitat d'Ally per detectar i corregir problemes d'accessibilitat al vostre lloc web. Utilitzeu l'enllaç proporcionat per a l'informe i inicieu la sessió. Obriu l'informe i consulteu la llista de problemes a la taula Problemes d'accessibilitat.

La taula Problemes d'accessibilitat es mostra a les pestanyes Resum i Domini. Comenceu a la pestanya Domini per veure els problemes específics d'un domini.

Els enllaços als quals els manca text discernible es marquen com un problema lleu. Utilitzeu la pestanya Lleu de la taula Problemes d'accessibilitat per veure la llista de problemes lleus. Seleccioneu els problemes amb enllaços que no tenen text discernible.

Si comenceu a la pestanya Resum, seleccioneu el problema i, a continuació, el domini on hi ha el problema.

A la llista de problemes de títols del domini, seleccioneu l'indicador de puntuació al costat d'un element que tingui aquest problema. S'obre el tauler de comentaris de l'editor de contingut.

Visualització prèvia dels enllaços on falta text

El tauler de comentaris d'Ally us mostra una vista preliminar del contingut, així com comentaris detallats i ajuda per solucionar els problemes d'accessibilitat. Utilitzeu la vista preliminar per veure els enllaços als quals els falta text.

La vista preliminar mostra les parts del document on hi ha problemes d'accessibilitat específics. La vista preliminar mostra tots els casos d'un tipus de problema cada vegada. Per exemple, per al problema dels enllaços on falta text, la visualització prèvia destaca tots els casos en què hi ha aquest problema concret.

Eines de la visualització prèvia

Feu servir les eines de la vista preliminar per explorar els problemes del document.

  • Desplaceu-vos per la vista preliminar pàgina a pàgina.
  • Comproveu quantes vegades apareix un problema concret.
  • Desplaceu-vos pels casos destacats del problema.
  • Oculteu o mostreu els casos destacats.
  • Apropeu o allunyeu el contingut de la visualització prèvia.
  • Si el problema és en un document adjunt, baixeu el fitxer original.

Seguir la guia pas a pas d'Ally per afegir text d'enllaç

Ally dona per suposat que teniu coneixements bàsics d'HTML i sabeu com utilitzar el sistema de gestió del contingut (Content Management System, CMS). Per seguir la guia pas a pas, heu de saber editar una pàgina web al codi HTML o codi font del CMS.

Junt amb la vista preliminar, Ally us ofereix una guia pas a pas per corregir el problema. Ally organitza els comentaris en arbre de decisions. Llegiu les indicacions i responeu el que se us va demanant. Obteniu informació sobre quin és el problema, per què és important i com el podeu corregir correctament.

Seleccioneu Com corregir el text dels enllaços per seguir les indicacions pas a pas.

Maneres d'afegir text als enllaços

Hi ha més d'una manera de corregir el text dels enllaços de les pàgines web.

  • HTML: La guia pas a pas d'Ally us indica com trobar i corregir el text dels enllaços al codi HTML. Bàsicament, es tracta de trobar la pàgina web on hi ha l'enllaç. Editeu la pàgina. Al codi HTML, afegiu text entre les etiquetes <a>. Desar la pàgina.
  • RTE: Alguns CMS tenen un editor de text enriquit (Rich Text Editor, RTE) que pot proporcionar maneres fàcils de corregir els enllaços. Localitzeu l'enllaç a la pàgina web. Seleccioneu l'enllaç i feu servir les eines del CMS per afegir-hi text. Desar la pàgina.

Visiteu w3schools per obtenir més informació sobre HTML i CSS

Pràctiques recomanades per als enllaços

  • El text dels enllaços ha de ser significatiu. Informeu els visitants sobre on els portarà un enllaç. Descriviu què pot esperar trobar l'usuari si selecciona l'enllaç.
    • Eviteu fer servir text com ara “feu clic aquí” o “més informació”. Aquestes frases no informen els visitants sobre què poden esperar trobar en seleccionar l'enllaç. Algunes tecnologies d'assistència tenen una eina que mostra una llista dels enllaços que hi ha en una pàgina. Frases com aquesta no aportaran res quan es treguin de context i es mostrin en forma de llista.
    • Eviteu utilitzar l'adreça URL com el text visible de l'enllaç. Les adreces URL no sempre són descriptives. A més, els lectors de pantalla llegeixen les lletres de les adreces URL d'una en una, cosa que pot ser decebedora per als visitants.
  • El text dels enllaços ha de ser únic. Cada enllaç ha de ser únic dins de la pàgina. Repetir text en els enllaços pot causar confusió quan s'extreuen del contingut de la pàgina i es mostren com a l'eina de llista d'enllaços.
  • Els enllaços han de destacar visualment. Ha de ser evident que són enllaços. Si no us agrada l'estil de l'enllaç, podeu actualitzar la plantilla.
    • Distingiu els enllaços del text del voltant sense basar-vos només en el color. WCAG 2.1 - 1.4.1

      L'aspecte de l'enllaç sovint està definit a la guia d'estil del lloc i pot reflectir la personalització de marca. Abans de fer-hi canvis, consulteu la guia d'estil del lloc i comenteu-ho a l'administrador del lloc.

  • Aviseu els usuaris si l'enllaç s'obre en una finestra nova. Obrir els enllaços en una finestra nova pot produir desorientació. Aviseu els usuaris si els envieu a una finestra o pestanya nova.
  • No feu servir una imatge per representar una cosa que podeu crear en el codi HTML. Per exemple, no feu servir una imatge d'un botó en lloc d'un botó real. No feu servir una imatge d'una taula en lloc d'una taula creada en el codi font HTML.

Com utilitzen els enllaços les persones amb discapacitats

Els enllaços adequats que contenen un enllaç i un text d'enllaç significatiu proporcionen una experiència molt millor a tothom. Els enllaços ben formats són eines de navegació poderoses i deixen clar què es pot esperat. No obstant això, els enllaços adequats són essencials per als visitants amb deficiències visuals.

Els enllaços que tenen text únic i significatiu poden voler dir una navegació ràpida per a molts usuaris.

  • Els usuaris de lectors de pantalla no cal que escoltin tota la pàgina. En lloc d'això, poden optar per escoltar i interactuar amb una llista d'enllaços.
  • Els usuaris de tecnologies de reconeixement de la parla interactuen amb els enllaços dient en veu alta el text de l'enllaç que volen seleccionar.

Els enllaços que estan ben formats poden ser més fàcils de veure i d'interactuar-hi per a molts usuaris.

  • Els usuaris només de teclat, que pot ser que no puguin fer servir un ratolí, poden navegar als elements de la pàgina com els enllaços mitjançant el teclat.
  • Els usuaris daltonians pot ser que no vegin una variació de color, però sí que poden veure un enllaç subratllat.