Prejsť na obsah
EUID Kontrolná služba & pečať, Úvodná stránka
Nechať skontrolovať web

This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung

Prístupnosť

Aký farebný kontrast je potrebný pre text na webových stránkach?

Normálny text potrebuje kontrastný pomer najmenej 4,5:1 k pozadiu, veľký text Tieto prahové hodnoty pochádzajú z medzinárodnej normy WCAG. Uistite sa, že aj ľudia s ubúdajúcim zrakom si môžu prečítať vaše texty a každý návštevník v slnečnom svetle na svojich telefónoch.

Pomer kontrastu, ktorý sa vysvetľuje v každodennom jazyku

Kontrastný pomer opisuje, koľko farby textu a farby pozadia sa líši v ich jase. Čierna na bielej dosahuje maximálnu hodnotu 21:1 a číta bez námahy. Módne svetlo šedá na bielej je často pod 3:1 Nielen zrakovo postihnutí sú postihnutí: Zákazník, ktorý vyhľadáva vaše otváracie hodiny v slnečnom svetle na mobilnom telefóne tiež zlyhá kvôli slabým kontrastom. Prahová hodnota 4.5:1 pre normálny text a 3:1 pre veľký text je kompromis medzi tvorivou slobodou a spoľahlivou čitateľnosťou stanovenou v norme.

To je spôsob, akým naše merania jadra kontrastu

Základné meranie sa vykonáva pomocou skóre sekery: Vypočíta kontrastný pomer medzi farbou textu a pozadia pre texty na vašej stránke. Pre text na fotografiách alebo farebných gradientoch, žiadny nástroj nemôže jednoducho prečítať pozadie Otáča text krátko neviditeľný, fotografuje umiestnenie v prehliadači, počíta jas aktuálneho pozadia pixelov pixelom a určuje skutočný kontrast s farbou textu. A tak sa nerozhodujúci rozsudok stáva rozhodným. Každá porucha musí byť zdokumentovaná v správe s nameranou hodnotou, požadovaným prahom a zdokumentovanou fotografiou obrazovky, Takže môžete vidieť presne, ktorý priechod je ovplyvnený.

Zlepšiť kontrast bez obetovania dizajnu

Dobré kontrasty nenútia čierny a biely dizajn. Zvyčajne to stačí na stmavnutie textovej farby o niekoľko stupňov Pre text na fotografiách, overené rukoväte pomoc: polopriehľadné tmavou plochou za textom, farebný gradient na spodnej strane obrázku alebo prenos textu do pokojnej oblasti obrazu. Zvyčajne nemusíte meniť svoju značku farby pre tento.

Príklady

Sivý text na bielom

Nesplnené
body { color: #999999; background: #ffffff; }  /* 2,8:1 */
Plná
body { color: #595959; background: #ffffff; }  /* 7,0:1 */

Limit pre normálny text je 4,5:1, pre veľký text z 24 pixelov 3:1. Hodnota je uvedená v skúšobnom protokole podľa referencie.

Biele písmo o farbe značky

Nesplnené
.knopf { color: #fff; background: #5aa9ff; }  /* 2,5:1 */
Plná
.knopf { color: #fff; background: #1a5fb4; }  /* 6,3:1 */
  • Pozrite sa na svoje webové stránky a šedá text prvý.
  • Požiadajte svoju agentúru, aby skontrolovala všetky textové farby oproti prahovým hodnotám 4.5:1 a 3:1 a zdokumentovala hodnoty.
  • Text na fotografie s polopriehľadným tmavým povrchom namiesto ponechania čitateľnosti na obrázok.
  • Pozrite sa na svoju stranu v jasnom dennom svetle na telefóne, čo nakláňa tam vždy náklony pre slabozrakých návštevníkov.
  • Zadajte testované farebné kombinácie vo svojom návrhu manuálu tak, aby nové stránky prijať.

Deutsche Fassung dieser Seite

  • Pečať Digitale Barrierefreiheit
  • Pečať Daten & Recht
  • Pečať Technische Qualität
  • Pečať Digital Excellence
  • Pečať Cyberversicherung

Skontrolované. Pre lepšiu digitálnu budúcnosť.euid.com