Accessibility — základy, VoiceOver a TalkBack pro nevidomé uživatele

Co je Accessibility (a11y) v mobilních aplikacích?

Accessibility (zkráceně a11y — 11 písmen mezi «a» a «y») — praxe vývoje aplikací přístupných pro osoby s poruchami zraku, sluchu, motoriky a kognitivními vlastnostmi. V mobilním vývoji zahrnuje accessibility čtyři hlavní scénáře: nevidomí uživatelé (čtečky obrazovky), slabozrací (škálování, kontrast), hluší a nedoslýchaví (titulky, vizuální alternativy zvuku), uživatelé s omezenou motorikou (hlasové ovládání, Switch Control, velká dotyková oblast).

Právní požadavky — v mnoha zemích je accessibility ze zákona povinná. USA: Section 508 a ADA. EU: European Accessibility Act (2025). Velká Británie: Equality Act 2010. Bez podpory accessibility se aplikace může stát předmětem soudního sporu — v USA bylo v roce 2023 podáno více než 4000 žalob o nepřístupnosti digitálních produktů. Apple a Google kontrolují accessibility při moderování aplikací: App Store Review Guidelines (4.2) a Google Play Store vyžadují minimální podporu přístupnosti.

Obchodní argument — přístupnost zvyšuje publikum. Podle Return on Disability (2021) osoby s postižením kontrolují 13 bilionů dolarů disponibilního příjmu ročně. Přístupné aplikace se také lépe umisťují ve vyhledávání (sémantické HTML, alternativní texty), mají vyšší hodnocení uživatelů a méně recenzí o problémech s UX. V IT Sectr zahrnujeme accessibility do definition of done všech projektů — je to standard kvality, nikoli volitelné vylepšení.

Accessibility v iOS: VoiceOver a UIAccessibility

VoiceOver — čtečka obrazovky Apple, integrovaná v iOS, iPadOS a macOS. Uživatel přejíždí prstem po obrazovce, VoiceOver čte název prvku pod prstem. Dvojité klepnutí — aktivace prvku. VoiceOver podporuje více než 40 gest: tři prsty přejetí (listování), dva prsty dvojité klepnutí (zastavení), Z-gesto (návrat). Vývojář řídí, co a jak VoiceOver čte, prostřednictvím protokolu UIAccessibility a vlastností accessibilityLabel, accessibilityTraits, accessibilityHint.

class CustomButton: UIButton {

    override var isAccessibilityElement: Bool {
        get { return true }
        set {}
    }

    // override accessibilityLabel
    override var accessibilityLabel: String? {
        get { return "Tlačítko odeslání formuláře" }
        set {}
    }

    // override accessibilityHint
    override var accessibilityHint: String? {
        get { return "Dvojitým klepnutím odešlete data" }
        set {}
    }

    // override accessibilityTraits
    override var accessibilityTraits: UIAccessibilityTraits {
        get { return .button }
        set {}
    }
}

// Dynamic Type — škálování textu
titleLabel.font = UIFontMetrics.default.scaledFont(
    for: UIFont.systemFont(ofSize: 16)
)
titleLabel.adjustsFontForContentSizeCategory = true

Dynamická typografie — Dynamic Type v iOS umožňuje uživateli zvolit velikost textu (od XS do XXXL). Vývojář používá UIFontMetrics.scaledFont pro automatické škálování. Text musí být správně zobrazen ve všech velikostech: řádky nesmí být oříznuty, tlačítka musí růst proporcionálně k textu. UITableView automaticky aktualizuje výšku buněk při změně velikosti textu. Ignorování Dynamic Type znamená učinit aplikaci nepřístupnou pro slabozraké uživatele.

Accessibility ve SwiftUI

SwiftUI poskytuje modifikátory pro accessibility: .accessibilityLabel(), .accessibilityHint(), .accessibilityAddTraits(), .accessibilitySortPriority(). Ve výchozím nastavení jsou všechny standardní prvky SwiftUI (Text, Button, Image) již prvky accessibility s automatickými štítky. Pro vlastní View použijte .accessibilityElement(children: .combine) ke sloučení podřízených prvků do jednoho. SwiftUI automaticky podporuje Dynamic Type a VoiceOver.

VStack {
    Image(systemName: "trash")
        .accessibilityLabel(Text("Odstranit prvek"))
    Text("Koš")
        .font(.body)
}
.accessibilityElement(children: .combine)
.accessibilityAddTraits(.isButton)
.accessibilityHint(Text("Odstraní vybraný prvek bez možnosti obnovení"))

Accessibility v Android: TalkBack a contentDescription

TalkBack — čtečka obrazovky Google, předinstalovaná na většině zařízení Android (dostupná v Google Play pro všechny verze Android 5+). TalkBack používá stejná gesta jako VoiceOver: přejetí pro navigaci, dvojité klepnutí pro aktivaci. Vývojář nastavuje popis prvků prostřednictvím atributu android:contentDescription v XML nebo pomocí setContentDescription() v kódu. Pro ImageView je contentDescription povinný — bez něj TalkBack hlásí «neoznačeno» nebo čte název souboru.

// XML: contentDescription pro ImageView
<ImageView
    android:id="@+id/iconDelete"
    android:src="@drawable/ic_delete"
    android:contentDescription="@string/delete_button_desc"
    android:focusable="true"
    android:clickable="true" />

// Kotlin: programové nastavení
iconDelete.contentDescription = getString(R.string.delete_button_desc)

// Accessibility Delegate (vlastní)
iconDelete.accessibilityDelegate = object : View.AccessibilityDelegate() {
    override fun onInitializeAccessibilityNodeInfo(
        host: View, info: AccessibilityNodeInfo
    ) {
        super.onInitializeAccessibilityNodeInfo(host, info)
        info.text = "Tlačítko odstranění"
        info.contentDescription = "Odstranit vybraný prvek"
        info.className = Button::class.java.name
    }
}

// Live Regions pro dynamické aktualizace
textView.accessibilityLiveRegion = View.ACCESSIBILITY_LIVE_REGION_POLITE

Live Regions — mechanismus Android pro oznámení TalkBacku o změně obsahu bez zaměření. Atribut android:accessibilityLiveRegion nabývá tří hodnot: none (žádná oznámení), polite (oznámit po aktuálním), assertive (oznámit okamžitě). Použijte polite pro aktualizaci stavu načítání, assertive — pro kritické chyby. Zneužití assertive vede k chaosu pro uživatele — TalkBack bude neustále přerušovat aktuální činnost.

Accessibility Scanner

Accessibility Scanner — bezplatná aplikace od Google pro testování přístupnosti Android aplikací bez přístupu ke zdrojovému kódu. Skener kontroluje: kontrast textu, velikost dotykových oblastí (minimálně 48×48dp podle Android Accessibility Guidelines), existenci contentDescription pro ImageView, správnost hierarchie prvků. Pro automatizované testy použijte AccessibilityChecks z Espressa — integrují se do CI/CD a kontrolují accessibility při každém buildu.

WCAG 2.1: kontrast, velikost a dotykové oblasti

WCAG 2.1 (Web Content Accessibility Guidelines) — mezinárodní standard přístupnosti vyvinutý W3C. Verze 2.1 (2018) obsahuje 13 dalších kritérií pro mobilní aplikace. Úrovně shody: A (minimální), AA (povinná pro většinu organizací), AAA (maximální). Apple a Google doporučují úroveň AA jako minimum pro publikování aplikací. WCAG 2.2 byl vydán v roce 2023 s upřesněními pro zaměření a vstup.

Klíčová kritéria pro mobilní vývoj: kontrast textu nejméně 4.5:1 (AA) nebo 7:1 (AAA), velikost dotykových oblastí minimálně 44×44pt (iOS) nebo 48×48dp (Android), podpora na šířku i na výšku bez ztráty funkčnosti, možnost vypnutí animace (prefers-reduced-motion), existence titulků k multimédiím, kompatibilita s hlasovým ovládáním (Voice Control na iOS, Voice Access na Android).

Nástroje pro kontrolu kontrastu — Colour Contrast Analyser (TPGI), WebAIM Contrast Checker, Stark (Figma), Accessibility Inspector (Xcode). V IT Sectr kontrolujeme kontrast ve fázi návrhu (Figma + Stark) a znovu ve fázi vývoje (Accessibility Inspector / Accessibility Scanner). Minimální požadavek — 4.5:1 pro veškerý text menší než 18pt (14pt bold). Pro loga a dekorativní prvky kontrast není vyžadován.

Testování přístupnosti: nástroje a kontrolní seznam

Testování iOS — Accessibility Inspector v Xcode (Xcode → Open Developer Tool → Accessibility Inspector) kontroluje label, traits, hint pro každý prvek. VoiceOver lze zapnout v nastavení nebo pomocí Accessibility Shortcut (trojité stisknutí tlačítka). Pro automatizované testy použijte XCUITest s XCTAssertTrue(app.staticTexts["label"].isAccessibilityElement). Apple doporučuje testovat všechny obrazovky aplikace se zapnutým VoiceOverem.

Testování Android — Accessibility Scanner (Play Store) kontroluje kontrast, velikost dotykových oblastí, contentDescription. Pro automatizaci: Espresso AccessibilityChecks (import: androidTestImplementation 'androidx.test.espresso:espresso-accessibility:3.5.1'). Google doporučuje kontrolní seznam: každý ImageView má contentDescription, dotykové oblasti nejsou menší než 48×48dp, text se škáluje na 200 % bez oříznutí, všechny prvky jsou dosažitelné přejetím TalkBacku.

Kontrolní seznam IT Sectr — před vydáním kontrolujeme: (1) VoiceOver/TalkBack správně čte všechny prvky, (2) text se škáluje na maximální velikost bez ztráty funkčnosti, (3) všechny ImageView mají contentDescription, (4) kontrast textu ≥4.5:1 ve všech tématech, (5) dotykové oblasti ≥44pt/48dp, (6) žádné kontextové menu přístupné pouze dlouhým stiskem, (7) podpora Reduce Motion / Remove Animations v systémovém nastavení. Tento kontrolní seznam je součástí definition of done každého sprintu.