Čitelnost textů na webu

Určitě víte, že texty jsou důležité jak pro vyhledávače, tak i pro lidi. Měli byste si však uvědomit, že nejen čtivost a kvalita textových informací, ale také jejich čitelnost významně ovlivňují kvalitu vašeho webu a jeho výsledky. Nesmíte totiž zapomínat, že na webu se stále častěji pohybují lidé vyššího věku, kteří již nemusejí mít zrak jako ostříž. Stejně tak na váš web mohou přijít lidé s nějakým zrakovým postižením anebo jen mají třeba starým CRT monitor. Sami sebe představte, co vidíte, když vám do monitoru svítí sluníčko. Ve všech takových případech je důležité, aby texty vašeho webu byly dostatečně kontrastní vůči pozadí a velikost písma byla dostatečně veliká.

Myslete na všechny tyto možnosti a nepřipravujte se sami o návštěvníky svého webu.

Sami posuďte, který text je čitelnější:

nebo tento text?

A co tento případ?

Který z dvou výše uvedených obrázků je čitelnější?

Jak sami na příkladech vidíte, čitelnost textů může významně ovlivnit použitelnost webů. Pokud například jsou špatně čitelné text v navigaci, může to zcela znemožnit procházení vašeho webu.

Color Contrast Analyzer

Jak si můžete sami zkontrolovat čitelnost textů na svém webu? Je to velmi jednoduché, stáhněte si aplikaci Color Contrast Analyzer, který na uvedeném webu existuje v i v české verzi. Nemusíte vůbec nic instalovat, jen rozbalíte ZIP archív na svůj disk, spustíte soubor a můžete ihned kontrolovat čitelnost textů na svém webu. Ovládání programu je velmi jednoduché a hlavně je vše česky. Na webu najdete také podrobnou nápovědu, které je sice jen anglicky, ale díky množství obrázků lze pochopit snadno jeho základní funkce. V krátkosti, jeho princip je v tom, že pomocí kapátka si označíte barvu popředí a druhým kapátkem barvu pozadí a ihned vidíte, výsledek.

V případě, že si zaškrtnete volbu Zobrazit detaily, vidíte i konkrétní hodnoty.

Tento nástroj mohou využít i grafici při svých návrzích, když zadají barvu pozadí a popředí přímo pomocí hexadecimálního či RGB zápisu (Možnosti > Výběr zápisu barev).

  1. Dodržujte dostatečný kontrast textů vůči pozadí
  2. Grafika či obrázky na pozadí výrazně snižují čitelnost textu.

Velikost písma, řádkování

Dalšími důležitými drobnostmi, které mohou výrazně ovlivnit čitelnost textů je velikost písma a řádkování textu. Podívejte se opět na příklady a sami posuďte, jaký text je nakolik čitelný.

velikost písma 10px, řádkování 100 %

velikost písma 12px, řádkování 140 %

Dva příklady výše znázorňují rozdíl v čitelnosti textu ve spojení s velikostí písma i velikostí řádkování.

  1. Používejte vždy dostatečnou velikost písma , nejlépe vždy v relativních jednotkách (em, %).
  2. Pro češtinu používejte řádkování alespoň 130%.
  3. Dostatečně opticky oddělujte jednotlivé odstavce.
  4. NIKDY NEPOUŽÍVEJTE VELKÁ PÍSMENA PRO CELÉ VĚTY.

1 komentář u Čitelnost textů na webu

  1. Filosof napsal:

    Mám rád články plné zvolání bez jakýchkoliv zdůvodnění. Víš např. proč nepoužívat jen verzálky? Co je příčinou jejich nižší čitelnosti? Jak volit správně délku řádku a proč zrovna takto? (btw. extrémně důležitý parametr z pohledu čitelnosti) :-)

Napsat komentář

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

Můžete používat následující HTML značky a atributy: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>