Az utóbbi időben gyakran felmerülő kérdés, hogy mi igazán a különbség a <b> és a <strong>, az <i> és az <em> tagek használata között. Melyiket mikor, mire és hogyan érdemes használni? A kérdés azért is érdekes, mert a két-két tag alkalmazásakor a böngészőkben legtöbbször teljesen ugyanúgy jelenik meg a közbezárt szöveg, ebben nincs különbség. A különbségek pontos megértéséhez meg kell ismerkedni az egyre gyakrabban emlegetett, „szemantikus web” fogalmával is.
A szemantikus web, a strong és az em tagek
A fenti tagek közötti különbség megértéséhez tisztáznunk kell a szemantikus web fogalmát. Millió helyen olvashattok erről, így csak a lényegét emelném ki. A szemantikus web célja, hogy a weblapon közölt információkat az egyszerű szövegen túl olyan jelölésekkel lássuk el, amelyek az automatizált rendszereken könnyen feldolgozhatóvá teszik azt. Egy emberi látogatónak egyértelműek lehetnek, hogy egy cikknek melyik a címe, írói aláírása, dátuma, széljegyzete, a robotok ezeket csak akkor képesek azonosítani, ha a HTML kódban erre megfelelő jelöléseket is használunk.
A HTML5 szabványban néhány új taget is bevezettek ehhez, csak néhány példa:
- <nav> azonosítja az oldal navigációhoz használt elemeit, például menüket.
- <header> az oldal vagy cikk fejlécét határolja be.
- <section> az oldalszakaszt azonosít.
- <article> az oldal tartalmi, lényegi részét jelöli.
- <footer> a láblécet azonosítja.
- <aside> az oldalsávot jelöli.
- stb.
A törekvés egyértelmű, a szemantikus webbel a gondolkodni (még) nem képes robot számára emésztjük elő az információt. Az RDFa, Schema.org és egyéb jelölésekről most nem írnék, ezekre visszatérek egy későbbi cikk keretein belül.
A <strong> és <em> tagek kijelölik a szövegből a hangsúlyos, kiemelten fontos részeket.
Röviden összefoglalva a lényegi különbség
A <b> és <i> tag szövegformázásra szolgál, meghatározza a böngészőnek, hogy az adott szöveget vastagított vagy dőlt betűkkel szeretnénk megjeleníteni. Az <em> és <strong> ezekkel ellentétben csak az adott hangsúlyosságát, fontosságát emeli ki, megjelenítésre vonatkozóan nem adnak egyértelmű utasítást. Egy böngésző akár megjeleníthetné a <strong> elemet dőlt betűkkel, az <em> által megjelölt részt pedig aláhúzással, de akár megjelenhetne mindkettő normál betűkkel írva, és mondjuk hupililán is. A lényeg, hogy ami <em> és </em> között van az hangsúlyosabb a szöveg többi részénél, ami <strong> és </strong> között az pedig még inkább.
A szemantikus web és a SEO szempontjából a <strong> és <em> kiemelt jelentőségű, hangsúlyos szöveget jelöl meg, míg a <b> és <i> csak a böngészőt utasítja az eltérő megjelenítésre.
Miért jó nekünk mindez?
Úgy gondolom, hogy a humán látogatók számára a fentieknek nincs sok jelentősége. A webmesterek azonban bízhatnak (reménykedhetnek) abban, hogy a robotok számára emészthetőbb tartalmakért hálásak a keresők, azaz SEO tekintetében picit profitálhatnak a szemantikus web címkézéseiből.
Fontos, hogy az <em> és a <strong> elemek alkalmazását ne vigyük túlzásba, tényleg csak a kiemelendő szövegrészeket jelöljük meg, másképp a szemantikus webet előtérbe helyező keresőktől nem sok jóra számíthat a lapunk.