Entre un 15 i un 20% de la població tenim algun tipus de diversitat funcional, sigui permanent o temporal. La web no ha de ser una barrera per ningú, en cap context d'ús.

1. Què és l’accessibilitat?

Accessibilitat web és garantir que totes les persones independentment de

si tenen diversitats funcionals...

  • visuals
  • auditives
  • físiques
  • cognitives
  • neurològiques
  • o de la parla

o del seu context...

  • els dispositius o navegadors que facin servir
  • el lloc o les circumstàncies on consultin la web

puguin…

  • percebre
  • entendre
  • navegar
  • i interactuar amb la web

 

Això vol dir que la web no ha de ser una barrera en cap d'aquestes situacions:

  • diversitat funcional:
    • sóc invident,
    • no distingeixo bé els colors,
    • necessito ulleres,
    • m'he trencat un braç i no puc fer servir el ratolí,
    • tinc poc coneixement de la llengua,
    • tinc dificultats per entendre i utilitzar la tecnologia,
    • tinc dificultats d'audició,
    • etc.
  • context:
    • consulto la web o faig una gestió en un mòbil,
    • tinc un dispositiu molt antic,
    • faig servir un lector de pantalla o un traductor a sistema Braille,
    • navego amb un dispositiu monocrom,
    • la connexió a la xarxa és lenta o intermitent,
    • hi ha molta o molt poca il·luminació,
    • vaig en metro sense auriculars i no puc sentir el so d'un video o un podcast,
    • vaig a l'autobús i només puc fer servir una mà per consultar la web al mòbil,
    • m'he oblidat les ulleres,
    • estic fent una gestió a la web mentre preparo el sopar, 
    • necessito consultar una indicació mentre vaig conduint,
    • etc.

 

2. Per què ha de ser accessible la meva web?

Les millores d’accessibilitat beneficien a tothom. Fent servir un símil arquitectònic, quan s'instal·la una rampa d’accés per a persones amb mobilitat reduïda, tothom acaba utilitzant la rampa en lloc de les escales.

2.1. Perquè és beneficiós per a tothom: per a tu i per als teus usuaris

Una bona accessibilitat:

  • ajuda l'usuari a orientar-se dins la web i li permet comprendre fàcilment com està estructurada i què ha de fer en cada moment, la seva experiència d'usuari serà, per tant, més profitosa.
  • fa que la teva informació arribi a un ventall més ampli d’usuaris potencials
  • millora el posicionament de la web a Google i altres cercadors: el robot de Google actua, a tots els efectes, com una persona cega. Una persona cega multimilionària amb desenes de milions d’amics que estan pendents de cada paraula que diu.

i, en conseqüència:

  • el teu missatge serà més clar i arribarà a més gent
  • si ofereixes un servei, es reduirà el nombre de consultes o de dubtes que hauràs de resoldre
  • la informació ben estructurada i ordenada et serà molt més fàcil d'actualitzar
  • millorarà la imatge pública de la teva web i conseqüentment de la unitat o servei que representa

 

2.2. Què diu la llei?

Com a institució pública, la UPF ha de complir el mandat del Real Decreto 1112/2018, de 7 de septiembre, sobre accesibilidad de los sitios web y aplicaciones para dispositivos móviles del sector público, que estableix l’obligatorietat de comprometre’s a fer accessibles la seva web institucional i totes les webs que en formen part.

A més, s’estableix que entre el 2025 i el 2030 han de ser accessibles no només les pàgines web sinó també els documents (per exemple els PDF), les apps i els llibres electrònics entre d’altres.

 

3. Com aconsegueixo que la meva web sigui accessible? 

Pensant sempre en l'usuari i pensant en l'accessibilitat des de bon començament: és molt més fàcil fer un contingut accessible si hi pensem des de l'inici que "reparar" l'accessibilitat d'un contingut que està mal concebut.

Les plantilles de la web han estat revisades per tal que tots els components, les navegacions i els elements comuns de la web institucional siguin accessibles. Tanmateix calen unes petites actuacions per part teva a l’hora d’editar els continguts per garantir que aquests arribin a tothom.

 

Enllaços

El text dels enllaços ha de ser clar i curt, i tenir sentit quan es llegeix fora de context. 

Consells:

  • No utilitzis “Fes clic aquí”, “trobaràs la informació en aquest enllaç”
  • Evita els textos genèrics en una mateixa pàgina com ara “Més informació”, “Documentació”.
  • No posis la URL de l’enllaç com a text de l’enllaç.
  • Sigues prudent a l’hora de fer enllaços: cada enllaç ha de ser significatiu perquè l'atenció de l’usuari tendeix a fixar-se principalment en el text ressaltat de l'enllaç i a no llegir la resta.

 

Jerarquia i format del text

El format del text ve donat pels fulls d’estil i la plantilla de la web i per tant no s’ha de modificar ni la mida, ni el color ni el tipus de lletra. 

Organitza la informació dels continguts amb els estils establerts per dotar la pàgina d’una estructura consistent i que en faciliti una lectura no necessàriament seqüencial.

Consells:

  • Si copies text des d’una altra font, cal enganxar-lo fent servir la funció “text pla” de l’editor per evitar importar estils externs a la teva web. 
  • Utilitza correctament els títols i subtítols, així dones idea de com està organitzat el contingut.
  • Escriu textos ben estructurats i fes servir llistes per agilitzar la lectura.
  • Fes servir els estils adequats. Cal evitar el subratllat per no confondre’l amb un enllaç.

 

Imatges

Evita les imatges amb text (cartells, infografies, esquemes) perquè no es veuen bé amb dispositius mòbils ni són accessibles. Si cal mantenir-les, has de repetir el text de la imatge en un contingut textual. 

Utilitza el text alternatiu per a descriure la funció dels elements visuals. D’aquesta manera permets un bon accés als usuaris amb deficiències visuals i també a aquells usuaris amb connexions lentes, ja que així no els cal esperar la càrrega completa de les imatges per comprendre el contingut de la pàgina.

Consells:

  • Quan insereixes la imatge, incorpora el text a la casella o espai “text alternatiu” del teu editor.
  • Si la imatge és decorativa posa-hi un espai en blanc com a text alternatiu alt=" ".
  • Si la imatge és rellevant per la informació que s'està mostrant posa-hi un text descriptiu: “Interior de la Biblioteca del campus del Poblenou de la UPF”, "Vista frontal del Manuscrit jaina en hindi".
  • No cal posar “Fotografia de” o “Imatge de” perquè els lectors de pantalla ja interpreten que és una imatge. Si diem “Foto d’un llibre” el lector llegirà “Imatge, foto d’un llibre”.
  • Si fas servir una imatge amb enllaç (un botó, una fletxa) cal que a la descripció s’expliqui l’acció, per ex. “Accedeix al formulari d'inscripció”, “Puja l'arxiu”.

 

Taules

Evita les taules per organitzar el text en columnes. Només s’han de fer servir per presentar dades.

Les taules són especialment problemàtiques per als usuaris amb visibilitat reduïda o ceguesa.

Consells:

  • Abans de fer una taula, explora altres possibilitats per presentar la informació.
  • Si has de fer una taula, segueix escrupulosament les instruccions de la guia.

 

Documents en PDF

Els PDF són adequats per a determinats tipus de documents tancats (memòries, informes) perquè se’n manté el format i el contingut de manera fixa, tant si hi ha text com gràfics i imatges i independentment del navegador.

Cal ser prudents: recorda que la teva web no és tant un repositori de tot el que fas com un aparador del que ofereixes. 

És important preparar prèviament de manera adequada el document a partir del qual es genera el PDF i també revisar tots els PDF publicats a la teva web per comprovar que són accessibles. Un document és un mini producte en si mateix i totes les directrius d'accessibilitat s'apliquen també dins de cadascun dels documents.

Consells:

  • Posa un títol descriptiu al document, que l’identifiqui fora de context. Evita els títols genèrics com ara “Horaris del curs” perquè poden ser de qualsevol curs i de qualsevol cosa, cal ser especificar-los tant com es pugui: “Horaris del màster X per al curs 2019-2020”.
  • Segueix les mateixes indicacions sobre imatges, enllaços, jerarquia i format del text, taules que s'estableixen per als continguts web. 
  • Indica l’idioma en el qual està presentat el document per tal que els lectors puguin triar-lo.
  • Si és un document extens, crea un sumari amb marcadors per tal de permetre la navegació pel document.

 

Vídeos i àudios

Els arxius de vídeo i de so han de tenir alternatives per a la lectura de persones amb problemes de visió o d’escolta, com són la transcripció dels diàlegs i la descripció dels sons.

Consells:

  • Afegeix subtítols que es puguin activar o desactivar. Els subtítols han de ser arxius independents respecte dels vídeos, per tal que els programes lectors els puguin recuperar.
  • Inclou transcripcions de diàlegs, veus en off i altres elements contextuals (sons de fons, etc.)
  • Pensa que hi ha persones que fan servir els subtítols per veure vídeos, ja sigui perquè no s’hi veuen o perquè hi ha massa soroll en el seu entorn o perquè es connecten des d‘un lloc on no es pot fer soroll i no disposen d’auriculars.

 

iframes

Els elements <iframe> són continguts html marc en línia, és a dir, contingut incrustat en una pàgina, generalment dinàmic, com poden ser vídeos de YouTube, infografies, aplicacions web o altres. Aquests contingut també ha de ser accessible en el seu propi codi.

Una de les principals recomanacions per tal que l’iframe sigui accessible és que contingui l’atribut <title> per explicar el contingut que es mostra.

 

4. Com comprovo si la meva web és accessible?

Existeixen moltes eines per analitzar l'accessibilitat de la web, però les eines ni ho detecten tot, ni tot el que detecten és necessàriament un problema. El què és important és que hi pensem sempre i si no ho tens clar ens contactes a través del CAU i ho examinem junts.

5.Per saber-ne més...

Introduction to Web Accessibility and W3C Standards (4 min.)

Webinar (28 min.) i entrada de blog Fer els serveis acessibles i no morir en el intent. És molt didàctic, amb guies, normatives i altres materials.

Guia d'accessibilitat de la Generalitat de Catalunya

Guia d'accessibilitat de la Generalitat de Catalunya. Guia molt completa amb tots els detalls tècnics per identificar i resoldre els problemes d'accessibilitat.

Observatorio de accesibilidad web del gobierno de España

Observatorio de Accesibilidad Web. Portal de l’Administració Electrònica del Govern espanyol. És la web de l'òrgan responsable d'assegurar el compliment de les directrius d'accessibilitat a l'Estat Espanyol.