3.2.3 Ge webbplatsen en god läsbarhet

Typsnittet och luftigheten i texten påverkar webbplatsens läsbarhet. Texten på webbplatsen bör vara så stor att den är bekväm att läsa. För liten text, stora textmassor och för många typsnitt gör att texterna blir svårlästa. Begränsa därför antalet typsnitt på webbplatsen och använd alltid flexibla måttenheter, till exempel em eller procent, så det blir möjligt att påverka storleken på texten.

Läs mer i 3.3.6 Använd flexibla måttenheter.

Typsnitt

Typsnitt som Verdana, Georgia och Trebuchet är speciellt framtagna för läsning på skärm, men alla användare har inte dessa installerade på sina datorer. Det är mest troligt att de har Arial och Verdana. Ange därför typsnitt med flera alternativ, Verdana kan till exempel ha Geneva och Arial som reservalternativ. Det är viktigt att alternativen alltid avslutas med en generell typsnittssort (”serif” eller ”sans-serif”) som i exemplet nedan. Tänk på att det ibland kan vara nödvändigt att frångå den grafiska profilen vad gäller användning av typsnitt på webben eftersom webben ställer andra krav på läsbarhet.

Ange i stilmallen vilka typsnitt som ska användas för olika objekt.

font-family: Verdana, Arial, Helvetica, sans-serif;

Menyer

Skriv menyposter och rubriker versalgement, det vill säga med stor begynnelsebokstav. Ord som är skrivna med versaler är svårare att känna igen och försämrar därför läsbarheten. Om vänstermenyer eller andra vertikala menyer används, vänsterställ texten. Då blir det lättare att skumma menyposterna eftersom blicken kan vandra längs menyns vänsterkant.

Radavstånd

Grundinställningen i webbläsarna visar text med ett radavstånd på 120 procent av storleken för typsnittet. Ju bredare spalter som används för brödtext, desto större ska radavståndet vara. Då hittar ögat lättare till början av nästa rad. Radavståndet kan behöva ökas till 130-150 procent av radhöjden. Gör detta genom att sätta egenskapen ”line-height” för det aktuella objektet i stilmallskoden.

Avståndet mellan de olika punkterna i punktlistor bör vara större än radavståndet. Då blir det lättare att se skillnaden på vad som är en ny punkt och vad som är en punkt som sträcker sig över flera rader.

Stycken

Låt alltid löpande text ha ojämn högerkant eftersom det underlättar läsningen. Stycken med rak högerkant uppfattas som mycket svårläst av många användare.

Spaltbredd

Många användare har behov av att kunna öka storleken på texten. Större textstorlek medför bredare layout och därmed längre radlängder. Eftersom långa radlängder försämrar läsbarheten är det viktigt att skapa en design som anpassar sig efter den textstorlek som besökaren har valt i sin webblä-sare. Du kan göra detta genom att använda enheten em för spaltbredder. Med em bibehålls radlängden oavsett textstorlek.

För att undvika långa rader när breda webbläsarfönster används och hori-sontella rullistor som tvingar användaren att bläddra i sidled, är det lämpligt att ange en maximal spaltbredd. Lämplig spaltbredd är 70 tecken per rad inklusive mellanslag. Vilken maximal spaltbredd det motsvarar i en viss måttenhet i stilmallen varierar beroende på layout, typsnitt och radavstånd.

Se även:

• 3.3.3 Skapa en design som fungerar oavsett fönster- och skärmstorlek
• 3.3.6 Använd flexibla måttenheter.

Mätbarhet

Typsnitt och storlek bestäms ofta i layouten och den grafiska profilen, men pröva gärna webbplatsen med andra vanliga typsnitt och kontrollera att läsbarheten är god även för de användare som får upp dem istället.

Senast uppdaterad 2008-12-18