Knapptext
När du behöver det
Varje knapp i en Aleris-produkt. Texten på knappen berättar vad som händer om du klickar.
Principen
Knapptexter är verbfraser, inte substantiv. "Boka tid" berättar vad som händer. "Bokning" berättar ingenting. Testet: vad händer om jag klickar? Svaret är knapptexten.
Strukturen
Verb + objekt — kort, aktivt, konkret.
Inledande versal. Aldrig versaler. Aldrig punkt.
Exempel
| ✅ Gör så här | ❌ Inte så här | Varför |
|---|---|---|
| Skicka svar | Svar | Substantiv — vad händer? |
| Boka tid | Bokning | Substantiv — berättar inte |
| Avboka din tid | Avbokning | Substantiv, opersonligt |
| Ladda upp dokument | Uppladdning | Substantiv |
| Logga in | Inloggning | Substantiv |
| Spara och fortsätt | OK | Vagt — vad sparas? |
Tokens
| Token | Roll |
|---|---|
--button-primary-* |
Primär knapp (orange) — en per vy |
--button-secondary-* |
Sekundär knapp (petrol) |
--button-confirm-* |
Bekräftelseknapp |
Tillgänglighet
Knapptexten ska vara tillräcklig utan visuell kontext. "Klicka här" och "Läs mer" är inte tillgängliga — de kräver omgivande text för att förstås. Om en skärmläsare läser upp enbart knapptexten ska användaren förstå vad som händer.
Snabbtest
Vad händer om jag klickar? Om knapptexten inte svarar på den frågan — skriv om.