G57: A tartalom értelmes sorrendbe rendezése
Alkalmazhatóság
Minden technológia.
Jelen technika vonatkozik a(z):
Leírás
Jelen technika célja biztosítani, hogy a kisegítő technológiákhoz nyújtott tartalom sorrendje lehetővé tegye a felhasználó számára a tartalom megértését. Néhány technika sorrendileg engedélyezi a tartalom vizuális megjelenítését, még abban az esetben is, ha a mögöttes tartalom sorrendje zavart okozhat.
Például, amikor a HTML-ben nyelveket kevernek különböző írásirányú nyelvek esetében, a kétirányú algoritmus rossz helyre teheti a központozást. A helyesen rendezett tartalom a megfelelő sorrendben tartja fenn a központozást az adatfolyamban.
A vizuálisan megjelenített olyan fehér szóköz-karakterek, mint a szóköz vagy a tabulátor nem feltétlenül a tartalom részeként jelennek meg. Ennek ellenére, amikor a vizuális formázás szabályozásához beszúrják ezeket a tartalomba, összezavarhatják a tartalom jelentését.
Nagyobb szemcsézettség esetében, egy táblázatszerkezetet használó HTML dokumentumban a tartalomblokkok elhelyezésének ellenőrzése olyan megjelenítést hozhat létre, ahol a kapcsolódó információ vizuálisan együtt, de a tartalom adatfolyamában szétválasztva helyezik el. Amennyiben egy illusztráció feliratát az illusztráció mögötti sorban helyeznek el, általában nem lehetséges a felirat képhez történő kapcsolása, mivel a táblázat sorról sorra lesz olvasva.
Példák
Példa 1
Egy múzeumi kiállítás weboldala egy navigációs sávot tartalmaz, amely hivatkozások hosszú listáját foglalja magába. Az oldal szintén tartalmazza az egyik kiállított kép felvételét, a képhez tartozó fejlécet és egy részletes leírást a képről. A hivatkozások a navigációs sávban sorrendiséget alkotnak. A fejléc, a felvétel és a leírás szövege szintén sorrendiséget hoznak létre. Az alkotóelemek elhelyezéséhez az oldalon CSS-t használnak.
Példakód:
Markup:
<h1>My Museum Page</h1>
<ul id="nav">
<li><a href="#">Link 1</a></li>
...
<li><a href="#">Link 10</a></li>
</ul>
<div id="description">
<h2>Mona Lisa</h2>
<p>
<img src="img.png" alt="Mona Lisa">
</p>
<p>...detailed description of the picture...</p>
</div>
CSS:
ul#nav
{
float: left;
width: 9em;
list-style-type: none;
margin: 0;
padding: 0.5em;
color: #fff;
background-color: #063;
}
ul#nav a
{
display: block;
width: 100%;
text-decoration: none;
color: #fff;
background-color: #063;
}
div#description
{
margin-left: 11em;
}
Források
Nincsenek elérhető források..
Kapcsolódó technikák
- G59: Az interaktív elemek olyan sorrendbe állítása, amely követi a tartalom sorrendiségét és kapcsolódó pontjait
- C6: A tartalom pozícionálása strukturális kijelölés alapján
- C27: A dokumentum objektum modell (DOM) egyeztetése a vizuális sorrenddel
- F1: Az 1.3.2 teljesítési feltételhez tartozó hiba, amelyet a CSS-el pozícionált tartalom miatt megváltozó jelentés okoz
- F49: Az 1.3.2 teljesítési feltételhez tartozó hiba, amelyet az értelmetlen linearizált elrendezés célú HTML táblázat okoz
Ellenőrzések
Folyamat
-
Rendezze sorba a tartalmat a technológiához használt szabványos módszerrel (pl. elrendezési stílusok eltávolítása, vagy sorbarendezési eszköz futtatása)
-
Ellenőrizze, hogy a tartalom sorrendje az eredetivel megegyező jelentést közvetít.
Várható eredmények
-
A #2 ellenőrzés teljesül.