Přístupnost

Jak stavíme pro uživatele klávesnice, čteček obrazovky, slabozraké a méně technicky zdatné uživatele. Upřímný, datovaný snímek stavu.

Tuto stránku píšeme stejně jako zbytek webu: co funguje, co nefunguje a jak si to sami ověřit. Je datovaná, protože přístupnost je pohyblivý cíl. Znovu testujeme po každém větším vydání.

Formální prohlášení o přístupnosti

Cílený standard

WCAG 2.2 AA v celém rozsahu zkušenosti. Úroveň AAA pro zobrazení fokusu (silné vysokofrekvenční prsteny, nezakryté) a pro označování polí formuláře + obnovu po chybách. Sledováno vůči doporučení W3C, nikoli parafrází.

Poslední interní audit

2026-04-19. Ruční průchod naším týmem vůči domovské stránce, print-size, rozbočovači /standards/ + 9 autoritativním stránkám a 45 vstupním stránkám platebních schémat.

Externí audit

Zadáno, zpráva čeká na vydání. Publikujeme po přijetí na /accessibility/audit/ s poznámkami k nápravě, nedostatky zachovány, bez výběru.

Cadence opakovaných testů

Měsíční průběžná kontrola + úplný ruční průchod po každé větší změně uživatelského rozhraní. Automatické kontroly (linting kontrastu, sken nových kritérií WCAG 2.2) se spouštějí při každém nasazení.

Kontakt + SLA

hello@abundera.ai, hlášení o přístupnosti potvrzujeme do 2 pracovních dnů, triáž do 5, a blokátory klávesnice / čtečky obrazovky / kognitivní blokátory považujeme za prioritní problémy (odesíláme před funkční prací).

Shoda s WCAG 2.2 AA podle kritéria úspěchu

Nová kritéria ve verzi 2.2, která aktivně sledujeme. Stav odráží, co jsme interně ověřili; externí audit bude nadřazený.

Podpora pohybu a vynucených barev

• prefers-reduced-motion: reduce, plovoucí ambientní orb a přechody zhasínání jsou potlačeny. Funkční přechody zůstávají krátké. Ověřeno pomocí funkce macOS Reduce Motion a deaktivací „Zobrazit animace" ve Windows.
• forced-colors: active (režim vysokého kontrastu Windows), prstence fokusu používají systémovou barvu Highlight; ohraničení dědí systémový CanvasText. Ověřeno v Edge na Windows 11 High Contrast.

Známá omezení

• JAWS zatím nebyl testován. Příští kolo AT se zaměří na JAWS na Edge na Windows 11.
• Business Card Designer je primárně pro myš kvůli přetahování náhledu. Každý ovládací prvek má alternativu klávesnice, ale cyklus živé zpětné vazby je stále vizuální. Barevné vstupy, mřížka předvoleb a hexadecimální pole nyní mají explicitní ARIA vazby (2026-04-19).
• Zpráva externího auditu čeká na vydání. Stav vlastní atestace v tabulce výše bude nahrazen zjištěními auditora po obdržení zprávy.
• Některé asistenční technologie třetích stran (Dragon NaturallySpeaking, hlasový vstup na Androidu) nejsou v naší regresní matici; přijímáme zprávy od komunity a opravujeme po jednotlivých tiketech.

Changelog přístupnosti

• 2026-04-19 (PM), Opraveno dvojité spuštění živé oblasti TalkBack: aria-live="polite" odstraněno z obalu #qr-preview; oznámení nyní přichází pouze z odznaku role="status" skenovatelnosti, jednou za generování. Modál BCD: barevná výběrová tlačítka získala správné vazby <label for> (Pozadí, Text, Akcent, Přechod); kontejner mřížky předvoleb získal role="group" + aria-label. Tabulky přístupnosti získaly <caption> + scope="col"/"row", WCAG 2.2 AA + matice AT nyní správně oznamují na VoiceOver, NVDA a TalkBack.
• 2026-04-19 (AM), Vylepšeny indikátory fokusu (3 px + záložní box-shadow). Přidána podpora forced-colors + prefers-reduced-motion. Audit velikosti cíle: .saved-profile-delete, .type-search-clear, .compat-toggle-btn zvýšeny na ≥ 28 px. Opraveno přeskočení úrovně nadpisů (podnadpisy vCard/MECARD h4 → h3). Publikováno formální prohlášení WCAG 2.2 AA + matice AT.
• 2026-04-18, Zdokumentován ruční průchod základní linií WCAG 2.2 AA. Čtyřpilířový pás důvěry sbalený pro čistší hierarchii.
• 2026-03-08, Zveřejněna počáteční stránka /accessibility/.

Co se zavazujeme dodržovat

• Úplná navigace klávesnicí. Každý ovládací prvek generátoru, každý modál a každý exportní tok je dostupný bez myši.
• Viditelné stavy fokusu. Zaměřené vstupy, tlačítka a odkazy zobrazují jasný prstenec. Nespoléháme pouze na barvu.
• Popisky u každého pole. Vstupy formuláře mají přidružené elementy <label> nebo atributy aria-label. Text zástupného symbolu se nikdy nepoužívá jako jediný popisek.
• ARIA živé oblasti pro náhled QR a toasty. Čtečky obrazovky slyší „QR vygenerován" a zprávy toastů, když jsou spuštěny, nejen když se na ně přesune fokus.
• Textové alternativy pro tlačítka pouze s ikonami. aria-label na každém tlačítku pouze se SVG.
• Barevně nezávislý význam stavu. Odznaky skenovatelnosti a čipy kompatibility kombinují barvu s glyfem a textovým popiskem.
• Explicitní názvy formátů exportu. Tlačítka stahování říkají „Stáhnout PNG", „Stáhnout SVG" atd., ne jen „Stáhnout".
• Velké mobilní cíle pro dotyk. Interaktivní prvky mají alespoň 44 × 44 CSS pixelů na hrubých ukazatelích, dle WCAG 2.5.8.
• Respektování redukovaného pohybu. Přechody jsou zakázány při prefers-reduced-motion: reduce.

Kde stále zaostáváme

• JAWS zatím nebyl testován. Licence JAWS získána, testovací slot zarezervován pro příští kolo AT. Všechny ostatní hlavní (VoiceOver macOS + iOS, NVDA, Narrator, TalkBack) prošly nejnovější regresí.
• Business Card Designer je primárně myší (přetahování, náhled plátna). Alternativy klávesnice existují pro každý ovládací prvek, ale cyklus živé zpětné vazby náhledu je stále primárně vizuální. Barevné ovládací prvky nyní používají správné vazby <label for> + role="group" na výběru předvoleb (2026-04-19).
• Složité toky generátoru (hromadné CSV, vícekrokový průvodce) by mohly mít lepší strukturu přeskočení odkazů. Plánováno.
• Popisné souhrny tabulek. Tabulky přístupnosti + kompatibility nyní mají atributy <caption> + scope (2026-04-19). Delší narativní souhrny na úrovni řádků pro každý řádek jsou stále plánovány.

Matice podpory asistenčních technologií

Technický artefakt, nikoli PR prohlášení. Každý řádek je reálná kombinace prohlížeče + AT + platformy, kterou jsme fyzicky testovali. Stav odráží nejnovější ruční průchod; upozornění zaznamenávají vše, co stále brání úplnému průchodu.

Cadence vydání: matice se znovu spouští po každé větší změně uživatelského rozhraní. „Prošlo" = žádný blokátor; upozornění jsou kosmetické nebo regrese s úzkým rozsahem zařazené pro příští vydání. „Netestováno" = kombinaci jsme fyzicky ještě nespustili, říkáme to místo vynechání.

Mapa klávesnice

• Tab / Shift+Tab: pohyb vpřed / zpět zaměřitelnými prvky.
• Enter / Space: aktivace tlačítek a přepínačů.
• Šipkové klávesy: pohyb mezi možnostmi uvnitř skupiny přepínačů (selektor typů, výběr šablony, panel karet).
• Escape: zavření modálů (Business Card Designer, předletová kontrola, tiskové služby, ořez obrázku).
• Home / End uvnitř přetékající nabídky skočí na první / poslední položku.

Interní audit, 2026-04-19

Ruční průchod WCAG 2.2 AA vůči domovské stránce, /print-size/, novému rozbočovači /standards/ + 9 autoritativním stránkám a 45 vstupním stránkám platebních schémat (které dědí ze sdílené šablony). Co jsme ověřili, co jsme opravili a co je otevřené:

Ověřeno jako splněné

• Cíl přeskočit odkaz existuje, přeskočit odkaz (href="#generator") se přeloží na viditelný prvek na každé variantě stránky.
• Styly focus-visible, :focus-visible je deklarován globálně s 2px obrysem, plus přepsání per-vstup s barevným ohraničením + stínem. Potvrzeno prostřednictvím auditu CSS na řádcích 34 a 88 souboru site/css/style.c17bfd85.css.
• Všechny vstupy formuláře mají popisky, každý <input> / <select> / <textarea> v generátoru má buď explicitní <label for="..."> nebo obalující <label>. Zástupný text jako popisek se nikde nepoužívá.
• Tlačítka mají přístupné názvy, každé <button> má buď textový obsah nebo aria-label. Tlačítka pouze se SVG (hamburger, sdílet, instalovat) mají všechna aria-label.
• Dekorativní SVG označeny jako skryté, aria-hidden="true" na každé dekorativní ikoně, aby je čtečky obrazovky přeskočily místo oznamování jejich geometrie.
• Správné ARIA role, role="radiogroup" na selektoru typů s role="radio" + aria-checked na každé možnosti; role="tablist" / role="tab" + aria-selected na záložkách panelu.
• Textový kontrast, primární text je #f5f5f5 na #08090a (≈ 17:1, WCAG AAA). Ztlumený text #a3a3a3 na stejném pozadí je ≈ 8:1 (nad AAA 7:1).
• Přepínač jazyka má aria-label="Language" i přesto, že viditelný popisek je implicitní.

Opraveno v tomto průchodu

• Přeskočení úrovně nadpisů, tři podnadpisy uvnitř sekcí extra-fields vCard / MECARD byly <h4> pod <h2> bez meziúrovně <h3>. Nástroje osnovy čtečky obrazovky to označily jako „přeskočenou úroveň." Změněno na <h3>, takže osnova čte h1 → h2 → h3 → h3 čistě.

Známá omezení

• Úplné prohledání Axe / NVDA / VoiceOver vyžaduje prohlížeč + AT, které nemůžeme spustit z buildu pipeline. Ruční průchod na základě prohlížeče naplánován měsíčně.
• Nezávislý audit třetí strany je zadán (viz zástupná stránka /accessibility/audit/). Zpráva bude zveřejněna po přijetí, i kdyby obsahovala zjištění.
• Klávesová zkratka „/" pro paletu příkazů je mírným rizikem kolize na stránkách s vyhledávacími poli. Používáme preventDefault() pouze tehdy, když fokus není uvnitř vstupu; zdokumentováno, ale zatím neauditováno s AT.

Nahlásit problém

Pokud je něco nedostupné klávesnicí, špatně popsané nebo jinak nepoužitelné s vaším nastavením, napište na hello@abundera.ai. Uveďte svůj prohlížeč, OS, AT a konkrétní tok. Chyby přístupnosti považujeme za prioritní problémy.

Poslední přezkum: 2026-04-19. Příští přezkum: po příští větší změně uživatelského rozhraní.