Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Note

Under uppbyggnadKomponenten kommer den 11 juni 2024.

Panel
panelIconId1f464
panelIcon:bust_in_silhouette:
panelIconText👤
bgColor#F4F5F7

Webbredaktör och lättredaktör kan skapa och redigera.

Sidans innehåll

Table of Contents
minLevel1
maxLevel1
outlinefalse
styledisc
typelist
printabletrue

...

Komponenten knapp kan du använda när du vill lyfta en extra viktig länk som besökaren ska klicka på. Det kan till exempel vara om besökaren ska logga in i ett system, fylla i ett formulär eller leda besökaren till alla nyheter.

Knappen ska ses som ett komplement till puffar och andra länkar och användas med varsamhet eftersom för många knappar inte underlättar för besökaren.

...

Expand
titleAnvänd inte knappen så här

Eftersom för många knappar gör det svårt för besökaren att veta vilken knapp som hen ska klicka på så finns det situationer där du inte ska använda knappen.

Istället för puffar

Har du flera länkar som du vill uppmärksamma ska du använda komponenterna för puff istället - inte knapp. I exemplet nedan ser du hur en sådan lösning hade sett ut och därför ska vi använda puffar istället.

image-20240523-133520.png

vs Använd istället puffar:

image-20240523-134155.png

Inte extra viktiga

Istället för vanliga länkar

I sektionstypen information kan du ha flera olika länkar. Majoriteten av dessa är inte extra viktiga för alla som besöker listansidan. Därför ska du inte använda komponenten knapp för dessa länkar utan istället bara skapa vanliga länkar i editorn. Detta för att inte ta fokus från den viktigaste länken.

image-20240523-134628.png

vs vanlig länk i editor. Använd istället “vanliga länkar”: Manual för länk i editor

image-20240523-135058.png

Expand
titleTydlig och unik länktext

Länktexten ska göra det tydligt för besökaren vart hen hamnar om hen klickar på länken. Kom ihåg att besökare med uppläsande hjälpmedel navigerar på sidan genom att få en lista med länktexter. Det innebär att länktexten måste vara unik och självständig från innehållet. Länkar du till samma innehåll på flera ställen använder du samma länktext.

Länkar du till en sida utanför den webbplats du är på, ska det tydligt framgå av länktexten. Exempel på länktexter på gu.se:

Använd inte texten ”läs mer”, ”mer information” eller liknande som länktext, det är varken bra ur tillgänglighetsperspektiv eller ur sökmotoroptimering.

...

  1. I redaktörsgränssnittet väljer du “Layout” och lägger till en sektion med layout “Information”, spaltbred eller där “66” finns.

  2. Klicka på “Lägg till komponent” och välj “Knapp.

  3. Lägg in din länk:

...

Note

Kom ihåg att klicka på “Spara” för att ändringarna ska slå genom.

Goda exempel

Kommer inom kort.