Accessibilitat Web

A continuació es mostren una sèrie de consells en funció de l'activitat a què es refereixen: el disseny, la creació de continguts i el desenvolupament.

Disseny accessible

  • Proporcioneu un contrast suficient entre el primer pla i el fons.
  • No utilitzeu només el color per transmetre informació.
  • Assegureu-vos que els elements interactius siguin fàcils d'identificar: botons i enllaços.
  • Proporcioneu opcions de navegació clares i coherents: capçaleres, molles de pa, mapes.
  • Assegureu-vos que els elements del formulari inclouen etiquetes associades clarament.
  • Proporcioneu feedback fàcilment identificable: icones, colors, etc.
  • Utilitzeu els encapçalaments i l'espaiat per agrupar contingut relacionat: faciliteu la comprensió.
  • Creeu dissenys per a diferents mides de visualització: responsivitat al mòbil.
  • Incloeu alternatives d'imatge i mitjans al vostre disseny: textos, captions, etc.
  • Proporcioneu controls per al contingut que s'inicia automàticament: als carrousels, sliders, vídeos, so de fons, etc.

Contingut accessible

  • Proporcioneu títols de pàgines informatius i únics.
  • Utilitzar els encapçalaments (i subencapçalaments) per transmetre significat i estructura.
  • Fes que el text de l'enllaç tingui significat: evita el "clica aquí".
  • Escriu alternatives de text significatives per a imatges que tinguin una funció (no per a les decoratives).
  • Crea transcripcions i subtítols per a multimèdia.
  • Proporcioneu instruccions clares: a les instruccions, guies i als missatges d'error. Sense utilitzar llenguatge tècnic.
  • Mantingueu el contingut clar i concís.

Desenvolupament accessible

  • Associa una etiqueta a cada control de formulari (label for).
  • Incloeu text alternatiu per a les imatges (alt).
  • Identificar l'idioma de la pàgina i els canvis d'idioma (html lang).
  • Utilitzeu les marques per transmetre significat i estructura: HTML semàntic com section, article, aside, ul, etc.
  • Ajudeu els usuaris a evitar i corregir errors: indicar on hi ha el problema, explicar-ho i suggerir correccions.
  • Reflecteix l'ordre de lectura en l'ordre del codi: evita que el CSS sigui qui marqui aquest ordre.
  • Escriu codi que s'adapti a la tecnologia de l'usuari: responsivitat.
  • Donar significat als elements interactius no estàndard: utilitza WAI-ARIA.
  • Assegureu-vos que tots els elements interactius siguin accessibles amb el teclat.
  • Eviteu CAPTCHA sempre que sigui possible.