Kontrolní seznam dostupnosti webu (WCAG): Nechte, aby váš web fungoval pro všechny.

Je váš web „Zavřený dveře“, dát miliony zákazníků? Otevřete přístup k kontrolnímu seznamu dostupnosti webu (WCAG), který musí každý vědět.
Představte si ... máte obrovský marketingový rozpočet. Střílejte silně web je navržen krásně. Ale existuje skupina lidí, kteří „chtějí koupit“ vaše produkty budou chybět, ale nemohou ... ne proto, že nemá peníze, ale proto, že pro něj váš web „použit“
Tato skupina lidí může být zrakově postižena pomocí čtenářů obrazovek, ale váš web nemá vysvětlení. Nebo mohou být starší, že ruce se začnou chvějí, vás nutí kliknout na své malé tlačítko nebo dokonce na osobu s dočasnými zbraněmi, které myši nemohou snadno použít ... jsou to všichni „zákazníci“, které tlačíte, aniž byste to věděli.
Tento problém není malá záležitost. A ve věku už není vzdálená záležitost, že každý mluví o rovnosti a má webovou stránku, ke které má každý přístup nebo dostupnost na webu, není jen „dobré věci“, ale je to „standard, který potřebuje“ odemknout obrovské obchodní příležitosti. A zabránit právnímu riziku, ke kterému může dojít v budoucnosti
Výzva: Střední obrázky rozdělené obrazovky. Jedna strana je obrázek zákazníka, který se snadno usmívá. Druhou stranou je obrázek zákazníka, který má oční vady. (Vedle bílého personálu může být symbol). Při pokusu o používání stejného webu dělám zklamání. Ale jeho obrazovka počítače ukazuje zkreslení předávání překážek v přístupu
Proč se krásný web stává „zdi“ blokující zákazníky?
Tento problém vyplývá z „slepých míst“, která mnoho podniků přehlíží. Máme tendenci být posedlí designem webu na „krásnou“ v očích většiny lidí, dokud nezapomeneme, že „dobrá zkušenost“ každého člověka není stejná. Hlavním důvodem je:
- Zaměřte se spíše na „obrázky“ než na „strukturu“: Designéři a obchodníci mají tendenci se zaměřit na krásu rozvržení, barvy a animace, ale zanedbávání správné struktury HTML, která je klíčem k pomoci technologii (asistenční technologie), jako je čtečka obrazovky, může na webu „porozumět“ a „komunikaci“.
- Problém a nedorozumění: Mnoho lidí si myslí, že dostupnost webu je otázkou pouze „malých osob se zdravotním postižením“, ale ve skutečnosti to souvisí s mnoha lidmi. Oba starší lidé, lidé s dočasným postižením (jako jsou zlomené zbraně), nebo dokonce lidé v omezené situaci (jako je použití webu na slunci, která není vidět v malé kontrastní barvě). Z údajů v roce 2022 má Thajsko asi 4,19 milionu lidí se zdravotním postižením nebo asi 6% celkové populace. Toto je trh, který nemůžete přehlédnout.
- Myslím, že je to technika, která „komplikovaná a drahá“: Slovo „standardní“ nebo „WCAG“ může znít děsivě a plné technických termínů. Způsobit, že majitel firmy cítí, že se jedná o vzdálenou záležitost a musí investovat vysoko, i když skutečně spuštění dostupnosti může začít od malého bodu, který může použít velmi málo rozpočtu
Promptova: Jednoduché infographic obrázky ukazují obraz mozku s zařízením uvnitř, ale vychází nějaké vybavení s ikony, ušima a rukama tvarovanými na očí, s krátkou zprávou „zaměřením pouze na vizuální prvky“, „nedostatek vědomí“, „se zdá být komplikovaný“, aby zprostředkoval příčinu problému.
Odcházejte ... riskantní, než si myslíte! Dopad, když váš web „nevíta“
Úvod do dostupnosti webu nejen chybějící obchodní příležitosti, ale je to riziko vaší značky v mnoha dimenzích.
- Ztráta příjmu a zákazníka: To je nejjasnější účinek. Uzavíráte příležitost prodat s velkou skupinou zákazníků s kupní silou. Ať už přímo na zdravotně postižené nebo jejich rodiny a přátele, kteří se rozhodnou podporovat značky, které se starají o všechny skupiny
- Právní riziko: V mnoha zemích po celém světě existuje mnoho soukromých společností, které nevytvářejí webové stránky pro zdravotně postižené. Pro samotné Thajsko se jedná o propagaci a rozvoj kvality života zdravotně postižených 2007 a souvisejících ministerských předpisů, které podporují právo na přístup k informacím a službám. Ačkoli současných 100% soukromého sektoru nemusí být tak intenzivní jako vládní agentury, ale to je trend světa, který musí být připraven podnik, který vypadá daleko.
- Break the Brand's Cidibility (Brand Trust): V éře, kdy se spotřebitelé rozhodnou podporovat značku z „hodnoty“, kterou značka drží, má web, který odrazuje od skupiny lidí, kteří jsou schopni vytvořit negativní a zničený obrázek, který kompozice vytváří na webu. Které se snažíte vytvořit
- Ovlivňující SEO: Google je pro uživatelskou zkušenost (UX) velmi důležitý. Webové stránky s tvrdým přístupem mají často vysokou míru opuštění, nízkou stránku, která je pro SEO špatným signálem. Kromě toho mnoho prvků dostupnosti, jako je použití správných značek, ALT text a jasné struktury, má také přímý vliv na hodnocení a základní webové vitály .
Výzva: Obrázek ukazuje 4 efekty ve formě 4 karet: První karta má obrázek peněz odletěných pryč, druhým listům je kladivo, třetí list je zlomené logo značky a čtvrté listy jsou grafy SEO, které mají červené tón, aby přenesly riziko.
Otevření písem pro řešení problémů: Počínaje 4 principy WCAG
Nebojte se. Přístup k webu není tak obtížné, jak si myslíte. Její srdce je v mezinárodním standardu s názvem Pokyny pro přístupnost webového obsahu (WCAG) , který je rozdělen do 4 hlavních principů, které si snadno zapamatují „Pour“. Podívejme se, co je každá položka a jaký kontrolní seznam začnete okamžitě?
1. vnímatelné (vnímání) - umožňující uživatelům rozpoznat obsah prostřednictvím různých smyslů
- [] Všechny obrázky musí mít vysvětlení (alt text): Napište, co je ten obrázek. Aby bylo možné přečíst program čtečky obrazovky pro zrakově postižené
- [] Video a zvukové soubory musí mít jiné možnosti: například titulky pro neslyšící nebo zvukový popis pro slepé lidi a přepis.
- [] Barva, která musí být správně v rozporu: text a pozadí musí mít dostatečný kontrastní poměr (alespoň 4,5: 1 pro normální text), aby se lidé s rozmazanou nebo slepotou snadno činili.
- [] Nekomunikujte pouze s barvami: například vytvoření odkazu na jen červenou bez níže může způsobit slepotu barev, nevíte, zda se jedná o odkaz
2. Operace (dostupné) - umožňuje uživatelům ovládat a používat různé webové komponenty.
- [] Všechny funkce musí být použity prostřednictvím klávesnice: Uživatelé, kteří nemohou použít myš, musí být schopni stisknout kartu, aby se posunula na odkaz, tlačítko a různé formy.
- [] Žádná „past na klávesnici“: Uživatelé musí použít klávesnici k přesunu a „vyjít“ z různých částí webu, nikoli v vyskakovacím okně.
- [] Dejte dostatek času na uživateli: Pokud existuje automatická relace, měly by existovat možnosti, jak uživatelé požadovat včas.
- [] Vyhněte se vážnému blikajícímu obsahu: Světlo, které bliká (více než 3krát za sekundu), může u některých lidí stimulovat záchvaty.
3. Přijatý (snadno srozumitelný) - Vytvoření obsahu a použití není příliš komplikované.
- [] Používejte jasný a jednoduchý jazyk: Vyvarujte se technické slovní zásoby nebo průmyslovým slovníkem bez vysvětlení.
- [] Navigace a navigace musí být předpovězena: Navrhněte nabídku a rozvržení, které mají být konzistentní na každé stránce, aby se uživatelé mohli naučit a snadno používat.
- [] Existuje jasná chyba: Když uživatel vyplní špatně, musí mít špatnou zprávu, že „kde je špatně“ a „jak opravit“ nejen říkat „chyba“
4. Robustní (odolný) - umožňující webu pracovat s různými technologickými stabilními
- [] Pomocí standardního kódu HTML: čisté a správné struktury kódu (například použití značky
,,
,,Být odpovědný) pomůže programu pomoci číst nejlepší práci
- [] Komunikujte stav a změny v programu, abyste pomohli číst: Například, když je produkt přidán do koše, měl by existovat kód, který varuje program, který pomůže číst a oznámit.
Pokud chceme studovat více informací o oficiálních zdrojích iniciativy W3C Web Accestaintibility Initiative (WAI) a komunita jako projekt A11Y, je vynikajícím výchozím bodem.
Výzva: Krásný infographic, rozdělený na 4 díly podle Pour (vnímatelné, operační, nestabilní, robustní). Každá část má hlavní ikonu (jako je tvar ruky, tvar mozku, ozubená kola) a krátký kontrolní seznam 2-3 pod ní.
Příklady ze skutečné věci: Když „online obchody“ zvýší tržby o 20% s dostupností.
Představte si „Baan Bakery“, slavný online dezertní obchod. Nejprve je web velmi krásný. Od starších zákazníků však obdržela zpětnou vazbu, že malá písmena byla obtížně přečtena a „přidávací tlačítko do koše“ bylo tak lehké, že se nemohlo vidět, že se tým rozhodl přepracovat. Velká dostupnost
Co dělat: Nezastavují web. Ale počínaje aktualizací podle úrovně AA WCAG. Upravují tlačítko barev tak, aby bylo tmavší. Zvyšte velikost písma o něco větší, přidejte do koláče alt text, který „jahodový, měkký dort, přelitý bobulovou omáčkou“ a ujistěte se, že si zákazníci mohou objednat každý krok pomocí pouze klávesnice.
Úžasné výsledky: Pouze 3 měsíce po prodeji „Baan Bakery“ se zvýšily téměř o 20%, a to nejen ze starších lidí. Stále však získejte nové zákazníky, kteří obdivují pozornost značky, které dostali 5 -star recenze s komentáři, které „děkuji za vytvoření webové stránky pro naše rodiče, aby se snadno používali“. Toto je síla designu pro všechny. To se mění z návrhu UX/UI na normální a vytvořit zážitek z „krytí“ a „Vytváření prodeje“
Výzva: Obrázky stránky produktu na webových stránkách „Bake Bakery“ na boku ukazují světla barevná tlačítka a malá písmena. After ukazuje tmavé tlačítko, které jasně kontrastuje s pozadím. Dopisy se snadněji čte. S malým grafem, který ukazuje nárůst prodeje
Kontrolní seznam připraven jít! Okamžitě začnete „upgradovat“ svůj web.
Přečtěte si zde, pravděpodobně to chcete udělat, že? Zkuste použít tento kontrolní seznam zkratky pro prozkoumání vašeho webu. A začněte malým vítězstvím (rychlé výhry):
- Prozkoumejte domovskou stránku: Všechny důležité obrázky, má text alt, který znamená? Zkuste zkontrolovat nástroj pro rozšíření v prohlížeči.
- Test pomocí klávesnice: Zkuste položit myš dolů. A pro surfování vašeho webu použijte pouze kartu, přesun+kartu, zadejte tlačítko a mezerník. Můžete jít do nabídky, stisknout tlačítko a úspěšně vyplnit formulář?
- Česká barva kontrastu: Použití online nástrojů (vyhledávání „Color Contrast Check“) pro zrušení barvy znaků a barvy pozadí tlačítka (jako je tlačítko nákupu, kontaktní tlačítko).
- Přečtěte si znovu svůj obsah: Existuje terminologie nebo věta, která je příliš komplikovaná? Zkuste jej přizpůsobit jazyku, kterému lidé obecně rozumějí.
- Podívejte se na vaše videa Offscale: Stále chápete veškerý obsah prostřednictvím titulků?
Právě začíná z těchto 5 položek, je to považováno za skvělý krok. A pokud se chystáte vytvořit nový web, který tyto příběhy přináší do části procesu vývoj organizačních webových stránek od začátku, pomůže ušetřit spoustu času a nákladů.
Výzva: Obrázky kontrolního seznamu, které mají levné pole s ikony pro každou položku, jako jsou ikony, ikony kečtu, dvěma -rozložené kruhy (místo kontrastu), ikony knih a ikony tlačítka přehrávání.
Otázky, které lidé mají tendenci přemýšlet (a jasná odpověď)
Otázka 1: Zpřístupnit dostupnost a web bude vypadat nudně, ne tak krásně jako předtím?
A: Není to pravda! Toto je nejčastější nedorozumění. Přístupný design je „inteligentní“ design, nikoli „nudný“ design. Schopnost vytvořit web, který je krásný a dostupný pro všechny a zároveň je to výzva, která pomáhá zvýšit kreativitu dokonce.
Q2: Potřebujete hodně rozpočtu? Musí naše malá firma dělat?
Odpověď: Nemusíte dělat všechno 100% perfektní. Počínaje „ovocem s nízkým vztahem“ nebo něčím, co je snadno opravitelné, například přidání textu ALT nebo nastavení barevného tlačítka. Téměř nemusíte utratit více rozpočtů, které nejvýhodnější investicí je vytvořit „povědomí“ ve vašem týmu a pro malé podniky je to příležitost vytvořit výhodu v soutěži a vytvořit věrnou zákaznickou základnu pro vaši značku.
Q3: WCAG má úroveň A, AA, AAA. Na jakou úroveň bychom měli zaměřit?
Odpověď: Pro většinu obchodních webů a organizací AA zlatým standardem, který je přijímán po celém světě. Vytváří dobrou rovnováhu během přístupu k pokrytí a možnostem v praxi. Soulad s tímto standardem je také v souladu s pokyny požadavků na webové společnosti nebo důvěryhodnost pro webové kanceláře, které zdůrazňují průhlednost a standard
Q4: Jaké nástroje můžete zkontrolovat?
Odpověď: Existuje mnoho skvělých automatických nástrojů pro spuštění, jako jsou Wave, Ax Devtools (Prodloužení prohlížeče) nebo Lighthouse v Chrome Devtools. Základní dostupnost, ale pamatujte, že tyto nástroje mohou pomoci odhalit pouze 30-40% problému. Testování skutečným testováním je stále nejdůležitější.
Výzva: Obraz člověka sedícího se sedí na pohodlné židli. Spolu se symbolem otázek a odpovědí vznášejících se kolem něj. Smiley tvář ukazuje důvěru a úlevu od úzkosti.
Je čas otevřít dveře a přivítat všechny zákazníky.
V tomto okamžiku doufám, že uvidíte, že dostupnost webu nejen záležitost složitých technik nebo děsivé právní zátěže, ale je to „srdce“ podnikání v nové éře. Má změnit pohled z dotazu „Co prodáváme?“ Chcete -li se zeptat „Jak můžeme dát nejlepší zkušenosti„ všem “?“
Investice do přístupnosti je investice, která poskytuje výnosy z hlediska čísel (prodej, míra konverze), lásku značky, důvěra a co je nejdůležitější, být součástí vytváření umělé digitální společnosti a nikoho nezanechává za sebou
Nečekejte, až se váš web stane „překážkou“, která již blokuje zákazníky. Začněte prozkoumat svůj web ještě dnes pomocí jednoduchého kontrolního seznamu, který jsme poskytli, a vytvořili otevření dveří, aby zákazníci přivítali „všichni“, je novým standardem vaší firmy.
Chcete, aby váš web nejen krásný, ale také připraven přivítat všechny zákazníky a vytvořit hmatatelné obchodní výsledky, že? Poraďte se s odborníkem na dostupnost UX/UI a webu. Naše se dostane zdarma! Jsme připraveni vám pomoci vytvořit skvělý web pro všechny.
Nedávný blog

Chcete prodat po celém světě? Porovnejte výhody disAdvanty během používání trhů Shopify a aplikací pro překlad jazyků. (Mullingual Apps) pro výběr systému, který je nejvhodnější pro váš obchod.

Přidejte zákazníky k pronájmu se SEO! V -DEPTH, SEO strategie pro půjčovny podniků, zejména z místního SEO na stránku produktu.

Přestaňte plýtvat časem, aby se hlásila! Naučte se, jak se připojit k N8N s Google Looker Studio (Data Studio) a vytvořit palubní desku a automatický marketing.