Vi fortsätter att jobba med tillgänglighet.

Tillgänglighet är ett av våra fokusområden och vi jobbar ständigt med att förbättra tillgängligheten i produkten. Vi har länge haft utökat tillgänglighets­stöd som kontrollerar bildbeskrivningstexter och tabellbeskrivningar. Stödet påminner om att undvika länkbeskrivning och i verktyget finns en tillgänglighetskontroll som körs vid publicering. Allt eftersom kraven höjs så utökar vi också SiteVisions funktionalitet. Här lyfter vi bra saker vi gjort under året.

Det mesta kommer med uppdateringen - men det finns saker du måste göra.

Det mesta kommer automatiskt med SiteVision. En del funktioner måste du aktivera på egen hand. WAI-ARIA landmärksroller är ett exempel på en funktion du själv måste lägga till. WAI-ARIA-roller märker upp innehållet på din webbplats så att användare med exempelvis ett skärmläsareverktyg på ett standardiserat sätt kan navigera mellan sidans olika delar. Läs vidare för mer information.

Vilka förbättringar gällande tillgänglighet har vi gjort i produkten till SiteVision 5?

Under den senaste tiden har vi gjort en mängd förbättringar i produkten kopplat till tillgänglighet. Många punkter handlar om kod för att skärmläsare bättre ska förstå webbsidan. Stora förändringar du som kund har nytta av är:

  • Möjlighet att ställa in ARIA-role på moduler, layouter, mm.
  • Uppdaterad valideringsfunktion i SiteVision

Hantering av felmeddelanden:

  • Felmeddelande i formulärmoduler knyts hårdare till de inmatningsfält som felen avser
  • Obligatoriska frågor i formulär förtydligas med en text för att underlätta för skärmläsare

Inställningsmöjligheter:

  • Inställningsmöjlighet för "title"-attribut i youtubemodulen
  • Inställningsmöjlighet för "title"-attribut i iframemodulen
  • Inställningsmöjlighet för egna undertexter i videomodulen

Kod kopplad till inmatningsfält för att skärmläsare bättre ska förstå webbsidan:

  • Inmatningsfältet "Bifoga fil" i aktivitetsflödet har title och label
  • Inmatningsfältet "Vad jobbar du med?" i aktivitetsflödet har title och label
  • Etiketter/labels med klassen "svhidden" och "sv-hidden" är synliga för skärmläsare
  • Beskrivande texter för legends i fieldsets
  • Förbättrat taggen legend i formulär
  • Textfrågan använder aria-describedby när frågan har en beskrivning
  • Attributet scope sätts på rubrikceller i tabeller för förbättrad tillgänglighet
  • Profilbildsmodulen har en beskrivande alt-text
  • Sökformulär är tillgänglighetsanpassade
  • Uppgradera video.js för förbättrat tillgänglighetsstöd (WAI-ARIA)
  • Förbättrat tillgänglighetsstöd i modulen Sök facetterad
  • Accessible autocomplete läser upp rätt i sökmoduler
  • Tillgänglighetsanpassning av inloggningsmodulen Iframe som skapas när man aktiverar google tag manager har landmärke
  • Glömt lösenord-modulen skriver ut aria-describedby
  • Möjlighet att använda autocomplete-attribut för textfält och personuppgiftsfält i formulär

Vad behöver du göra nu?

Det mesta av arbetet med tillgänglighet inkluderas automatiskt i produkten. Men WAI-ARIA landmärkesroller måste du själv märka upp på din webbplats och i dina mallar. Syftet med WAI-ARIA är att webbläsarna ska kunna tolka innehållet på din webbplats på ett enklare sätt. WAI-ARIA underlättar för exempelvis ett skärmläsareverktyg att på ett standardiserat sätt kunna navigera mellan sidans olika delar.

WAI-ARIA landmärksroll

Använd WAI-ARIA landmärkesroller, exempelvis main, navigation, banner, contentinfo, complementary och så vidare för att på ett bra och kraftfullt sätt identifiera organisation och struktur över webbsidan.

Tillgänglighet i sitevision Aria-role

Bild från SiteVision på ytan för ARIA-roll

I SiteVision sätter du dina WAI-ARIA landmärksroller genom att klicka på Egenskaper -> Inställningar -> Tillgänglighet. Lägg dina landmärksroller antingen direkt på modulen (t.ex. search och navigation) eller på layouten (t.ex. banner och contentinfo).

Då alla webbläsare och hjälpmedel inte kan översätta elementtyperna i HTML 5 ännu så uppmuntrar vi att ni använder ARIA landmärkesroller parallellt med HTML 5 elementtyper eller där HTML 5 elementen inte räcker till.

Alternativ för ARIA-roll i sitevision

Bild från SiteVision med ARIA-roll alternativ

I SiteVision finns det åtta förvalda standardalternativ, men du kan även välja att skriva dit egna. Besök webbriktlinjer.se för att läsa mer och se när du ska använda WAI ARIA och när du ska använda struktur-element i HTML5.


WAI-ARIA Landmärkesroller - standardalternativen

Banner

En ”Banner-roll” utgör allmänt och informativt innehåll som ofta placeras i början av sidan. Detta inkluderar vanligtvis en logotyp, företagsnamn, sökikon, foto relaterat till sidan eller slogan. Denna del kallas vanligen för sidhuvud eller ”header”. Denna del kan läggas på en layout, rad eller spalt.

Complementary

”Complementary-rollen” används för att beteckna en stödsektion som relaterar till huvudinnehållet, men som även kan vara ensam när den är separerad. Dessa avsnitt presenteras ofta som sidofält. Kan exempelvis vara en sidospalt.

Contentinfo

”Contentinfo-rollen” används för att identifiera information som upprepas i slutet av varje sida på din webbplats, inklusive upphovsrättsinformation, navigationslänkar och sekretessutlåtanden. Denna del kallas vanligen för en sidfot eller ”footer”. Denna del kan läggas på en layout, rad eller spalt.

Form

”Form-rollen” kan användas för att identifiera ett formulär på sidan. ”Form-rollen” ska sättas på hela formuläret och inte rad för rad i formuläret. Denna del kan läggas på en layout, rad eller spalt. Alternativt direkt på modulen.

Main

”Main-rollen” används där du har det primära innehållet på en sida. Exempelvis på den del av sidan där innehållsytan visar sidans huvudsakliga information. Denna del kan läggas på en layout, rad eller spalt.

Navigation

”Navigation-rollen” används för att identifiera större grupper av länkar som används för att navigera på din webbplats eller i ditt sidinnehåll. Ofta handlar detta om en meny. Denna del kan läggas direkt på modulen.

Region

"Region-rollen" används för att identifiera regioner på en sida. (Det kan finnas flera, men använd bara för delar som är så viktiga att de behöver finnas i sidnavigation).

Search

”Search-rollen” används för att identifiera den del av sidan som används för att söka på sidan, webbplatsen eller samlingen av webbplatser. Ofta handlar detta om sökrutan och sökmodulerna på din webbplats. Denna del kan läggas på en layout, rad eller spalt. Alternativt direkt på modulen.

Vi jobbar kontinuerligt vidare med tillgänglighet

Har vi missat något? Eller finns det något som vi kan förbättra? Tveka in att höra av dig till support@sitevision.se