WCAG framgångskriterier · Level AAA

WCAG 2.4.8: Plats

WCAG 2.4.8 kräver att användare kan avgöra var de befinner sig inom en uppsättning webbsidor — till exempel genom brödsmulor, webbplatskartor eller markerade navigationslänkar. Detta hjälper användare med kognitiva funktionsnedsättningar, skärmläsaranvändare och alla som navigerar på komplexa webbplatser att orientera sig och röra sig genom innehållet med trygghet.

Vad den här regeln innebär

WCAG 2.4.8 Location är ett kriterium på nivå AAA under principen Operable. Det säger: "Information about the user's location within a set of Web pages is available." I praktiska termer betyder detta att din webbplats måste tillhandahålla tydliga, beständiga signaler som talar om för användare exakt var de befinner sig inom webbplatsens övergripande struktur vid varje given tidpunkt.

Detta kriterium gäller när en webbplats består av flera sidor organiserade i en meningsfull hierarki eller sekvens — till exempel en e‑handelssajt med kategorier, underkategorier och produktsidor, eller en myndighetsportal med avdelningar och underavsnitt. Om en användare hamnar på en sida ska hen kunna besvara frågan ”Var är jag på den här webbplatsen?” utan att behöva gissa eller enbart förlita sig på minnet.

Godtagbara tekniker för att uppfylla detta kriterium inkluderar, men är inte begränsade till:

  • Brödsmulor (breadcrumb trails) — ett navigationshjälpmedel som visar vägen från webbplatsens startsida till den aktuella sidan (t.ex. Home > Products > Laptops > 15-inch Models).
  • Sajtkartor — en särskild sida eller panel som visar webbplatsens övergripande struktur och markerar eller lyfter fram den aktuella platsen.
  • Markerade eller visuellt distinkta navigationslänkar — navigationsmenyer som tydligt markerar den aktiva sektionen eller sidan, ofta kompletterade med attributet aria-current för användare av hjälpmedelsteknik.
  • Numrerade steg i en flerstegsprocess — indikatorer som ”Steg 2 av 5” i en kassa eller formulärguide som kommunicerar den sekventiella positionen.

En sida klarar detta kriterium om minst en tillförlitlig mekanism finns som informerar användaren om deras aktuella plats i webbplatsens struktur. En sida underkänns om ingen sådan mekanism finns — till exempel om navigationsfältet saknar visuell eller programmatisk markering av den aktuella sidan, det inte finns någon brödsmula och ingen stegindikator visas.

Det är viktigt att notera att WCAG 2.4.8 inte föreskriver någon specifik teknik; det kräver att någon effektiv platsindikator finns. För att indikatorn ska vara verkligt tillgänglig måste den dock också vara uppfattbar för hjälpmedelstekniker som skärmläsare, inte bara visuellt tydlig för seende användare. Detta innebär att rent visuella indikatorer (som en fet länk utan ändrad tillgänglig etikett) kan vara otillräckliga i sig om de inte exponeras programmatiskt.

Det finns inga officiella undantag i WCAG för detta kriterium utöver den allmänna förståelsen att det gäller uppsättningar av relaterade sidor. En enskild fristående webbsida som inte ingår i en större uppsättning behöver inte uppfylla detta kriterium, eftersom det inte finns någon ”plats inom en uppsättning” att kommunicera.

Varför det är viktigt

Att veta var man befinner sig i en digital miljö är ett grundläggande orienteringsbehov som de flesta användare tar för givet — tills signalerna saknas. WCAG 2.4.8 adresserar ett verkligt och utbrett hinder som drabbar flera tydligt avgränsade användargrupper.

Användare med kognitiva funktionsnedsättningar är bland dem som påverkas mest. Tillstånd som uppmärksamhetsstörning, minnesnedsättningar och förvärvade hjärnskador kan göra det svårt att hålla reda på sin väg genom en komplex webbplats. Utan en brödsmula eller liknande signal kan en användare bli desorienterad, osäker på hur hen ska återvända till en överordnad kategori eller oförmögen att förstå hur den aktuella sidan relaterar till innehåll hen redan har sett. Enligt Världshälsoorganisationen lever över en miljard människor världen över med någon form av funktionsnedsättning, och kognitiva nedsättningar utgör en betydande och ofta underbetjänad del av den populationen.

Skärmläsaranvändare — som vanligtvis är blinda eller har nedsatt syn — är starkt beroende av programmatisk struktur för att förstå sidans kontext. En seende användare kan kasta en blick på en markerad navigationslänk eller ett fetstilt brödsmuleobjekt och omedelbart orientera sig. En skärmläsaranvändare måste däremot tolka sidan genom sekventiell ljudutmatning. Utan attributet aria-current="page" på den aktiva navigationslänken eller en korrekt strukturerad brödsmula med tillgängliga etiketter får de ingen likvärdig orienteringssignal och kan behöva navigera omfattande bara för att avgöra var de befinner sig.

Användare med motoriska funktionsnedsättningar som navigerar med tangentbord, switch‑styrning eller ögonstyrningsenheter gynnas av platsindikatorer eftersom de minskar behovet av redundant, ansträngande navigering. Om en användare redan vet att hen befinner sig i ”Support”-sektionen på en företagswebbplats behöver hen inte skanna igenom hela navigationsstrukturen på nytt varje gång en ny sida laddas.

Överväg ett konkret scenario: en användare med tidig demens surfar på en turkisk banks onlineportal för att hitta information om bolåneräntor. Hen klickar sig igenom flera sidor och blir osäker på om hen fortfarande är i avdelningen för privatbank eller har hamnat i företagsbankdelen. Utan en brödsmuleväg eller en markerad navigationspunkt som tydligt anger den aktuella sektionen kan användaren stänga webbläsaren i frustration eller göra ett kostsamt misstag — som att ansöka om fel produkt. En enkel, väl implementerad brödsmula (t.ex. Ana Sayfa > Bireysel Bankacılık > Krediler > Konut Kredisi) skulle omedelbart lösa denna förvirring.

Utöver tillgänglighet ger platsindikatorer mätbara fördelar för användbarhet och SEO. Strukturerade data för brödsmulor (med Schema.org BreadcrumbList) kan visas direkt i Googles sökresultat som rich snippets, vilket förbättrar klickfrekvensen. En tydlig webbplatsstruktur minskar också avvisningsfrekvensen, eftersom användare som förstår var de befinner sig mer sannolikt utforskar relaterat innehåll istället för att lämna webbplatsen.

Relaterade Axe-core-regler

WCAG 2.4.8 kräver manuell testning eftersom automatiserade verktyg inte pålitligt kan avgöra om en platsmekanism finns, är meningsfull och tillgänglig i alla sammanhang. Ingen axe-core-regel motsvarar detta kriterium direkt. Här är varför automatisering inte räcker och vad manuell utvärdering måste omfatta:

  • Förekomst av en platsmekanism (manuell) — En automatiserad skanner kan upptäcka om ett brödsmuleelement finns i DOM:en, men kan inte avgöra om den brödsmulan korrekt återspeglar webbplatsens faktiska informationsarkitektur, om den finns på varje sida i en uppsättning eller om den är rätt typ av platsindikator för webbplatsens navigationsmodell. Ett verktyg kan hitta ett <nav aria-label="breadcrumb">-element och rapportera att inget problem finns, även om brödsmulan bara visas på vissa sidor eller innehåller felaktig hierarkiinformation.
  • Exakthet och fullständighet (manuell) — Automatiserade verktyg kan inte verifiera att platsinformationen är korrekt. En brödsmula som alltid visar ”Home > Current Page” oavsett den faktiska hierarkin skulle klara en automatiserad skanning men underkännas enligt detta kriterium, eftersom den inte sanningsenligt representerar användarens plats i siduppsättningen.
  • Programmatisk exponering (delvis automatiserad) — Även om axe-core kan flagga saknade aria-current-attribut på navigationslänkar i vissa konfigurationer kan det inte slutgiltigt avgöra om avsaknaden av aria-current är ett brott mot 2.4.8 utan att förstå webbplatsens övergripande struktur och varje navigationselements roll.
  • Konsistens i siduppsättningen (manuell) — En platsmekanism måste finnas tillgänglig genom hela den relevanta uppsättningen sidor, inte bara på utvalda sidor. Automatiserade skanningar utvärderar vanligtvis en sida i taget och kan inte bedöma om en mekanism finns konsekvent på en hel webbplats eller sektion.

Hur man testar

  1. Identifiera siduppsättningen: Avgör om sidan som testas tillhör en uppsättning relaterade sidor med en definierad hierarki (t.ex. en flernivånavigationsstruktur, en steg‑för‑steg‑guide eller ett kategoriserat innehållsbibliotek). Om sidan är ett fristående dokument kanske detta kriterium inte är tillämpligt.
  2. Kör en automatiserad skanning som baslinje: Använd axe DevTools (webbläsartillägg) eller Lighthouse i Chrome DevTools för att köra en tillgänglighetsgranskning. Även om inget av verktygen granskar 2.4.8 direkt, leta efter relaterade problem som saknade aria-current-attribut på navigationslänkar, oetiketterade <nav>-landmärken och saknad brödsmulestruktur. Dessa fynd stödjer — men ersätter inte — den manuella granskningen.
  3. Inspektera visuellt efter en platsmekanism: Leta efter en brödsmuleväg, en markerad eller visuellt distinkt aktiv länk i navigeringen, en stegräknare eller en länk till sajtkarta. Verifiera att mekanismen korrekt återspeglar den aktuella sidans position i webbplatsens hierarki.
  4. Testa med en skärmläsare — NVDA + Firefox: Öppna NVDA, navigera till sidan och tryck på D för att bläddra mellan landmärken. Lokalisera navigationslandmärkena och lyssna efter någon indikation på den aktuella sidan eller sektionen. Kontrollera om det aktiva navigationselementet annonseras annorlunda (t.ex. ”current page” eller liknande, vanligtvis förmedlat via aria-current="page"). Gå igenom brödsmulan om den finns och verifiera att varje nivå annonseras med sin länktext och att den aktuella platsen tydligt identifieras.
  5. Testa med VoiceOver + Safari (macOS/iOS): Aktivera VoiceOver (Command + F5), navigera till brödsmulan eller huvudnavigeringen med VO + U för att öppna Rotor och välj ”Links” eller ”Landmarks”. Lyssna på hur det aktiva navigationselementet eller den aktuella brödsmulepunkten annonseras. Verifiera att den aktuella platsen går att skilja från andra navigationselement.
  6. Testa med JAWS + Chrome: Använd Insert + F7 för att öppna länkslistan och Insert + F6 för att öppna rubriklistan. Navigera till brödsmulan eller navigationsområdet och bekräfta att den aktuella sidan eller sektionen är programmatiskt identifierbar. Kontrollera att aria-current läses upp (JAWS annonserar detta som ”current” för det relevanta elementet).
  7. Testa över flera sidor i uppsättningen: Navigera genom minst tre till fem sidor inom samma sektion eller hierarki och bekräfta att platsmekanismen uppdateras korrekt på varje sida och att den finns konsekvent genom hela uppsättningen.
  8. Inspektera DOM:en: Använd webbläsarens DevTools för att kontrollera att brödsmulelänkar har beskrivande tillgängliga namn, att det aktuella objektet använder aria-current="page" (för den aktuella sidan) eller aria-current="true" (för det aktuella steget i en process) och att brödsmulan är innesluten i ett <nav>-element med en tillgänglig etikett som aria-label="Breadcrumb".

Hur man åtgärdar

Saknad brödsmulenavigering — felaktigt

<!-- No breadcrumb or location indicator present.
     Users have no way to determine their location in the site hierarchy. -->
<nav aria-label='Main navigation'>
  <ul>
    <li><a href='/'>Home</a></li>
    <li><a href='/products'>Products</a></li>
    <li><a href='/products/laptops'>Laptops</a></li>
  </ul>
</nav>
<h1>15-inch Laptops</h1>

Saknad brödsmulenavigering — korrekt

<!-- A breadcrumb nav is added above the main content.
     aria-label distinguishes it from main navigation.
     aria-current="page" marks the current location for screen readers.
     The list structure communicates hierarchy. -->
<nav aria-label='Breadcrumb'>
  <ol>
    <li><a href='/'>Home</a></li>
    <li><a href='/products'>Products</a></li>
    <li><a href='/products/laptops'>Laptops</a></li>
    <li><a href='/products/laptops/15-inch' aria-current='page'>15-inch Laptops</a></li>
  </ol>
</nav>
<nav aria-label='Main navigation'>
  <ul>
    <li><a href='/'>Home</a></li>
    <li><a href='/products'>Products</a></li>
    <li><a href='/products/laptops'>Laptops</a></li>
  </ul>
</nav>
<h1>15-inch Laptops</h1>

Aktiv navigationslänk utan programmatisk indikator — felaktigt

<!-- The active link is styled differently in CSS, but there is no
     programmatic signal. Screen reader users cannot distinguish it
     from the other navigation links. -->
<nav aria-label='Site navigation'>
  <ul>
    <li><a href='/about'>About</a></li>
    <li><a href='/services' class='active'>Services</a></li>
    <li><a href='/contact'>Contact</a></li>
  </ul>
</nav>

Aktiv navigationslänk utan programmatisk indikator — korrekt

<!-- aria-current="page" is added to the active link.
     Screen readers will announce this link as "current" or "current page"
     depending on the assistive technology, giving users a clear
     programmatic location signal in addition to the visual styling. -->
<nav aria-label='Site navigation'>
  <ul>
    <li><a href='/about'>About</a></li>
    <li><a href='/services' class='active' aria-current='page'>Services</a></li>
    <li><a href='/contact'>Contact</a></li>
  </ul>
</nav>

Flerstegsformulär utan stegindikator — felaktigt

<!-- A multi-step checkout form with no indication of current step.
     Users cannot determine how far they are through the process
     or how many steps remain. -->
<form>
  <h1>Shipping Information</h1>
  <!-- form fields -->
  <button type='submit'>Next</button>
</form>

Flerstegsformulär utan stegindikator — korrekt

<!-- A progress indicator communicates the user's position in the sequence.
     aria-label on the nav provides context.
     aria-current="step" marks the active step for assistive technologies.
     The visible text "Step 2 of 4" is also available for all users. -->
<nav aria-label='Checkout progress'>
  <ol>
    <li><a href='/checkout/cart'>Cart</a></li>
    <li aria-current='step'><strong>Shipping</strong></li>
    <li>Payment</li>
    <li>Confirmation</li>
  <ol>
</nav>
<form>
  <h1>Shipping Information <span>(Step 2 of 4)</span></h1>
  <!-- form fields -->
  <button type='submit'>Next: Payment</button>
</form>

Vanliga misstag

  • Att bara tillhandahålla en brödsmula på startsidan eller endast på ”blad”-sidor: Brödsmulan måste finnas konsekvent på alla sidor i uppsättningen. Att bara visa den på produktsidor men inte på kategorisidor skapar luckor i orienteringsinformationen.
  • Att använda en visuellt stylad aktiv länk utan att lägga till aria-current="page": En fet eller understruken aktiv navigationslänk kommunicerar plats visuellt, men skärmläsaranvändare får ingen nytta om inte aria-current="page" också finns på det elementet.
  • Att lägga brödsmulan i ett <div> istället för ett <nav>-element: Att använda en icke‑semantisk behållare innebär att brödsmulan inte exponeras som ett navigationslandmärke, vilket gör det svårare för skärmläsaranvändare att hitta och tolka den.
  • Att utelämna aria-label från brödsmulans <nav> när ett huvudnavigationslandmärke också finns: Två oetiketterade <nav>-landmärken på samma sida skapar tvetydighet. Skärmläsare kan annonsera båda enbart som ”navigation”, vilket gör det omöjligt för användare att skilja dem åt.
  • Att använda aria-current="true" på en sidlänk istället för aria-current="page": Värdet page är det semantiskt korrekta värdet för att identifiera den aktuella sidan i ett navigationssammanhang. Att använda true är mindre beskrivande och kan annonseras annorlunda eller mindre tydligt av hjälpmedelstekniker.
  • Att enbart förlita sig på en sidtitel för att ange plats: Ett beskrivande <title>-element (t.ex. ”Laptops — 15-inch Models | Acme Store”) är hjälpsamt och krävs av WCAG 2.4.2, men det uppfyller inte i sig 2.4.8, som kräver en mekanism som förmedlar position inom siduppsättningens struktur, inte bara namnet på den aktuella sidan.
  • Att bygga brödsmulor som återspeglar URL-struktur snarare än navigationshierarki: URL:er och navigationsstrukturer stämmer inte alltid överens. Brödsmulor ska återspegla den logiska informationsarkitektur som en användare skulle förstå, inte den underliggande URL‑sökvägen, som kan vara teknisk eller svårbegriplig.
  • Att visa brödsmulan som ren text utan länkar för överordnade nivåer: Om endast den aktuella sidan visas eller överordnade nivåer inte är länkade förlorar brödsmulan sin nytta både som platsindikator och som navigationshjälpmedel. Överordnade objekt bör vara länkade så att användare kan ta sig uppåt i hierarkin.
  • Att markera den aktuella brödsmulepunkten endast med en visuell separatorändring istället för aria-current: Att ändra färg eller ta bort understrykning från det sista brödsmuleobjektet kommunicerar inte för skärmläsare att det representerar den aktuella sidan. aria-current="page" måste uttryckligen läggas till.
  • Att glömma att uppdatera platsindikatorn i single-page applications (SPA:er) efter klient‑sidig navigering: I SPA:er byggda med ramverk som React eller Vue sker sidövergångar utan fullständig omladdning av webbläsaren. Om brödsmulan eller den aktiva navigationsindikatorn inte uppdateras programmatiskt vid ruttbyte kommer den att visa inaktuell platsinformation, vilket är sämre än att inte ha någon indikator alls.

Relation till Turkiets tillgänglighetsreglering

Turkiets presidentcirkulär 2025/10, publicerat i den officiella tidningen nr 32933 den 21 juni 2025, fastställer bindande krav på webb- och mobiltillgänglighet för ett brett spektrum av organisationer som är verksamma i Turkiet. Cirkuläret kräver efterlevnad av internationellt erkända tillgänglighetsstandarder — vilket i praktiken innebär att WCAG‑ramverket antas — och gäller för en definierad uppsättning aktörstyper, inklusive offentliga institutioner och myndigheter, e‑handelsplattformar, banker och finansiella institutioner, sjukhus och vårdgivare, telekommunikationsföretag med 200,000 eller fler abonnenter, auktoriserade resebyråer, privata transportföretag och privatskolor som godkänts av Ministry of National Education (MoNE).

WCAG 2.4.8 Location klassificeras som ett kriterium på nivå AAA, vilket innebär att det inte ingår bland de grundläggande juridiskt obligatoriska kriterierna enligt cirkuläret, som hänvisar till nivå A och nivå AA som miniminivå för efterlevnad. Distinktionen är dock viktig på flera sätt för organisationer som omfattas av regleringen.

För det första kan vissa specialiserade tjänster — särskilt de som betjänar användare med betydande kognitiva eller navigationsrelaterade utmaningar, såsom vårdportaler för äldre patienter eller utbildningsplattformar för studenter med inlärningssvårigheter — förväntas gå längre än AA‑baslinjen för att i praktiken uppfylla andemeningen i tillgänglighetsåtagandena enligt turkisk lag och relaterad lagstiftning som lagen om personer med funktionsnedsättning nr 5378. Att implementera 2.4.8 i dessa sammanhang visar ett substantiellt, snarare än enbart formellt, åtagande för inkludering.

För det andra är turkiska offentliga institutioner och reglerade privata aktörer i allt högre grad föremål för revisioner och klagomålsmekanismer. Att kunna visa upp efterlevnad på AAA‑nivå — inklusive WCAG 2.4.8 — ger en försvarbar dokumentation av bästa praxis och minskar den regulatoriska risken vid ett formellt tillgänglighetsklagomål.

För det tredje har platsindikatorer som brödsmulor direkt kommersiellt värde utöver sin tillgänglighetsfunktion, särskilt för e‑handelsplattformar och banker. En turkisk banks onlineprocess för bolåneansökan som inkluderar tydliga stegindikatorer och brödsmulenavigering kommer inte bara att betjäna användare med kognitiva funktionsnedsättningar mer effektivt utan också minska avhoppsfrekvensen och stödja konvertering — vilket kopplar investeringar i tillgänglighet till mätbara affärsresultat.

Organisationer som använder Accsible overlay SDK kan utnyttja dess inbyggda förbättringar för brödsmulor och funktioner för insättning av aria-current för att föra befintliga webbplatser närmare överensstämmelse med 2.4.8 utan att kräva fullständig omarbetning av kodbasen. För fullständig och robust efterlevnad — särskilt för aktörer som omfattas av presidentcirkulär 2025/10 — är dock server‑sidig eller build‑tidsimplementering av semantisk brödsmulemarkering och navigationsindikatorer fortfarande den rekommenderade metoden, eftersom overlay‑lösningar kompletterar men inte ersätter grundläggande tillgänglig markup.