Miért üres a Köztársasági Elnöki Hivatal honlapja, ha van rajta valami?
A cikk témái:
Elöljáróban szeretném hangsúlyozni, hogy a mostani cikkemnek semmi köze a politikához. Megírásában csak és kizárólag a saját szakterületem szempontjai vezéreltek.
A Köztársasági Elnöki Hivatal honlapja a cikkem írásakor - a fennálló politikai helyzet miatt - mindössze egyetlen oldalból áll, amin egy rövid közlemény olvasható. Pontosabban annak olvasható, aki lát. Vak személyeknek olvashatatlan, ugyanis számukra egyszerűen nincs rajta semmi.
Ha megkérdeznék egy laikus (és látó) felhasználót, akkor bizonyára azt mondaná, hogy a kérdéses weboldalon egy címert, egy idézetet, egy rövid közleményt, és egy nemzeti trikolórt lát. Valószínűleg meglepődne, ha azt mondanám, hogy márpedig ezen a weboldalon tartalmilag semmilyen szöveges információ sincs! Értsd: egyetlen betűt sem tartalmaz. Ennek alátámasztásául íme az oldal végtelenül egyszerű HTML kódja:
Ebből a HTML nyelvhez értők számára világosan látszik, hogy weboldalon tulajdonképpen nincs más, csak egy darab nagy kép. Erre a képre van ráégetve minden dekorációs elem és szöveg. Előbbiek akadálymentességi szempontból viszonylag lényegtelenebbek, de a szöveg hozzáférhetősége annál fontosabb lenne. Márpedig a honlapon látható szövegekhez a vak felhasználók nem férnek hozzá, mivel ezek sima szövegként nincsenek rajta a honlapon.
Annyira üres az oldal, hogy még címe sincs. Egyszerűen nincs benne title
jelölőelem. Ennek következtében a weboldalra ellátogató vak felhasználó mindössze ennyi információhoz jut a képernyőolvasó program által: http kettőspont per per keh pont hu üres
Az a „fránya” alt
attribútum
Amikor egy új cikk írását tervezem, akkor mindig felmerül bennem a kérdés, hogy vajon érdemes-e a képek alt
attribútumáról cikket írnom. Általában meggyőzöm magam, hogy az akadálymentes weboldalak kapcsán talán ez már „lerágott csont”. Azaz minden webfejlesztőnek triviális, hogy a képen látható információ szöveges megfelelőjét az img
elem alt
attribútumba kell beírni. De aztán mindig van rá bizonyíték, hogy ez mégsem triviális.
Ezen az oldalon ugyan a képhez definiáltak alt
attribútumot, de üres értékkel. Ez pedig így azt jelenti a képernyőolvasó program számára, hogy az adott kép pusztán dekorációs célt szolgál. Vagyis nem kell törődni vele. Itt azonban a képen lényeges szöveges információk vannak.
Felmerül, hogy akkor az alt
attribútumba egyszerűen csak be kellene írni azokat a szövegeket, amelyek a képen vannak. Valahogy így:
<img src="KEH_elolap_01.jpg" alt=""Magyarország és a nemzet egysége érdekében köztársasági elnöki megbizatásomról lemondok." Schmitt Pál. Az új köztársasági elnök hivatalba lépéséig a köztársasági elnök feladat- és hatásköreit ideiglenesen Kövér László, az Országgyűlés elnöke látja el. Az új köztársasági elnök hivatalba lépéséig a Köztársasági Elnöki Hivatal honlapja nem üzemel." />
Tulajdonképpen már ez is több lenne a semminél. Pusztán egy dolog miatt kérdéses ez a megoldás. Ugyan nincs a WCAG akadálymentesítési szabványban előírás arra nézve, hogy az alt
attribútum szövege milyen hosszú legyen, az általános konszenzus alapján azonban 75-100 karakternél hosszabb szöveget nem szoktunk írni. Esetünkben viszont közel 350 karakternyi szövegről lenne szó. Ráadásul az alt
attribútum szövege szemantikailag nem tagolható tovább, pedig az idézetet és a közleményt jó lenne élesen megkülönböztetni.
Jelölőelemekkel ellátott szöveg használata jobb megoldás
Véleményem szerint jobb megoldás lenne az, ha a weboldal kódjába szemantikailag megfelelő jelölőelemekkel megjelölve, szövegesen is bekerülne az idézet és a közlemény. Az idézet például az erre a célra kitalált blockquote
elem segítségével.
Ezeket a szövegeket azután valamelyik bevett akadálymentes vizuális elrejtési megoldással elrejthetjük. A most használt kép pedig bekerülhetne például a div
elem háttérképeként. Például így:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu" lang="hu">
<head>
<title>Köztársasági Elnöki Hivatal</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<style type="text/css">
body {
background-color: #b9a976;
}
div {
width: 700px;
height: 500px;
margin: 0 auto;
background: transparent url("KEH_elolap_01.jpg") top left no-repeat;
}
div * {
text-indent: -10000px;
}
</style>
</head>
<body>
<div>
<blockquote>
<p>Magyarország és a nemzet egysége érdekében köztársasági elnöki megbizatásomról lemondok.</p>
<p>Schmitt Pál</p>
</blockquote>
<p>Az új köztársasági elnök hivatalba lépéséig a köztársasági elnök feladat- és hatásköreit ideiglenesen Kövér László, az Országgyűlés elnöke látja el.</p>
<p>Az új köztársasági elnök hivatalba lépéséig a Köztársasági Elnöki Hivatal honlapja nem üzemel.</p>
</div>
</body>
</html>
Ezzel a megoldással látványra teljesen ugyanazt kapnánk, mind az eredeti oldal. Viszont a vak személyek számára akadálymentes lenne.
Természetesen ha alaposabban belemélyednék a dologba, akkor még lehetne finomítani rajta, aminek eredményeképp további lehetséges megoldások is felmerülhetnének. Ha például a Hivatal címerét nem dekorációs elemnek tekintjük, akkor gondoskodni illene arról is, hogy ennek jelenléte is felolvasásra kerüljön.
De felvethetném azt is, hogy a gyengénlátó felhasználók számára az oldal megjelenése - a jelenlegi színvilágából eredően - abszolút nem kontrasztos. Mivel számukra is képként jelenik meg a szöveg, ezért lesznek közülük olyanok, akik hiába használnak saját maguknak bekonfigurált kisegítő technológiát, a kép kontrasztján mégsem tudnak állítani. A szövegként megjelenő szövegek ebből a szempontból ideálisabb megoldást jelentenének.
Konklúzió
Összegzésképpen tényleg csak arra szerettem volna rávilágítani, hogy egy ilyen, webfejlesztési szempontból végtelenül egyszerű honlapnál is milyen könnyen akadályt lehet gördíteni a felhasználók elé. Pedig kis odafigyeléssel, viszonylag egyszerű módon megelőzhető lenne mindez. Csak gondolni kell rá. Főleg egy fontos állami honlapon.