====== WCAG (Web Content Accessibility Guidelines) ======

**WCAG** je soubor mezinárodně uznávaných doporučení pro tvorbu přístupného webového obsahu. Tyto směrnice vydává organizace W3C v rámci iniciativy **[[WAI]]**. Jejich cílem je zajistit, aby webové stránky a aplikace byly použitelné pro osoby se zdravotním postižením (zrakovým, sluchovým, motorickým či kognitivním), ale také pro seniory nebo uživatele s dočasným omezením.

===== Čtyři pilíře přístupnosti (POUR) =====
WCAG 2.1 a 2.2 stojí na čtyřech základních principech, které musí každý náš webový projekt splňovat:

  * **P – Perceivable (Vnímatelnost):** Informace a komponenty uživatelského rozhraní musí být prezentovány tak, aby je uživatelé mohli vnímat (např. textové alternativy pro obrázky, titulky u videí ve formátu [[WAV|audio/video]]).
  * **O – Operable (Ovladatelnost):** Komponenty rozhraní a navigace musí být ovladatelné (např. plná podpora klávesnice, dostatek času na čtení obsahu).
  * **U – Understandable (Srozumitelnost):** Informace a ovládání rozhraní musí být srozumitelné (např. čitelný text, předvídatelné chování stránek).
  * **R – Robust (Robustnost):** Obsah musí být dostatečně robustní, aby mohl být spolehlivě interpretován širokou škálou uživatelských agentů, včetně asistivních technologií (čtečky obrazovky).



===== Úrovně shody =====
WCAG definuje tři úrovně přísnosti. Naše společnost se řídí těmito pravidly:

^ Úroveň ^ Význam ^ Cíl pro naši firmu ^
| **A** | Základní úroveň. Bez jejího splnění je web pro některé skupiny nepoužitelný. | **Minimum** pro interní nástroje. |
| **AA** | Řeší nejběžnější bariéry. | **Standard** pro náš [[WWW|veřejný web]]. |
| **AAA** | Nejvyšší úroveň přístupnosti (velmi náročná na realizaci). | Používáme u kritických formulářů. |

===== Praktická implementace (Checklist) =====
Při tvorbě obsahu a vývoji dodržujte tato pravidla:

==== 1. Vizuální stránka (Design) ====
  * **Kontrast:** Text musí mít dostatečný barevný kontrast vůči pozadí (dle našich **[[Design Assets]]**).
  * **Barva:** Informace nesmí být sdělována pouze barvou (např. "chyba je označena červeně").
  * **Responzivita:** Web musí být čitelný i při zvětšení textu na 200 %.

==== 2. Technické řešení (Kód) ====
  * **Sémantika:** Používejte správné HTML značky (h1, nav, button) místo pouhých divů.
  * **ARIA:** Používejte atributy ARIA pro komplexní prvky, které standardní HTML nepokrývá.
  * **Focus:** Aktivní prvek (kam uživatel doklikal klávesnicí) musí být jasně vizuálně ohraničen.

==== 3. Multimédia a obsah ====
  * **Alternativní text:** Každý informativní obrázek musí mít atribut ''alt''.
  * **Prázdné odkazy:** Odkazy jako "ZDE" jsou nepřípustné. Text odkazu musí popisovat cíl (např. "Stáhnout příručku [[GDPR]]").



===== Nástroje pro testování =====
V rámci **[[IT Podpora|IT podpory]]** a vývoje doporučujeme tyto nástroje:
  * **WAVE Tool:** Pro rychlou vizuální kontrolu chyb přímo v prohlížeči.
  * **Lighthouse:** Součást Chrome DevTools pro audit přístupnosti.
  * **NVDA / VoiceOver:** Testování reálnou čtečkou obrazovky.

> **Upozornění:** Přístupnost není jen "hezká vlastnost", ale v mnoha sektorech (státní správa, bankovnictví) je vyžadována zákonem (např. směrnice EU o přístupnosti webu).

---
**Související stránky:** [[WAI]], [[WWW]], [[Design Assets]], [[Vývojový tým]], [[Marketingové oddělení]], [[ZIF]]