Validering
Här har vi samlat exempel på hur vi vill att validering ska upplevas i våra digitala produkter och tjänster.
Användaren fyller i inmatningsfältet på rätt sätt.
1. Användaren fyller i inmatningsfältet.
2. Så snart inmatningsfältet är ifyllt på rätt sätt så visar vi en grön checkmark.
Användaren fyller i ett kortnummer som vi accepterar.
1. Användaren börjar skriva in ett kortnummer.
2. Så snart tillräckligt många siffror är ifyllda och det är ett kort vi accepterar så visar vi en bild på kontokortet.
Användaren lämnar ett tomt obligatoriskt inmatningsfält.
1. Användaren lämnar ett tomt obligatoriskt inmatningsfält.
2. Inmatningsfältet får röd ram, röd label, röd varningstriangel och ett rött felmeddelande.
Användaren lämnar ett felaktigt ifyllt obligatoriskt inmatningsfält.
1. Användaren lämnar ett felaktigt ifyllt obligatoriskt inmatningsfält.
2. Inmatningsfältet får röd ram, röd label, röd varningstriangel och ett rött felmeddelande.
Användaren skickar ett formulär med ett eller fler tomma eller felaktigt ifyllda obligatoriska inmatningsfält.
1. Användaren skickar ett formulär med ett eller fler tomma eller felaktigt ifyllda obligatoriska inmatningsfält.
2. Användaren flyttas längst upp på sidan där en summering av alla fel visas med ankarlänkar till varje tomt eller felaktigt ifyllt inmatningsfält. Berörda inmatningsfält får röda ramar, röda labels, röda varningstrianglar och röda felmeddelanden. Användaren trycker på en ankarlänk.
3. Användaren flyttas till det tomma eller felaktigt ifyllda inmatningsfältet.
Användaren skickar ett formulär med inloggningsuppgifter som inte matchar något konto.
1. Användaren skickar ett formulär med inloggningsuppgifter som inte matchar något konto.
2. Användaren flyttas längst upp på sidan där ett rött felmeddelande visas. Berörda inmatningsfält byter inte utseende.