{"id":25004,"date":"2024-03-19T14:56:26","date_gmt":"2024-03-19T13:56:26","guid":{"rendered":"https:\/\/projectes.xtec.cat\/digital\/?page_id=25004"},"modified":"2024-10-12T20:26:03","modified_gmt":"2024-10-12T18:26:03","slug":"accessibilitat","status":"publish","type":"page","link":"https:\/\/projectes.xtec.cat\/digital\/serveis-digitals\/nodes\/consells-per-una-bona-comunicacio\/accessibilitat\/","title":{"rendered":"Accessibilitat"},"content":{"rendered":"\n
<\/div>
<\/div><\/div>
\n

L\u2019accessibilitat web beneficia a tothom<\/strong>, no nom\u00e9s a les persones amb diferents tipus de discapacitats (auditiva, visual, cognitiva, motriu, intel\u00b7lectual) o d\u2019edat avan\u00e7ada. Beneficia tamb\u00e9 a les persones amb limitacions tecnol\u00f2giques (poca amplada de banda, dispositius antics) o que es veuen afectades per limitacions provocades per l\u2019entorn (soroll ambiental, lluminositat, incomprensi\u00f3 de l\u2019idioma, etc.). <\/p>\n\n\n\n

En general, l\u2019accessibilitat web millora l\u2019experi\u00e8ncia d\u2019usuari <\/strong>i el posicionament web<\/strong>.<\/p>\n\n\n\n

<\/div>\n\n\n\n
<\/div>\n<\/div><\/div><\/div><\/div><\/div>\n\n\n\n
<\/div>
<\/div><\/div>
\n
<\/div>\n\n\n\n

Per tenir cura de l’accessibilitat web s’ha de tenir en compte:<\/p>\n\n\n\n

\n

Textos<\/mark><\/span><\/i><\/span><\/i><\/span><\/a><\/h4><\/div>
\n
\n
\n

Eviteu les cursives<\/strong>, els textos amb ombres<\/strong> i les maj\u00fascules<\/strong>.
Dificulten la lectura a persones amb disl\u00e8xia<\/strong> o amb d\u00e8ficit visual<\/strong>.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

No feu servir cursives<\/em><\/strong><\/strong><\/strong><\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

NO FEU SERVIR MAJ\u00daSCULES<\/strong><\/strong><\/strong><\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

Utilitzeu la negreta<\/strong> per ressaltar<\/strong><\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n
\n
\n

Eviteu el subratllat<\/strong>. Es confon amb els enlla\u00e7os web i pot generar desconcert.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

No feu servir el subratllat<\/span><\/strong><\/em><\/strong><\/strong><\/strong><\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

Utilitzeu la negreta<\/strong> per ressaltar<\/strong><\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

Eviteu l\u2019\u00fas de colors<\/strong> als textos. Sobretot si tenen un baix contrast amb el fons.
Dificulten la lectura a persones amb problemes d\u2019anomalies a la visi\u00f3 dels colors <\/strong>o amb d\u00e8ficit d\u2019atenci\u00f3.<\/strong><\/p>\n<\/div>\n\n\n\n

\n
\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

No utilitzeu diversos colors<\/mark> en una mateixa<\/mark> frase<\/mark><\/strong><\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\"\"<\/figure>\n<\/div>\n\n\n\n
\n

Utilitzeu la negreta<\/strong> per ressaltar<\/strong><\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n
\n
\n

Opteu sempre per escriure al web directament.<\/strong> El contingut \u00e9s m\u00e9s accessible i f\u00e0cil de cercar. Si heu de publicar un document PDF<\/strong> fet per vosaltres, assegureu-vos que sigui accessible. <\/p>\n\n\n\n

Instruccions.<\/a> <\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n

Estructura<\/mark><\/span><\/i><\/span><\/i><\/span><\/a><\/h4><\/div>
\n
\n
\n

Utilitzeu els t\u00edtols amb una jerarquia correcta<\/strong> per dividir un text llarg.<\/p>\n\n\n\n

No utilitzeu els t\u00edtols per ressaltar text normal. Utilitzeu la negreta<\/strong>.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

No justifiqueu el text<\/strong>. Deixeu-lo alineat a l\u2019esquerra. <\/p>\n\n\n\n

El text justificat \u00e9s adequat en paper, on l\u2019amplada \u00e9s fixa i es coneix. Al web, l\u2019amplada varia en funci\u00f3 del dispositiu i justificar el text genera espais irregulars entre paraules, inc\u00f2modes per a tothom per\u00f2 especialment per a les persones amb disl\u00e8xia.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

Utilitzeu llistes.<\/strong> S\u00f3n molt \u00fatils per estructurar la informaci\u00f3. Si l\u2019ordre \u00e9s important, utilitzeu llistes numerades.<\/p>\n\n\n\n

A partir de 8 elements \u00e9s convenient dividir la llista. <\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

Eviteu les taules<\/strong> per fer distribuci\u00f3 en columnes. Les taules no s\u00f3n adaptatives i part de la informaci\u00f3 no es visualitzar\u00e0 als dispositius m\u00f2bils.<\/p>\n\n\n\n

Utilitzeu les caixes adaptatives<\/a> de la caixa d\u2019eines de Nodes. <\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

El text dels botons<\/strong> i enlla\u00e7os<\/strong> ha de ser descriptiu, ja que d\u2019aquesta manera les persones que fan servir els lectors de pantalla<\/strong> sabran quina acci\u00f3 fa el bot\u00f3.<\/p>\n\n\n\n

Si enllaceu a una web o aplicaci\u00f3 externa, l\u2019enlla\u00e7 de dest\u00ed s\u2019ha d\u2019obrir en una finestra nova. <\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n

Imatges i v\u00eddeos<\/mark><\/span><\/i><\/span><\/i><\/span><\/a><\/h4><\/div>
\n
\n
\n

Escriviu text alternatiu a les imatges.<\/strong>
\u00c9s fonamental per a les persones amb discapacitat visual que utilitzen lectors de pantalla.<\/p>\n\n\n\n

A Nodes (WordPress) heu d\u2019omplir tamb\u00e9 el camp Atribut t\u00edtol de la imatge<\/strong> a Opcions avan\u00e7ades de la imatge.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

Si utilitzeu v\u00eddeos, proporcioneu subt\u00edtols<\/strong>, audiodescripcions<\/strong> o una transcripci\u00f3<\/strong> del contingut.<\/p>\n\n\n\n

Oferiu sempre un enlla\u00e7 directe<\/strong> al peu del v\u00eddeo.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

Si feu infografies, proporcioneu sempre una audiodescripci\u00f3.
<\/strong>Les infografies concentren molta informaci\u00f3 visual i textual en molt poc espai, per\u00f2 s\u00f3n opaques per als lectors de pantalla.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n<\/div>\n<\/div>\n<\/div><\/div>\n<\/div>\n\n\n\n
<\/div>\n<\/div><\/div><\/div><\/div><\/div>\n\n\n\n
<\/div>
<\/div><\/div>
\n
<\/div>\n\n\n\n

Aquest apartat \u00e9s una reelaboraci\u00f3 a partir de les seg\u00fcents fonts:<\/p>\n\n\n\n