INSPO 2025: přátelská atmosféra, přístupnost webů a moje přednáška

Konferenci INSPO jsem samozřejmě v uplynulých letech zaznamenal, ale jakkoli jsem se o přístupnost alespoň vlažně zajímal, nebyla pro mě největší prioritou. Nebudu zastírat, přístupnost webů řeším intenzivněji poslední dva a půl roku.

💡 Poprvé jsem se o přístupnost začal zajímat asi někdy okolo roku 2009, když přišel Drupal 7 a jedna z jeho iniciativ zaměřená právě na webovou přístupnost.

Letos se mi INSPO připomenula naprosto nečekaně. Dostal jsem pozvání od Radka Pavlíčka, jednoho z organizátorů a speciality na přístupnost, popovídat o ladění přístupnosti na webu Dopravního podniku města Brna.

Nejvíce přátelská konference posledních let

Ještě před konferencí jsem si udělal rychlou procházku po Vyšehradě, zašel do baziliky a poté vyrazil do Kongresového centra Praha.

Musím zaklepat, že poslední roky se mi daří navštěvovat jenom povedené konference nebo menší akce. Přesto, na INSPO 2025 jsem se cítil trochu jako Alenka v říši divů. Milé uvítání mezi dveřmi. Každému návštěvníkovi vše s úsměvem vysvětlili. Přišel jsem po poledni, tak mě rovnou nasměrovali k obědu (bramboračka, wrap a neskutečně dobrá buchta) a nápojům.

Když jsem odcházel, zdvořile požádali o popruh z visačky, že jej použijí příště. Proč ne. Doma jich mám hromadu a už nevím, který háček použiji příště. Dokonce i tchýně je v tomto směru saturovaná. Palec nahoru, že se s tím neplýtvá.

Víte, úsměvy jsou všude. Tady to ale bylo takové až rodinné, ale přitom ne familiární. Sestavení stolů u oběda napomáhalo nenucenému networkingu. Pohladilo to na duši.

Výstava asistenčních technologií

Po obědě jsem měl ještě chvíli času, tak jsem vyrazil na doprovodnou výstavu prohlédnout si stánky s technologiemi, které s tématem konference souvisejí. Zaujaly mě tyto projekty:

• AfaSlovník učící pacienty po mrtvici znovu mluvit. Funguje podobně jako známá výuka jazyků Duolingo. A je zdarma.
• BlindShell – zajímavý telefon nejen pro nevidomé. Vyhrál nějaká ocenění, má upravené rozhraní nad Androidem a prý i možnost spouštět v nějaké podobě běžné aplikace pro tuto platformu. Zaujal mě vestavěnou umělou inteligencí, díky které není nutné vlastně už vůbec koukat na veliké údaje na displeji nebo přecvakávat nabídku. Prostě hlasem požádáte o informace o počasí, přečtení či napsání SMS, vytočení telefonního čísla, uložení kontaktu nebo o vyhledání informací na internetu. Moc rád bych si jej vyzkoušel a zrecenzoval, tak uvidíme, jak se to podaří.
• Equipaid – zvětšovací a čtecí zařízení na brýlích
• Helpnet – informační portál pro osoby se specifickými potřebami

Zajímavé přednášky o přístupnosti webů a aplikací

Netuším, kolik bylo účastníků, zaslechl jsem někde číslo 300. To je asi slušné na pořád ještě úzké téma. Přednášky probíhaly v několika pásmech. Já dorazil na odpolední část do sálu, kde Radek Pavlíček moderoval povídání o přístupnosti webu, aplikací a dokumentů.

Image

V první přednášce nás seznámili zástupci Ministerstva průmyslu a obchodu, Eva Průšová a Jakub Korec se zákonem 424/2023 Sb., o požadavcích na přístupnost některých výrobků a služeb. A také s tím, jaké změny v legislativě se plánují. V nejbližší době například náprava některých nesmyslů, jako je momentálně nutnost, aby rozhlasové vysílání mělo titulky.

David Broďák z Global Payments povídal o přípravě přístupných platebních terminálů. Zaujalo mě to zejména v souvislosti se samoobslužnými kiosky.

Michal Horák z PeckaDesignu začal historických exkurzem do tabulkových layoutů HTML, Flashe a vzpomínkou na knížku CSS pro webdesignery od Marka Prokopa. A tak nějak nenásilně přešel k povídání o přístupnosti e-shopu SuperZoo.cz.

Nejdelší přednášku včetně nahrávek reálného ovládání, chyb v implementaci a stavu po opravě měla Leona Živnůstková. Povídala nám o přístupnost v bankovní aplikaci Partners Banky.

Velice si cením, že vlastně všichni přednášející se nebáli přiznat chyby i to, co zatím stále řeší (barvičky, ovládání bez myši, textace…). Nikdo není neomylný a myslím si, že ukázkou vlastních chyb inspirujeme ostatní.

Moje přednáška o přístupnosti DPMB

Vystoupil jsem v našem pásmu až jako poslední před společnými odpověďmi na dotazy z publika. S vědomím, že nás tlačí čas, jsem možná prošel svou prezentaci až příliš rychle, a ne všechna témata rozvedl do hloubky. Pokusím se o rekapitulaci ještě zde v článku.

Image

Web DPMB.cz vznikal v roce 2022 a 2023 v agentuře Lesensky.cz, kde částečně působím. Původně PR, později i marketingová agentura, kde vytváříme i webové stránky na podporu marketingových aktivit. Nejčastěji prezentační B2B weby, sem tam nějaké školní stránky a B2C. Většina projektů je stavěna na Drupalu (proto/protože jsem tam já), menší projekty na WordPressu (s čímž pomáhá bratr).

Přístupnost DPMB jsme samozřejmě řešili už od fáze návrhu, je tomu přizpůsobena i grafická stránka. Byť to asi není vizuálně nejatraktivnější web, jaký jsme s kolegy připravili, tak získal například 1. místo na WebTop100 v kategorii UX. Oproti tomu předchozímu to byl výrazný posun.

Ovšem i když jsme se snažili a s nejlepší vůlí jsme vytvořili první spuštěnou verzi, přístupnost měla nějaké rezervy. Proto jsem velmi rád, že spolupracujeme se Střediskem Teiresiás. Jmenovitě především s Honzou Balákem, který nám dodává výborně zpracované podklady, co a jak z hlediska přístupnosti vylepšit.

Výběr platformy

Už jsem zmínil výše, že tým okolo Drupalu začal přístupnost řešit někdy v roce 2009. Vzpomínám si, jak mi tehdy s příchodem Drupalu 7 někdo ze čtenářů poslal video, ve kterém si jako nevidomý s pomocí obrazovkové čtečky postavil web s fotogalerií. Pro mě to tehdy bylo z říše zázraků.

Na druhou stranu i sebelepší platforma může narazit na programátora, který svým působením vyladěnou přístupnost pohřbí. Těší mě, jmenuji se Jan Polzer a jsem takový programátor. V tomto případě jsem se snažil udělat atraktivní vyhledávací formulář s výběrem zastávek a vznikl sice pěkný prvek, který téměř nešel ovládat klávesnicí. Dnes tam máme řešení s vestavěným Drupal autocomplete a tyto problémy s ním už nejsou.

Drupal velmi oceňuji v kontextu zapracovávání změn vycházejících z analýzy přístupnosti. Ve Twigu ovlivníme téměř veškerý výstup velice snadno. Na webech, kde používáme Single Directory Components jdou úpravy díky odděleným kusům kódu ještě mnohem rychleji.

💡 Tip: pro nastavení povinných popisků fotek s možností se rozhodnout, co ale editor nevyplní a označí jako ilustrační, doporučuji modul Decorative Image Widget.

Barevnost, kontrast a Figma

Moji předřečníci povídali o přípravě grafiky ve Figma a jejím nástroji pro kontrolu barevnosti a kontrastů z pohledu přístupnosti. Je to tam zpracované velmi pěkně. Také s tím kolegové v Lesensky.cz pracují.

DPMB.cz vznikalo ještě v Adobe XD, takže jsme některé věci řešili až po nakódování, případně na základě tehdejších několika zkušeností. Dnes nám kromě Figmy pomáhá dodržování doporučení Google.

💡 Tip: co jsem dříve netušil, je změna hodnocení kontrastu na základě velikosti prvků. Myslete na to. Když se vyhovující prvek stane menším, například kvůli jinému písmu v jiné části stránky, už požadavky na barevnost splňovat nemusí.

Konzultace s odborníky

S Teiresiás jsme dospěli k následujícímu workflow. Použil jsem jej se stejnými konzultanty i na jiném webu, který vznikal mimo Lesensky.cz.

• Vytipujeme jsme klíčové stránky a workflow
• Analýza přijde ve formě Google Tabulky rozdělené do několika sešitů
• Upravíme, doplníme popis a případně korekturu zopakujeme

Viděl jsem analýzy od nejrůznějších poradců. V případě analýzy od Teiresiás si užívám, že to není jen tupě sepsaný popis problémů. U každého je totiž doplněn:

• Výskyt
• Návrh řešení, někdy i s alternativou, pokud ideální řešení nebude technicky možné
• Odkaz na příklady nebo dokumentaci

Tohle velmi pomáhá. Jednak s realizací a jednak může obrousit počáteční hrany v komunikaci mezi programátorem a analytikem. Je nesmírně důležité se navzájem vnímat jako partneři, kteří mají společný cíl – lepší web pro širší skupinu uživatelů.

Hlavní chyby nejen na webu DPMB

Zmínil jsem, že se předřečníci nebáli přiznat chyby. Když bych měl vybrat ty naše nebo přímo své, tak bych zmínil:

• Snahu předělat povedené Drupal Forms API na něco jiného
• Alternativní popisky obrázků vždy a všude. Ve skutečnosti musí být prázdný alt u ilustrační doplňkové grafiky, aby nezdržovala uživatele obrazovkové čtečky
• Opomenutí, že web musí jít pohodlně ovládat i bez myši
• Absence jednoznačného znázornění fokusu – ve formulářích, v menu, u odkazů
• Strukturování kódu – kromě značek Hx používat i seznam ve výčtech informací, nejen čistě textových položek
• SVG ikonky bez textového popisu, ne každý vidí vizuální kontext. Vespod jsme měli například dva odkazy na Facebook odlišené ikonkou, což bez jejího vnímání nebylo pochopitelné. Jako nápravu jsme přidali textové popisky.
• Nejednoznačné microcopy. Všechna ta „podívat se“, „přečíst“, „dozvědět se více“, „detail spojení“. Opět bez vizuálního kontextu nebylo jasné, co kam vede.

💡 Tip: zkuste se na svůj web někdy podívat při vypnutém CSS. Dává smysl? Pak je velká šance, že bude přehledný i pro nevidící. Já často sahám například po textovém prohlížeči Lynx.

Záznam z konference INSPO

Nahrávku z INSPO 2025 najdete v záznamu na Facebooku. Naše část o přístupnosti webů začíná v 4:14:00, přímo moje povídání najdete od 5:49:00. Až někde budou jednotlivé přednášky, upravím zde odkaz.

Pokud by vás zajímala, stáhněte si i moji prezentaci v PDF.

Image

Na shledanou na INSPO 2026

Na příští rok si dávám předsevzetí, dělat weby použitelné pro všechny. Ne vždy to jde ruku v ruce s časem, financemi, edukací klienta a schopnostmi vývojáře, ale i díky práci na DPMB.cz jsem zjistil, že jakmile si člověk osvojí určité principy, není tvorba přístupného webu výrazně složitější od toho, jak jsem jej dělal dříve. Prostě řadu věcí, které jsem dříve musel na webu po analýze opravovat, nyní rovnou chystám.

Pokud mi to vyjde časově, na příští ročník INSPO 2026 zavítám i bez toho, že bych musel přednášet. Je to totiž velmi inspirativní akce pro každého webaře.