För utvecklare och testare

Råd för tillgänglig utveckling

• Tangentbordsnavigering fungerar
  Lägg undan datormusen. Alla klickbara objekt ska kunna få fokus, fokusmarkeringen ska vara tydlig och ordningen de får fokus i ska vara logisk.

• Använd rätt element till rätt sak
  Semantiska element (som har betydelse för skärmläsare och begriplighet) som exempelvis länkar, knappar och formulärobjekt ska primärt byggas med avsedda standardkomponenter. De är inte ihopsnickrade med <div> <span> och javascript. Använd standardkomponenter som <a>, <button>, <input>.

• Regioner på sidan är uppmärkta
  För att användare med skärmläsare ska få en uppfattning av sidans uppbyggnad behöver olike regioner märkas upp, det kallas även landmärken. Extra viktigt med <nav> och <main>. Mer om regioner på WAI, W3C.

• Rubrikstrukturen är logisk
  Varje sida inleds med en h1-rubrik och underrubriker följer i en logisk ordning.

• Bilder har ett alt-attribut
  Alla img-element ska ha ett alt-attribut som antingen beskriver bilden eller lämnas tomt: alt=””. Exempel på när det lämnas tomt är bilder som är del av en länkad bildpuff.

• Dynamiska element har infor­mation till skärmläsare
  Använd WAI-ARIA där det behövs infor­mation till skärmläsare om vad som händer på sidan. Exempelvis aria-expanded på utfällbara element.

• Skärmläsartester är genomförda.
  Korta tutorials för detta: What is a screen reader (axesslab.com).

• Förstoring fungerar.
  Zooma upp till 200% i webbläsare och ställ in större text i operativsystemet. Se till att det slår igenom i gränssnittet du bygger och att text inte överlappas.