Interaktivní mapy na webu rychle přicházejí do módy. Jak je použít a nezapomenout na přístupnost?
Nedávno jsem uvažoval o použití interaktivních map na právě vytvářeném webu mezinárodní konference. Porovnal jsem možnosti, a protože se jednalo o web v angličtině, rozhodl jsem se pro Google maps.
Po několikahodinovém experimentování potěšil výsledek jak mě, tak zadavatele webu. Jeden z problémů, který jsem řešil, je přístupnost. Kupodivu dokumentace Goolu, ani Atlasu a Seznamu nic podobného neřeší.
Na rozdíl od českých portálů Google mapy s uživateli bez JavaScriptu počítají, viz ukázka nejavascriptové verze map, při použití Google API nám to však nepomůže.
Uživatel bez JavaScriptu nebo se starým prohlížečem si interaktivní mapy nevychutná (a asi s tím i trochu počítá). Ovšem v případě, že se autor webu na takové mapy plně spoléhá „cestu k našemu obchodu najdete na mapce…“ a nenabídne návštěvníkům jiné řešení, stane se web pro někoho zbytečně nepřístupný.
Ukázkové příklady v dokumentaci API map se snaží o jednoduchost, s přístupností se netrápí, takže nezbývá než zapojit vlastní hlavu. Neřešil jsem možnost zpřístupnění pro nevidomé (návštěvníci konference se s pořadali často znají a domlouvají se e-mailem, ale v případě takového obchodu nebo úřadu by mohla být důležitá).
Pokud si k interaktivní mapě připravíme i její obrázkovou verzi, máme skoro hotovo. Zbývá do značek <noscript> vložit naši obrázkovou mapu. Návštěvníci bez JavaScriptu nyní svou mapku vidí a jásají. Ale to není vše. API map podporuje jen některé prohlížeče, uživatelé nepodporovaných prohlížečů se zapnutým JavaScriptem stále mapu neuvidí. Google API disponuje funkcí GBrowserIsCompatible(), kterou snadno poznáme nepodporovaný prohlížeč a můžeme mu JavaScriptem naši mapu zobrazit. API Atlasu má pro stelný účelu metodu checkAMapCompatibility() a API Seznamu vlastnost SZN.isSupported. Nyní by se měla mapa zobrazit každému prohlížeči, ktery podporuje obrázky (neobrázkovým můžeme napsat třeba adresu v alt textu). Pokud i přesto narazíte na problém, dejte mi vědět.
Možná si řeknete, že je to jen pár řádek kódu navíc. Bohužel právě těch pár řádků mi v oficiálních dokumentacích chybí a obávám se, abychom jakmile se použití interaktivních map na webu stane módou, nemuseli i pro takovou běžnou věc, jakou je zjištění adresy být odkázáni na zapnutý JavaScript a nové prohlížeče jen proto, že autora otázka přístupnosti nenapadla.
Zdar, asi jsem tatar nebo už fakt nevím... Koukal jsem na ty tvoje stránky a jsou super. Přesně takovou mapu si chci vložit na moje stránky, ale prostě nevím jak na to... Potřebuju tam vložit mapu Sliga, Irsko a abych tam mohl mít značky na kterou když klikneš tak se tam objeví Jméno člověka, kterje tam bydlí atd... Nemohl by jsi mi s tím prosím pomoci. Zaregistroval jsem se na Googlu, ale nevím jak dostat ten API. Jestli mi někdo můžete poradit co přesně mám vložit na moje stránky, budu Vám fakt moc vděčný... Díky Tom
Zacni s "Mapy Hello World" http://www.google.com/apis/maps/documentation/#The_Hello_World_of_Google_Maps staci ho toho prikladu umistit tvuj licencni klic a spustit ho z adresy, pro kterou mas licencni klic vygenerovan.
Prochazenim dalsich prikladu z napovedy pak snadno pridas dalsi featurky.
Martin Hassman ex-biochemik, umělecký programátor a publicista. Spoluzakladatel CZilly, zakladatel Zdrojáku, správce HTML5.cz, organizátor hackathonů, čekovacích muzejních nocí aj. akcí.
Přečteno 24 507×
Přečteno 24 033×
Přečteno 20 754×
Přečteno 19 839×
Přečteno 19 810×