Mi a különbség a <strong> és a <b> között?

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.

Szemantikus Web - strong és em

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.

Hivatkozások

http://www.w3.org/standards/semanticweb/