Malý dotykový cíl na mobilu

Jen v mobilní šířce 390 px se změří interaktivní prvky: odkazy, tlačítka, formulářová pole, výběry a cokoli s rolí tlačítka. Nález dostane prvek, který je menší než 44 px v obou rozměrech (config/design.json#thresholds.minTouchTargetPx); prvek 342 × 24 px tedy nález nedostane, i když je nízký.

Odkaz v běžícím textu se vynechává. Když je cíl řádkový a ve stejném bloku je viditelný neklikatelný text, jeho velikost drží výška řádku okolního textu, a to je výjimka „Inline“ z WCAG 2.5.8 i 2.5.5 (doslovné znění níž). Norma po takovém odkazu 44 × 44 px nežádá ani na úrovni AAA, takže ho nehlásíme. Řádek složený ze samých odkazů (stránkování „1 2 3“, lišta odkazů) výjimku nemá (slovo v normě je „non-target text“) a hlásí se.

Rozestup se počítá. U každého označeného cíle se ověří výjimka „Spacing“ z WCAG 2.5.8: kružnice o průměru 24 px na středu obálky se nesmí protnout se sousedním cílem. Nález to nevyřadí (náš práh 44 px je kritérium 2.5.5), ale v textu nálezu se dozvíte, kolik z označených prvků nesplňuje ani mírnější hranici 24 × 24 px včetně téhle výjimky.

Na širších viewportech se kontrola vůbec nespouští; u myši velikost cíle takhle nerozhoduje.

Co kontrola nedělá:

• Nehlídá odstup u cílů, které náš práh splní. Dvě tlačítka 44 × 44 px natěsnaná k sobě projdou, přestože se mezi nimi prstem trefit nedá; rozestup se počítá jen u prvků, které už pod prahem jsou.
• Nezohledňuje zvětšení klikací plochy přes ::before/::after ani padding na rodiči: měří se rám samotného prvku, takže malá ikona s velkou neviditelnou plochou kolem dostane nález neprávem.
• Nerozlišuje důležitost. Odkaz v patičce váží stejně jako tlačítko „Koupit“.
• Nevidí prvky, které se objeví až po interakci.

Nález je na úrovni stránky, s anotovaným snímkem obrazovky, závažnost varování.

Na viditelnost v odpovědích AI to vliv nemá žádný. Zato tu na rozdíl od většiny kódů v modulu designu existuje psaná norma, a právě proto stojí za to říct přesně, co v ní je a co ne.

Norma žádá 24 px, ne 44. Kritérium WCAG 2.5.8 (Target Size (Minimum), úroveň AA) požaduje cíl aspoň 24 × 24 CSS px a připouští k tomu pět výjimek. Nejdůležitější je rozestup: malý cíl je v pořádku, pokud se kolem něj dá opsat kružnice o průměru 24 px, aniž protne kružnici jiného cíle, prakticky tedy středy sousedních cílů aspoň 24 px od sebe. Další výjimky jsou odkaz uvnitř věty, existence rovnocenného ovládacího prvku jinde na stránce, velikost určená prohlížečem a případ, kdy je daná podoba nezbytná.

44 × 44 px je jiné kritérium a jiná úroveň: WCAG 2.5.5 (Target Size (Enhanced)), úroveň AAA. Shoduje se s doporučením Applu (Human Interface Guidelines žádají pro tlačítko plochu aspoň 44 × 44 pt). Googlu se tenhle práh nedovolávejte: ten pro dotykové cíle doporučuje 48 dp, ne 44; naše stránka to do 13. 9. 2026 tvrdila špatně. Kritéria WCAG ověřena 13. 9. 2026 přímo na w3.org (zdroje níž), doporučení Applu a Googlu v jejich vlastní dokumentaci pro vývojáře.

A ani těch 24 px zatím není v Evropě vymahatelná povinnost, i když se to posunulo. ETSI vydalo 2. 9. 2026 EN 301 549 V4.1.1, která přebírá WCAG 2.2 včetně kritéria 2.5.8. Evropská komise ji ale zatím necitovala v Úředním věstníku, takže z jejího splnění presumpce shody neplyne; starší v3.2.1 stojí na WCAG 2.1, kde kritérium 2.5.8 vůbec není. Náš modul přístupnosti proto 2.5.8 měří a počítá do skóre podle WCAG 2.2, ale do skóre podle WCAG 2.1 (ADA Title II) ani 2.0 (Section 508) ne. Tři čísla vedle sebe, viz docs/pristupnost.md.

Práh 44 px v tomhle nálezu je tedy náš, ne normy, vědomě přísnější, protože prstem se do 24px cíle trefuje špatně i tam, kde norma mlčí. Říkáme to takhle naplno schválně: kdybychom ho vydávali za zákonnou povinnost, byla by to nepravda a vy byste podle ní přestavovali rozvržení, které přestavět nemusíte.

Koho se to týká nejvíc: lidí s omezenou jemnou motorikou, s třesem, lidí ovládajících telefon jednou rukou v pohybu. Ale ve skutečnosti všech: každý zná to opakované míjení odkazu v patičce.

Co z toho plyne pro váš web: nález DSG-05 sám o sobě neznamená porušení normy. Znamená, že prvek nesplňuje náš přísnější práh. Než podle nálezu předěláte rozvržení, podívejte se, o který prvek jde: drobná položka v patičce s dostatečným rozestupem nebo prvek v nativní velikosti prohlížeče jsou podle WCAG 2.5.8 v pořádku a zvětšovat je nemusíte. Odkazy uvnitř odstavce do nálezu od 19. 9. 2026 nepočítáme vůbec; do té doby se hlásily a rada „zvětšete je na 44 × 44 px“ byla u nich v rozporu s normou, která je z požadavku vyjímá.

Pořadí je takové: nejdřív ověřte rozestup (tím se malý cíl podle normy omluví), a teprve když ani ten nestačí nebo chcete splnit náš přísnější práh, zvětšujte. Když to vizuálně nejde, zvětšete klikací plochu bez zvětšení vzhledu.

/* Poctivé zvětšení */
.tlacitko {
  min-width: 44px;
  min-height: 44px;
}

/* Malá ikona s velkou plochou: vzhled zůstane, cíl se zvětší */
.ikona {
  position: relative;
}
.ikona::after {
  content: "";
  position: absolute;
  inset: -12px;
}

• Odstup je alternativa k velikosti, ne doplněk. Norma malý cíl omluví, pokud se kolem něj vejde kružnice o průměru 24 px, aniž protne kružnici sousedního cíle, tedy zhruba středy aspoň 24 px od sebe. Hustý seznam odkazů s dostatečnou roztečí řádků je podle WCAG v pořádku.
• Nejčastější viník je patička: seznam odkazů s malou výškou řádku. Když chcete zvětšovat, zvětšete padding položek, ne velikost písma.
• Druhý nejčastější je ikonové tlačítko (zavřít, sdílet, oblíbené). Tady se hodí ta neviditelná plocha výše.
• Pozor na karty, které vypadají klikatelné celé. Když odkaz obepíná jen řádek s názvem, zbytek karty nedělá nic; vada není ve velikosti čísla, ale v tom, že plocha slibuje víc, než umí.
• Ověřte to prstem, ne myší. Na skutečném telefonu, ne v režimu zařízení; kurzor myši je přesný, prst ne.