Understanding WCAG 2.0

Skip to Content (Press Enter)

F2: Az 1.3.1 teljesítési feltételhez tartozó hiba, amelyet a szöveges tartalom megváltozásából adódó és a megfelelő kijelölést vagy szöveget mellőző információ okoz

Alkalmazás

Minden képeket vagy prezentációs kijelölést támogató technológia.

Ez a hiba az alábbiakra vonatkozik:

Leírás

Ez a hiba akkor következik be, amikor a megváltoztatott megjelenítése szöveg megfelelő szemantikus kijelölés nélküli jelentést közvetít. Ugyanez a hiba vonatkozik azokra a szövegképekre is, amelyek nem kerültek beágyazásra a megfelelő szemantikus kijelölésbe.

Példák

1. hiba példa: Bekezdések címsorokra hasonlító formázása CSS segítségével.

A szerkesztő címsorokat kíván készíteni, de el akarja kerülni az alapértelmezett HTML címsor megjelenítést. Ennek érdekében CSS-el címsor stílusúra formázza a bekezdéseket és címsorokként nevezi el őket. Viszont ezzel a módszerrel nem a megfelelő módon használja a HTML címsor elemet, aminek a következtében a segítő technológia nem fogja tudni ezt az elemet címsorként azonosítani.

Példa kód:


 <style type="text/css">
 .heading1{
        font-family: Times, serif;
        font-size:200%;
        font-weight:bold;
 }
 </style>
 <p class="heading1">Introduction</p>
 <p>This introduction provides detailed information about how to use this 
 ........
 </p>

Megjegyzés: Ebben az esetben a HTML H1-es szintű címsorának a formázására a CSS a legmegfelelőbb módszer.

2. hiba példa: Szövegek képeinek címsorokként történő alkalmazása, amikor a képek nem címsor taggekkel kerülnek kijelölésre.

A Chapter1.gif a "Chapter One" fájlnevű Garamond karaktertípusú, 20 pixel nagyságú szövegnek a képe. A kép megadása ilyen módon hibás, mivel azt legalább egy címsor elembe kell foglalni. Kedvezőbb megoldás a kép mellőzése, és a szöveg CSS-el formázott címsorként történő megjelenítése.

Példa kód:


<img src="Chapter1.gif" alt="Chapter One">
 
<p>Once upon a time in the land of the Web.....
</p>
3. hiba példa: Egy szó vagy kifejezés vizuális kiemelése CSS segítségével a kiemelés szemantikus jelzése nélkül.

Az alábbi példa hibának számít, mivel a CSS font-weight tulajdonságának segítségével félkövérre változtatott karakter tulajdonsága nem jelenik meg hatrározattan a szemantikus kijelölésben vagy a szövegben.

A félkövér stílus meghatározó CSS osztály:

Példa kód:


.yell {
  font-weight:bold;
  text-transform: uppercase;
}

Valamint a megfelelő HTML:

Példa kód:


<p>
 "I said, <span class="yell">no</span>, not before dinner!", 
 was the exasperated response when Timmy asked his mother for the 
 fourth time for an ice cream cone. 
 </p>

Források

Ehhez a technikához nincsenek elérhető források.

Ellenőrzések

Folyamat

  1. Szövegek képeihez:

    1. Ellenőrizze, hogy a szövegek képei közvetítik-e a dokumentum struktúrális információját.

    2. Ellenőrizze, hogy a megfelelő szemantikus struktúra (pl. HTML címsorok) a szöveggel együtt közvetíti-e az információt.

  2. Információt közvetítő formázott szöveg:

    2. Ellenőrizze, hogy szerepel-e tartalomban struktúrális információt közvetítő formázott szöveg.
    3. Ellenőrizze, hogy az információ közvetítésére a stílus mellett és a szöveggel együtt megfelelő szemantikus struktúra is alkalmazásra került-e.
Elvárható eredmények

  • Abban az esetben, ha az 1.1 pont igaz, akkor az 1.2 pont is igaz.

  • Abban az esetben, ha a 2.1 pont igaz, akkor a 2.2 pont is igaz.

Ez a weboldal A Technikák és Gyakori Hibák a Web Akadálymentesítési Útmutató 2.0-hoz része. Ez a dokumentum elérhető egy HTML fájlban is. Nézze meg a A WCAG 2.0 dokumentumait ezen dokumentum és a WCAG 2.0 egyéb dokumentumai között fennálló kapcsolatok áttekintéséhez.

Copyright © 2008 W3C® ( MIT, ERCIM, Keio), Minden jog fenntartva. Alkalmazandók a W3C felelősségi, védjegyoltalmi és dokumentumhasználati előírásai.