Liten text på dator

Silktide mäter storleken på den text som människor ser när dina sidor visas på en datorskärm och rapporterar text som återges i mindre än 12 pixlar. Så liten text är svår eller omöjlig för många människor att läsa.

Varför detta är viktigt

Datorskärmar befinner sig längre från läsaren än en telefon, så liten text är proportionellt svårare att läsa där. Text under 12 pixlar utestänger läsare med nedsatt syn, anstränger äldre läsares ögon och får alla andra att luta sig fram eller zooma. Viktiga designriktlinjer anger 12 till 14 pixlar som det praktiska minimumet för brödtext på datorer.

Liten text är sällan ett medvetet val – den smyger sig oftast in genom juridisk standardtext, sidfötter och inbäddningar från tredje part som ingen läser igenom igen.

Så åtgärdar du det

Öka teckenstorleken i din till minst 12px, och helst 16px för brödtext.


\/* Problem: för liten för att läsas bekvämt på dator *\/
.footer-note { font-size: 10px; }

\/* Åtgärd: använd en läsbar storlek, helst i relativa enheter *\/
.footer-note { font-size: 0.875rem; } \/* 14px med standardinställningar *\/

Föredra relativa enheter (rem, em) framför fasta pixlar, så att texten också skalas när användare ändrar webbläsarens standardstorlek för text.
Om den flaggade texten faktiskt fungerar bra i sin storlek – till exempel en dekorativ utsmyckning – kan du resultatet.

Så testar Silktide detta

Återge varje sida i en datorskärmsstorlek.
Mät den slutliga beräknade storleken på varje synlig textdel efter att all CSS har tillämpats.
Ignorera dold text, text som endast är avsedd för och fragment som är kortare än 2 tecken, till exempel ikonglyfer.
Rapportera text som återges i mindre än 12 pixlar.

Om din webbplats är konfigurerad för att utesluta innehåll från tredje part rapporteras inte text i kända pluginprogram från tredje part.

Felsökning

Texten ser bra ut på min skärm

Högupplösta skärmar och personliga zoominställningar kan få liten text att se acceptabel ut på din dator, trots att den fortfarande är för liten med standardinställningar. Kontrollen mäter storleken i CSS-pixlar som varje besökares webbläsare utgår från.

Hur är det på mobiler?

Textstorleken i den mobila versionen av dina sidor testas separat av liten text (mobil), som använder en gräns anpassad för mobilskärmar.