Setup
aksel.nav.no
Retningslinjer
- Bruk
autocomplete
for felter som mottar personlig informasjon. For felter som etterspør personlig informasjon om en annen person enn brukeren, skru autocomplete av. (WCAG 1.3.5) - Bruk gjerne inputtyper som tilsvarer informasjonstypen du ber om (
tel
,search
,email
, osv.). Disse tilbyr mobilbrukere et tastatur som er tilpasset inputtypen, men ta i betraktning at de kan også utløse client-side validering av feltets input. - Vær generøs i hva du aksepterer av data. Godta input fra brukeren så lenge den er forståelig, f.eks. telefonnumre med mellomrom, personnumre med punktum, epost-adresser med mellomrom til slutt.
- Dersom input blir automatisk formattert, må dette være synlig for brukere slik at de kan kontrollere om det ble riktig.
- Feltets
name
må inkludere, og helst starte med teksten i denslabel
. (WCAG 2.5.3) - Unngå bruk av all-caps og kursiv tekst til labels. Disse er vanskeligere å lese.
Props
TextField
Type |
|
---|---|
Description | Controlled value |
Type |
|
---|---|
Description | Defaults input-value without needing controlled-state |
Type |
|
---|---|
Description | Exposes the HTML size attribute |
Type |
|
---|---|
Description | If enabled shows the label and description for screenreaders only |
Type |
|
---|---|
Description | TextField label |
Type |
|
---|---|
Description | Type of form control. Picking the correct type helps user fill inn their required information |
Default | "text" |
Type |
|
---|---|
Description | Error message for element |
Type |
|
---|---|
Description | Override internal errorId |
Type |
|
---|---|
Description | Changes font-size, padding and gaps |
Type |
|
---|---|
Description | Disables element @note Avoid using if possible for accessibility purposes |
Type |
|
---|---|
Description | Adds a description to extend labling of a field |
Type |
|
---|---|
Description | Override internal id |
Type |
|
---|
Type |
|
---|
* Props er autogenerert fra kode, så avvik kan forekomme. Ta kontakt hvis noe ikke stemmer!