S naším velkým testem přístupnosti webů státní správy a samosprávy se pomalu dostáváme do finále. Minule jsme se podívali na weby tří ministerstev: ministerstva financí, ministerstva zdravotnictví a ministerstva informatiky. Výsledky byly nevalné. Ze čtrnácti kritérií se ani jedna instituce nedostala nad desítku.
Dnes se podíváme o pomyslný stupínek níže směrem k občanovi, tedy na krajské úřady. Jejich činnost není nijak stará a weby jsou tak poměrně nové. Lze tedy předpokládat, že by mohly dopadnout lépe než weby ministerstev, které mnohdy bez větších změn fungují již drahně let. Konkrétně si vezmeme na paškál Liberecký kraj (http://www.kraj-lbc.cz), Karlovarský kraj (http://www.kr-karlovarsky.cz) a Kraj Vysočina (http://www.kr-vysocina.cz). U posledního to bylo především z toho důvodu, že píší na svých stránkách, že: „Podle ministra Mlynáře je kraj Vysočina v oblasti informatiky bezkonkurenční“. No, uvidíme.
Dříve, než se pustíme do samotného testu, rád bych mírně reagoval na diskuzi, která se urodila pod minulým dílem seriálu. Celý tento test má několik premis, kterých se musí držet, aby byly výsledky alespoň trochu relevantní. Za prvé, testuji přístupnost (accessibility) podle chápání WAI. Za druhé, přístupnost testuji podle zásad WCAG 1.0. Za třetí, ze zásad WCAG 1.0 si vybírám jen ty, které považuji za nejdůležitější a přitom lehce testovatelné. Vím, že by šla kvalita webů testovat různými způsoby. Já si ale vybral jen jeden. Tolik tedy na úvod.
Jak tedy dopadly výsledky u testovaných webů?
Karlovarský kraj
(http://www.kr-karlovarsky.cz)
Webovým stránkách Karlovarského kraje dominuje trojsloupcový layout s výrazným středním obrázkovým sloupcem. Na první pohled upoutá javascriptově řešené roll-out menu na levé straně. Podle výsledku automatického auditu Dobrého webu má titulní strana něco málo přes 90 kB, což odpovídá cca 13 sekundám stažení přes dial-up modem. Na velikosti se nejvíce podepsaly obrázky (44 kB) a JavaScript (36 kB). Stránka zvolila specifikaci HTML 4.0 Transitional
, proti které ale obsahuje mnoho chyb. Podívejte se na celý výsledek automatického auditu.
Testovaná kritéria přístupnosti pak dopadla následovně.
Pro každý netextový prvek poskytněte textovou alternativu | |
![]() |
Mnoho obrázků nemá alt vůbec žádný, zbytek má mnohdy vyloženě nevhodný text. |
Zajistěte, aby všechny informace nesené barvou byly dostupné i bez barevného rozlišení | |
![]() |
Stránky jsou použitelné i s vypnutými barvami a s jiným nastavením barevného schématu Windows. |
Zajistěte, aby byl dokument čitelný i bez stylových předpisů (style sheets) | |
![]() |
Vzhledem k tomu, že se na stránce využívají kaskádové styly jen naprosto minimálně, jsou stránky použitelné i bez nich. |
Zabraňte tomu, aby obrazovka kmitala | |
![]() |
Na stránce se nic nehýbe. |
Ujistěte se, že jsou stránky použitelné bez funkčního skriptování či appletů, a pokud to není možné, zajistěte adekvátní alternativní informace na přístupné stránce | |
![]() |
Největší prohřešek testované stránky. Při vypnutém JavaScriptu nemohu používat navigaci a zobrazí se jen hláška „Váš prohlížeč nepodporuje scripty“. |
Zajistěte, aby barevné kombinace popředí a pozadí byly dostatečně kontrastní i pro osoby s vadami zraku | |
![]() |
Špatný rozdíl barvy a jasu je patrný především u nadpisu „Aktuální informace“. |
Existuje-li adekvátní značkovací jazyk, použijte k předání informace značkování místo obrázků | |
![]() |
Ikonky ve spodní části stránky vesměs všechny vedou někam „dovnitř“ samotného webu. Navíc jsou zpracované nekvalitně a nejsou příliš čitelné. Není důvod, proč by informace o odkazu nemohla být zpracována textově. |
Vytvářejte dokumenty splňující zveřejněnou formální gramatiku | |
![]() |
Stránky vykazují mnoho chyb proti zvolené specifikaci HTML 4.0 Transitional . |
Pro řízení layoutu a zobrazení použijte stylové předpisy (style sheets) | |
![]() |
Kaskádové styly jsou pro řízení layoutu použity jen naprosto minimálně. |
Nepoužívejte tabulky pro layout, nedávají-li smysl i linearizované | |
![]() |
Layout je řízen jednoduchou tabulkou, která je použitelná i při linearizovaném zobrazení. |
Pro hodnoty atributů značkovacího jazyka a vlastností stylových předpisů používejte relativní jednotky místo absolutních | |
![]() |
Definice velikosti písma je nadefinovaná nevhodně, což způsobuje nemožnost zvětšit velikost např. v majoritním browseru MS Internet Explorer. |
Ke strukturování dokumentů používejte prvky nadpisů, a to v souladu se specifikací | |
![]() |
Ačkoliv je na stránce několik významových nadpisů, ani jeden není adekvátně označen jako nadpis ve zdrojovém kódu. |
Jasně identifikujte cíl každého odkazu | |
![]() |
Všechny odkazy jsou identifikovány dostatečně jasně. |
Prostřednictvím metadat doplňte ke stránkám sémantické informace | |
![]() |
Chybí meta-značka pro content-language . Navíc mají meta-značky špatné pořadí. Je třeba umístit značku title až za meta-značku content-type , jinak mohou mít některé browsery s obsahem title problém. |
Ze čtrnácti kritérií tedy titulní stránka Karlovarského kraje uspěla v pěti.
Liberecký kraj
Internetové stránky Libereckého kraje působí pěkným a moderním dojmem. Nejde si nevšimnout, že jsou dělané podle relativně přísné specifikace XHTML 1.1
(byť s mnoha chybami) a design je definován pomocí kaskádových stylů. Jsou velké cca 131 kB, což je zřejmě již trochu moc, protože to odpovídá cca 19 sekundám na dial-upu. Nejvíc se o tuto velikost zasloužil obrázek záhlaví (40 kB). Kompletní výsledek automatického auditu Dobrého webu.
Testovaná kritéria přístupnosti pak dopadla následovně.
Pro každý netextový prvek poskytněte textovou alternativu | |
![]() |
Většina obrázků má alt uvedený správně. U některých však zcela chybí nebo je uveden vzhledem k obsahu obrázku neadekvátně. |
Zajistěte, aby všechny informace nesené barvou byly dostupné i bez barevného rozlišení | |
![]() |
Stránka je použitelná i s vypnutými barvami i s jiným nastavením barevného schématu Windows. |
Zajistěte, aby byl dokument čitelný i bez stylových předpisů (style sheets) | |
![]() |
Přestože jsou kaskádové styly na stránce používány hojně, je stránka použitelná i bez nich. Jediné doporučení by mohlo spočívat v možnosti přeskočit v takovém zobrazení dlouhou navigaci, která je ve standardním zobrazení v levém sloupci. |
Zabraňte tomu, aby obrazovka kmitala | |
![]() |
Na stránce se nic nehýbe. |
Ujistěte se, že jsou stránky použitelné bez funkčního skriptování či appletů, a pokud to není možné, zajistěte adekvátní alternativní informace na přístupné stránce | |
![]() |
Stránka je naprosto použitelná i bez funkčního JavaScriptu. |
Zajistěte, aby barevné kombinace popředí a pozadí byly dostatečně kontrastní i pro osoby s vadami zraku | |
![]() |
Kombinace světle oranžového písma a bílého pozadí vykazuje nedostatečný kontrast. |
Existuje-li adekvátní značkovací jazyk, použijte k předání informace značkování místo obrázků | |
![]() |
Většina informací je v textové podobě. Obrázkové nadpisy mají správné atributy alt . |
Vytvářejte dokumenty splňující zveřejněnou formální gramatiku | |
![]() |
Stránka obsahuje velké množství chyb proti zvolené specifikaci XHTML 1.1 . |
Pro řízení layoutu a zobrazení použijte stylové předpisy (style sheets) | |
![]() |
Pro řízení layoutu jsou na stránce použity kaskádové styly. |
Nepoužívejte tabulky pro layout, nedávají-li smysl i linearizované | |
![]() |
Pro řízení layoutu jsou na stránce použity kaskádové styly. |
Pro hodnoty atributů značkovacího jazyka a vlastností stylových předpisů používejte relativní jednotky místo absolutních | |
![]() |
Jednotky velikosti písma jsou nadefinované relativně, a tudíž lze obsah libovolně zvětšovat. |
Ke strukturování dokumentů používejte prvky nadpisů, a to v souladu se specifikací | |
![]() |
Stránka má sice uveden hlavní nadpis značkou h1 . Zbytek nadpisů na stránce však správné označení nemá. |
Jasně identifikujte cíl každého odkazu | |
![]() |
Většina odkazů je dostatečně specifická, bohužel je však na stránce několik odkazů, které se opakují textově, ale vedou na různá místa. V takovém případě je vhodné cíl specifikovat pomocí atributu title . |
Prostřednictvím metadat doplňte ke stránkám sémantické informace | |
![]() |
Stránka má uvedené všechny důležité meta-značky. |
Webové stránky Libereckého kraje tak ze čtrnácti kritérií uspěly v devíti.
Kraj Vysočina
Kraj Vysočina má příjemně stavěný web, který ovšem na první pohled nepříjemně překvapí malým nezvětšitelným písmem a odkazy směřujícími do nových oken. Velikostně stránky vycházejí na cca 117 kB, z čehož největší část tvoří obrázky (60 kB). Stránky se snaží držet specifikace HTML 4.01 Transitional
, ale dost neúspěšně. Kompletní výsledek automatického auditu Dobrého webu.
Testovaná kritéria přístupnosti pak dopadla následovně.
Pro každý netextový prvek poskytněte textovou alternativu | |
![]() |
Ačkoliv má většina obrázků alt naprosto v pořádku, najdou se i takové, kterým zcela chybí. |
Zajistěte, aby všechny informace nesené barvou byly dostupné i bez barevného rozlišení | |
![]() |
Stránka je použitelná i s vypnutými barvami i s jiným nastavením barevného schématu Windows. |
Zajistěte, aby byl dokument čitelný i bez stylových předpisů (style sheets) | |
![]() |
Při vypnutých kaskádových stylech není čitelné horizontální menu pod hlavičkou. Barva písma je totiž dána styly, kdežto barva pozadí nikoliv. |
Zabraňte tomu, aby obrazovka kmitala | |
![]() |
Na stránce nic nekmitá. |
Ujistěte se, že jsou stránky použitelné bez funkčního skriptování či appletů, a pokud to není možné, zajistěte adekvátní alternativní informace na přístupné stránce | |
![]() |
Stránka je naprosto použitelná i bez zapnutého JavaScriptu. |
Zajistěte, aby barevné kombinace popředí a pozadí byly dostatečně kontrastní i pro osoby s vadami zraku | |
![]() |
Barevné kombinace na stránce mají správny kontrast. |
Existuje-li adekvátní značkovací jazyk, použijte k předání informace značkování místo obrázků | |
![]() |
Všechny obsahové prvky jsou řešeny správně. |
Vytvářejte dokumenty splňující zveřejněnou formální gramatiku | |
![]() |
Stránka obsahuje mnoho chyb proti zvolené specifikaci HTML 4.01 Transitional . |
Pro řízení layoutu a zobrazení použijte stylové předpisy (style sheets) | |
![]() |
Pro řízení layoutu je použita tabulka. Kaskádové styly jsou využity minálně. |
Nepoužívejte tabulky pro layout, nedávají-li smysl i linearizované | |
![]() |
Tabulka použitá pro layout dává smysl i při linearizovaném zobrazení. |
Pro hodnoty atributů značkovacího jazyka a vlastností stylových předpisů používejte relativní jednotky místo absolutních | |
![]() |
Definice velikosti písma je nevhodně určena, takže nelze zvětšit obsah v MS Internet Explorer. |
Ke strukturování dokumentů používejte prvky nadpisů, a to v souladu se specifikací | |
![]() |
Žádné významové nadpisy nejsou ve zdrojovém kódu adekvátně označeny. |
Jasně identifikujte cíl každého odkazu | |
![]() |
Všechny odkazy jsou jednoznačně specifikovány. Chybou je však odkazování do nového okna prohlížeče, což odporuje ale jiné zásadě přístupnosti. |
Prostřednictvím metadat doplňte ke stránkám sémantické informace | |
![]() |
Chybějí meta-značky content-language , description i keywords . |
Webové stránky Kraje Vysočina tak ze čtrnácti kritérií uspěly v sedmi.
Co bude dál?
Ani krajské úřady tedy neprokázaly nějak závratnou míru přístupnosti, i když Liberecký kraj uspěl v mnoha důležitých kritériích, čímž mě příjemně překvapil. Nejvíc mě ovšem zarazilo naprosto nepřístupné JavaScriptové menu v Karlovarském kraji. Evergreen absolutní definice velikosti písma se opět s výjimkou Libereckého kraje potvrzuje.
V příštím, posledním díle seriálu si posvítíme na weby měst a obcí. Lze očekávat, že míra byrokracie a strnulosti zde bude mnohem menší než u ministerstev či krajů. Projeví se to i na jejich internetových stránkách? Uvidíme.