Enlaces para ir a una sección determinada Accessibilitat Digital

Ir a contenido Ir a Estudios, Gobernanza y organización
Logo UA
Realizar búsqueda
Menú
Altres llocs
Logo Accessibilitat Digital   Accessibilitat Digital
Accessibilitat Digital

Enlaces para ir a una sección determinada

Un dels problemes més greus que troba una persona que accedeix amb un lector de pantalla és la informació que apareix de forma seqüencial i no hi ha forma de situar-nos en un punt concret "d'una ullada".

Una forma senzilla d'entendre-ho és veure l'estructura de les pàgines de la UA que solen tenir aquesta forma:

Visualment queda molt clara l'estructura i ens dirigim, en general, al contingut. Però una persona que accedeix amb un lector de pantalla, ha de recórrer tots els elements anteriors al contingut per a arribar a aquest. Açò significa que consulta la capçalera, la barra, el menú i els anuncis. La primera vegada que accedeix és possible que puga ser molt interessant per a tenir una idea global del lloc al que ha accedit, però si torna a accedir o si selecciona una opció del menú. Es torna a repetir la mateixa història.

Una solució molt senzilla consisteix a incloure enllaços a cadascuna de les seccions o que permeta saltar les opcions menys importants o que es repeteixen en totes les pàgines.

Si per exemple volem saltar tota la zona d'idiomes

Saltar idiomes

 

...

 

 

...

 

La destinació de l'enllaç no és una altra pàgina, sinó que és algun element de la nostra pàgina, normalment una etiqueta

.

En el nostre exemple en utilitzar l'enllaç, el focus se situa en la barra d'icones i no llegirà el contingut de la barra d'idiomes. A més, hem inclòs la classe per a ocultar l'enllaç i solament siga ha accedit pels lectors de pantalla.

Amb aquesta tècnica hauríem de saltar les dues o tres seccions anteriors al contingut per a poder accedir a aquest. És una millora notable però encara podem afinar-ho una mica més.

És una tècnica imprescindible incloure al començament de la nostra pàgina web un enllaç per a anar directament al contingut principal, permetent així, a l'usuari un mètode amb el qual navegar pel nostre lloc d'una forma més còmoda, ja que una vegada coneguda l'estructura podrà usar aquest enllaç per a moure's per les nostres pàgines amb major rapidesa.

Anar al contingut


...

 


...

 


...

 


Contingut principal

Recordeu que Bootstrap ens ofereix la classe sr-only i la podem utilitzar en comptes d'ocultar-visualment2, obtenint el mateix resultat:

Anar al contingut

Si a més volem que en rebre el focus l'enllaç es mostre visualment Bootstrap ens proporciona la classe sr-only-focusable.

Anar al contingut