Aký je pomer WCAG? Prečo by ste to mali implementovať do svojich návrhov

Smernice o prístupnosti webového obsahu (WCAG) sú usmerneniami prístupnosti pre digitálny a webový dizajn. Dodržiavanie týchto pokynov zaisťuje, že farby sú dostatočne kontrastné, aby pomohli ľuďom so zrakovým postihnutím správne vidieť a čítať vaše návrhy. To ide ruka v ruke aj s typografickou veľkosťou, aby sa zabezpečila jej čitateľnosť spolu s farbami.

Vo svete, ktorý by mal byť inkluzívnejší, pridanie prístupných prvkov do vašich návrhov len pozdvihne vašu prácu a umožní vám ju zdieľať s viacerými ľuďmi.

Aký je pomer WCAG?

WCAG znamená Pokyny na prístupnosť webového obsahu. WCAG pomáha každému, kto navrhuje alebo vytvára pre web alebo internet, aby zabezpečil, že ich návrhy dosiahnu ciele dostupnosti. To znamená, že vaše návrhy si môže užiť a používať ktokoľvek, bez toho, aby ste vylúčili ľudí so zrakovým postihnutím alebo iným postihnutím, ak je to možné.

Pomer WCAG nastavuje minimálne pomery na dosiahnutie cieľovej dostupnosti. To zahŕňa farebný kontrast a veľkosť textu, ktoré zaisťujú, že ľudia so zrakovým postihnutím majú väčšiu šancu vidieť vaše návrhy, interagovať s nimi a používať ich. Dosiahnutie pomeru WCAG nielenže pomáha ľuďom so zrakovým postihnutím, ale tiež zvyšuje používateľskú skúsenosť pre všetkých používateľov webu.

The World Wide Web Consortium vyvíja štandardy pre vývoj webových aplikácií. Hoci neexistujú žiadne stanovené pravidlá pre prístupnosť webu, WCAG stanovuje štandard, ktorý by mal dodržiavať každý webový dizajnér.

Pri testovaní kontrastných pomerov WCAG navrhuje hodnotenie A až AAA. Hodnotenie A zobrazuje najnižšie úrovne kontrastu. AA sú úrovne kontrastu stredného rozsahu s pomerom 4,5:1, čo sa považuje za minimálny pomer. Nakoniec, AAA je najvyššia úroveň kontrastu. Ak navrhujete pre každého, vaše úrovne kontrastu sú najlepšie medzi rozsahom AA a AAA.

Prečo je pomer WCAG dôležitý v grafickom a webovom dizajne?

Grafický dizajn a webdizajn by nemali len vytvárať pekné informácie. Informačný dizajn informuje masy – to znamená sprístupniť vaše informácie všetkým. Implementácia WCAG zaisťuje dostupné návrhy pre ľudí so zrakovým postihnutím, dyslexiou, neurodivergenciou alebo čímkoľvek, čo ovplyvňuje niečí zrak alebo schopnosť čítať.

Webový a digitálny dizajn – ako aj programovanie – už zaviedli funkcie dostupnosti. Napríklad, Systém Windows poskytuje používateľom užitočné nástroje na zjednodušenie ovládaniaa väčšina videí YouTube ich už bežne ponúka titulky alebo titulky. Vždy však môžeme zlepšiť dostupnosť.

Globálny dizajn vytvára lepší dizajn. Čím viac ľudí dokáže zaujať váš návrh, tým je úspešnejší a má väčší dosah. Nielenže je pre vás ako dizajnéra dobré osloviť viac ľudí, ale pre svet je lepšie, že je vylúčených menej ľudí.

Navrhovanie s pomerom WCAG a funkciami dostupnosti vo vašich návrhoch bude mať pozitívny vplyv na farebné palety, výber typografie a veľkosti textu. Zámerne by ste nenavrhli niečo, čo je ťažko čitateľné, tak prečo by ste nezahrnuli viac spôsobov, ako vytvoriť návrhy s lepšou čitateľnosťou pre všetkých ľudí?

Implementácia pomeru WCAG do vašich návrhov

Existujú miesta, kde môžete skontrolovať pomer WCAG vo svojich návrhoch, ako napríklad toto kontrola kontrastu webovej stránky. Mali by ste sa však pustiť do praxe implementácie prístupných dizajnových prvkov do vašej práce bez toho, aby ste sa spoliehali na to, že budete porovnávať s úplným minimom.

Treba poznamenať, že pokyny na kontrast sa nevzťahujú na dizajn loga. Je to spôsobené tým, že logá sú prezentované v rôznych veľkostiach a často na rozdielnom pozadí. Nezaškodí vám však zvážiť pomer WCAG pri navrhovaní log.

Vysoko kontrastné farby

Použitie farieb s vysokým kontrastom je jednoduchý spôsob, ako dodať svojim návrhom inkluzívnosť. Farby, ktoré sú navzájom kontrastné, pomôžu ľuďom so zrakovým postihnutím a farbosleposťou lepšie vidieť vaše návrhy. Nielen to, ale dokonca aj ľudia bez zhoršenia zraku lepšie uvidia – a zapoja sa – do vašich návrhov.

Skúsili ste niekedy prečítať svetloružový text na svetlozelenom pozadí? je to takmer nemožné. Ale tmavomodrý text na svetložltom pozadí je oveľa ľahšie viditeľný a čitateľný.

Farby s vysokým kontrastom fungujú najlepšie pri umiestňovaní textu na farebné pozadie alebo pri použití malých ciest v ilustráciách. Khroma je generátor farebnej palety AI, ktorý je dodávaný so vstavanou kontrolou kontrastu – jedným z mnohých skvelých Nástroje AI, ktoré vám pomôžu pri práci s grafickým dizajnom.

Skvelý spôsob, ako skontrolovať kontrast, je zmeniť dizajn na odtiene sivej. Ak dokážete oddeliť farby a rozumiete dizajnu v čiernej a šedej farbe, malo by sa to dobre premietnuť aj do vami zvolených farieb.

Veľkosť textu

Okrem toho, že farby textu sú dostatočne kontrastné voči farbám pozadia, váš text by mal byť dostatočne veľký, aby sa dal ľahko čítať. Pomer WCAG pre veľký text je 3:1.

Veľkosť textu nie je rovnaká vo všetkých typografiách, takže sa nespoliehajte na veľkosť 12 bodov – ktorá sa zvyčajne považuje za minimálnu veľkosť pre štandardnú čitateľnosť – pre všetky písma. Vyskúšajte si ich sami alebo pomocou používateľských testerov zobrazením alebo tlačou návrhov v skutočnej veľkosti. Ak vaše farby nie sú tak dobre kontrastné, väčší text pomôže čitateľnosti ako riešenie.

Čitateľnosť písma

Je samozrejmé, ale písma, ktoré si zvolíte vo svojich návrhoch, musia byť ľahko čitateľné. Ozdobné písma, kurzíva alebo ručne kreslené písma majú často problémy s čitateľnosťou. Heavymetalové skupiny sú známe tým, že napríklad pre logá svojich skupín používajú ťažko čitateľné typy písma.

Mali by ste zvážiť aj kerning a sledovanie pri použití textu pre malé vzory. Medzery medzi písmenami môžu tiež ovplyvniť zamýšľanú čitateľnosť slov.

Inkluzívne faktory dostupnosti

Zatiaľ čo v pomeroch WCAG sa berú do úvahy iba farebný kontrast, veľkosť písma a čitateľnosť textu vo webovom dizajne, všetky svoje webové a grafické návrhy by ste mali robiť s ohľadom na inkluzívnosť.

Ak ste webový dizajnér a pracujete s programátorom alebo programátorom, uistite sa, že áno pomocou techník HTML, ktoré pomáhajú pri prístupnosti webu. Existujú tiež funkcie dostupnosti v Canve rozšíriť dosah vašich návrhov u vášho publika.

Nemali by ste sa zastaviť len pri minimálnych požiadavkách na pomery WCAG; ak máte kontrolu nad pridávaním alternatívneho textu k obrázkom, titulkov k audio alebo video súborom alebo dokonca užitočné znenie textu pre hypertextové odkazy – ktoré čítačky obrazovky čítajú nahlas – by ste mali ísť vyššie a mimo. Zahrnutie funkcií dostupnosti nevylučuje žiadne publikum – iba pozýva viac ľudí.

Navrhovanie s pomerom WCAG zlepšuje dizajn pre všetkých

Štandardy pre webový dizajn pochádzajú od World Wide Web Consortium, komunity, ktorá pomáha pri osvedčených postupoch na webe. Konzorcium vyvinulo Smernice dostupnosti webového obsahu, ktorými by sa mali webdizajnéri riadiť. To poskytuje pomerový štandard pre kontroly viditeľnosti pri navrhovaní pre web.

Dodržiavanie týchto pokynov a štandardov pomeru znamená, že k vašim webovým návrhom má prístup viac ľudí.