Styleguide

Hoppa till innehåll

Den här komponenten använder du för att användare som navigerar genom att tabba sig fram ska slippa hamna på innehåll som återkommer på flera sidor. Möjligheten att hoppa över återkommande innehåll är ett krav för att din tjänst eller webbplats ska vara tillgänglig.

Design och språk

När du ska använda komponenten

Har du innehåll i din tjänst som återkommer på flera sidor, till exemepel sidhuvud, sidfot, menyer eller brödsmulor ska du ge de användare som navigerar genom att tabba sig fram möjligheten att hoppa över det innehållet. För användare som navigerar sig fram genom att tabba med tangentbordet eller som använder andra hjälpmedel tar det både onödig tid och kraft om de ska behöva ta sig genom innehåll som återkommer på varje sida. Enligt kraven på tillgänglighet ska du därför ge användaren möjlighet att hoppa över det återkommande innehållet.

Placering av komponenten

För att komponenten ska vara tillgänglig måste den placeras högst upp på sidan så att första tabben på sidan hamnar i komponenten "Hoppa till innehåll".

Komponent och kod

Komponenten driftsattes första gången i version 18.1.5.

<section class="l-container c-skip-menu">
   <div class="l-container__inner c-skip-menu__inner">
      <div class="c-skip-menu__content">
         <div class="c-skip-menu__content__inner">
            <!-- Innehållet i komponenten -->
            <ul class="c-skip-menu--list">
               <li>
                  <a href="#content">Hoppa till sidinnehåll</a>
               </li>
            </ul>
         </div>
      </div>
   </div>
</section>
<jv-skip-menu>
   <ul class="c-skip-menu--list">
      <li>
         <a href="#content">Hoppa till sidinnehåll</a>
      </li>
   </ul>
</jv-skip-menu>

Exempel

Senast publicerad

Sidansvarig för sidan är Styleguide