G115: Szemantikai elemek alkalmazása a szerkezetek jelöléséhez
Alkalmazhatóság
Jelölőnyelvek, beleértve a HTML 4.01-et, XHTML 1.x-et
Jelen technika vonatkozik a(z):
Leírás
Jelen technika célja kijelölni a webtartalom szerkezetét a megfelelő szemantikai elemek használatával. Más szavakkal leírva: az elemeket jelentésüknek megfelelően használják és nem vizuális megjelenésük miatt.
A megfelelő szemantikai elemek használata biztosítja a szerkezet elérhetőségét a felhasználói program számára. Ez egyértelműen magába foglalja annak a szerepnek a feltüntetését, melyet a különböző egységek töltenek be a tartalom jelentésének megértésében. A tartalom olyan részeit, mint a bekezdés, címsor, kiemelt szöveg, táblázat stb., mind fel lehet tüntetni ily módon. Néhány esetben a tartalom olyan részei közötti kapcsolatokat, mint a címsorok és alcímek, vagy egy táblázat cellái közötti kapcsolat, szintén fel kellene tüntetni. A felhasználói program érzékelhetővé teheti a szerkezetet, struktúrát a felhasználó számára, például a különböző típusú szerkezetek esetében egy eltérő vizuális megjelenítés vagy különböző hangok, illetve hangmagasság használatával a hangfelvételben.
A HTML-ben például az olyan kifejezésszintű elemek,
mint az em, abbr és
cite, szemantikai információt nyújtanak a
mondatokon belül, így megjelölve a szöveget a
hangsúlyozáshoz és beazonosítva a rövidítéseket és
idézeteket. A MathML egy jelölőnyelv, melyet azért
terveztek, hogy a szerkezet és a matematikai
megjelenítés között megtartsa a fontos különbségeket.
Speciális „megjelenítési” jelölést tartalmaz a
matematikai fogalmak kifejezéséhez használt összetett
jelmagyarázatokhoz, valamint „tartalmi” (szemantikai)
jelölést magukhoz a matematikai fogalmakhoz.
Példák
Példa 1
Egy bekezdés egy másik oldalra vezető
hiperhivatkozást tartalmaz. A hiperhivatkozás az
a elem használatával kerül
megjelölésre.
Példa kód:
<p>Do you want to try our new tool yourself? A free
demonstration version is available in our
<a href="download.html">download section</a></p>
Példa 2
Egy a házasság történelmével foglalkozó oldal a
Büszkeség és balítélet című Jane Austen novellából
származó idézetet használ példaként. A könyvre való
hivatkozást a cite elem alkalmazásával
jelzik, míg magát az idézetet a
blockquote elemmel.
Példa kód:
<p>Marriage was considered a logical step for a bachelor,
as can be seen in the first chapter of the novel
<cite>Pride and Prejudice</cite>:</p>
<blockquote>
<p>It is a truth universally acknowledged, that a single man in
possession of a good fortune, must be in want of a wife.</p>
<p>However little known the feelings or views of such a man may
be on his first entering a neighbourhood, this truth is so well
fixed in the minds of the surrounding families, that he is considered
the rightful property of some one or other of their daughters.</p>
</blockquote>
Példa 3
Egy autós kézikönyv elmagyarázza, hogy hogyan
működik a motor. Az útmutató figyelmeztet arra, hogy
a váltó üresben álljon. A szerkesztő véleménye
szerint a figyelmeztetés annyira fontos, hogy ki kell
emelni, így a figyelmeztetés a strong
elemmel kerül feltüntetésre.
Példa kód:
<h1>How to start the engine</h1>
<p>Before starting the engine, <strong>make sure the gear
is in neutral</strong>. Next, turn the key in the ignition.
The engine should start.</p>
Példa 4
Jelen példa azt mutatja be, hogy hogyan használja
az em és strong elemeket a
szöveg kihangsúlyozásához.
Példa kód:
<p>What she <em>really</em> meant to say was,
"This is not ok, it is <strong>excellent</strong>!"</p>
Példa 5: Kiemelő és háttérszínek használata a fontos információ vizuális és szemantikai beazonosításához.
Példa kód:
<style type="text/css">
.vocab {
background-color:cyan;
font-style:normal;
}
</style>
.......
<p>New vocabulary words are emphasized and highlighted
with a cyan background</p>
<p>The <em class="vocab">scathing </em> review of the play
seemed a bit too harsh. .... </p>
Források
A források csak információs célokat szolgálnak, és csak angolul elérhetőek.
-
Mathematical Markup Language (MathML) Version 2.0, Second Edition
-
Jeffrey Zeldman's book "Designing with Web standards"
-
Web Design Group's article "Document style: Use the right tag for the job"
Kapcsolódó technikák
- H39: Felirat elemek használata az adattáblázat feliratainak az adattáblázatokkal történő társítása céljából
- H42: A fejlécek azonosítása a h1-h6 segítségével
- H44: Címke elemek használata szövegcímkék és űrlapvezérlők társítása céljából
- H48: Ol, ul és dl használata listákhoz
- H49: Szemantikus jelölés használata kiemelt vagy speciális szövegek kijelölésére
- H51: Táblázat kijelölés alkalmazás a táblázatos információk megjelenítésével
- H71: Űrlapvezérlők csoportjának a leírása mezőkészlet és jelmagyarázat elemek használatával
Ellenőrzések
Folyamat
-
Ellenőrizze, hogy léteznek-e olyan tartalomrészek, amelyekhez szemantikai funkció tartozik.
-
Minden egyes olyan rész esetében, amelyhez szemantikai funkció tartozik, és amennyiben létezik megfelelő szemantikai jelölés a technológiában, ellenőrizze, hogy a tartalom az adott szemantikai jelöléssel került jelölésre.
Várható eredmények
-
A #2 ellenőrzés teljesül.