52.16.2 Sätt inte etikett eller instruktioner inuti textfält
Ibland ser man etiketter eller instruktioner stå inuti textfältet. Det är en dålig idé av flera skäl:
• Användare kan se att fältet redan har text och hoppa över det, i tron att det är ett förval.
• Texten försvinner när användaren börjar skriva. Enda sättet att få tillbaka instruktionen är vanligen att ladda om sidan.
• Texten måste ofta vara väldigt kort för att få plats (vilket i och för sig kan vara en nyttig begränsning). Se även Sidorna måste vara användbara även när användaren ställer in en större textstorlek , sid 49 .
• Ofta finns det ingen vettig instruktion att ge och man ser därför kontroller med pratiga nonsensinstruktioner som ”Skriv din sökning här”.
Detta sagt finns det situationer där det är väldigt trångt om utrymme och där valet står mellan att ha texten i fältet eller inte alls. Om det inte är möjligt att ändra layouten kan det trots allt vara det bästa alternativet att placera etiketten eller instruktionen där. Gör den då gärna grå (utan att göra den så blek att den bryter mot Gör kontrasten mellan text och bakgrund tydlig, sid 66 ) och gör ett javascript som tar bort texten och gråheten när användaren kommer till fältet.
En kontroll som däremot kan ha instruktioner i sig är valboxen. Se Valboxar där inget alternativ skall vara förvalt kan inledas med en instruktion , sid 255 .
Texten ovan är ett avsnitt ur Användbarhetsboken. Varje avsnitt har sin egen webbsida. Här hittar du rättelser, tillägg, blogginlägg och kommentarer - eller gör dina egna. Några sidor (till exempel den du läser nu) har också hela bokens text. Steg för steg kommer hela bokens text att läggas ut här på webben.
Vill du läsa mer kan du:
- Läsa ett provkapitel om Användbarhet eller Typografi läsbarhet
- Börja läsa Användbarhetsboken här på webben
- Läsa mer om Användbarhetsboken, och höra vad andra sagt om den
- Köpa Användbarhetsboken hos Bokus eller Adlibris.
Ur bloggen
Mycket intressant ögonkameraundersökning av vilken placering av etiketter som fungerar bäst.
Allra bäst fungerade att sätta etiketten vänsterställd alldeles ovanför sin kontroll. (Detta gör dock formuläret längre och kan ha nackdelen att användaren inte får överblick och tvingas rulla – en nackdel för användbarheten som inte vägts in i denna test.)
Näst bäst fungerade “julgranslayout”, att etiketterna sätts till vänster om kontrollen, men högerställs så att de hamnar så nära sin kontroll som möjligt. I Användbarhetsboken är jag kallsinnig till denna layout, men det verkar som att jag hade fel.
Intressant i testen är också att fetstil fungerade betydligt sämre än normalstil när etiketterna satt ovanför sin kontroll – förmodligen en effekt av att fetstilen kolliderar med den mörka överkanten på textfält.
Valboxar skiljde ut sig från de andra kontrollerna. De har mycket stor förmåga att dra till sig uppmärksamheten, och etiketten bör sättas inuti kontrollen, som den text som syns innan något är valt.


Post new comment