Strong und Emphasis Tag in 2022 richtig verwenden!

Hast du schon einmal bemerkt, dass wenn du im WordPress Visual-Editor eine Textpassage (Buchstabe, Wort oder ganzen Satz) mit „B“ für Fettschrift (Bold) oder „/“ als Kursivschrift (Italic) markierst, dass diese im HTML nicht immer mit dem eigentlichen HTML-Tag „“ für Bold (Fett) oder““ für Italic (Kursiv) betitelt werden?

Stattdessen wird ein „“ und „“-Tag gesetzt.

Warum ist dies so? Wieso werden Strong und Emphasis Tags als die eigentlich „falschen“ HTML-Tags genutzt?

Dies erfährst du hier im Beitrag.

Inhalte Anzeigen

Unterscheidung und Wirkung der HTML-Tags

Um zu verstehen was die HTML-Tags „“, „“, „“ und „“ für eine Bedeutung haben, möchte ich diese zuerst einmal unterscheiden.

Typografie-HTML-Tags: „“ (Italic) und „“ (Bold)

Italic- und Bold-Tags werden für rein stilistische Zwecke der gedruckten Schrift (Typographie) genutzt.

Diese Stil-Elemente unterscheiden sich wie folgt:

„“ Bold (zu Deutsch: fett, fettgedruckt) steht für die fette Schreibweise.
Die fette Schreibweise soll bereits vorm Lesen des eigentlichen Texts hervorstechen und damit die Orientierung im Text unterstützen.
„“ Italic (zu Deutsch: kursiv) steht für die kursive Schreibweise.
Die kursive Schreibweise soll erst während des Lesens des Textes hervorstechen.

Mit diesen beiden „Tags“ kannst du somit Teile eines Textes optisch hervorheben, um deren Bedeutung für den Inhalt des Textes kenntlich zu machen. Man spricht dabei auch von „Auszeichnung“ der Schrift.

Außer der Änderung der Schreibweise kommt diesen beiden Tags aber keine weitere Bedeutung, z.B. semantischer Art, zu.

Semantische Tags: „“ (Strong) und „“ (Emphasis)

Das und das -Tag sind hingegen, gegenüber der beiden vorhergehenden Tags, KEINE Stil-Elemente, sondern rein semantische Elemente. Semantik steht für die Lehre von der Bedeutung der Zeichen.

„“ Strong (zu Deutsch: stark, kräftig) steht für eine stärkere Betonung, somit einer größeren Wichtigkeit der Textpassage als des restlichen Texts.
„“ Emphasis steht für eine „stress emphasis“. Daher erhält ein Text, der so markiert wurde, die zusätzliche Bedeutung, dass dieser Text „verbalen Stress“ ausdrücken soll.

Diese beiden Tags haben somit eigentlich keine Absicht die Darstellung der Schrift eines Textes (Typografie) zu beeinflussen, sondern wollen nur eine bestimmte Aussage der Textpassage ausdrücken.

Wie die Nutzung dieser Tags im WordPress-Visual-Editor umgesetzt wird, sehen wir uns nun an.

Fett- und Kursivschrift über den WordPress-Editor nutzen

Normalerweise wirst du wahrscheinlich die rein textlichen Hervorhebungen (Fett-und Kursivschrift) ganz einfach im visuellen Editor per Markierung der entsprechenden Textpassage und anschließendem Klick auf das „B“ für Fettschrift oder „/“ für Kursivschrift umsetzen.

Die so markierte Textpassage erscheint anschließend, je nach Markierung, in „fetter“ oder „kursiver“ Schreibweise.

Das wiederum bedeutet, dass im Hintergrund, automatisch im HTML-Code deiner Webseite das „“-Tag (Bold = Fett) für die Markierung der Fettschrift, respektive das „“-Tag (Italic = Kursiv) bei der entsprechenden Textpassage hinterlegt wird.

Aber, ist das wirklich immer so?

Das hängt von dem WordPress-Theme ab, dass du für deine Website nutzt. Denn das Theme definiert selbst, wie diese WordPress-Editor-Funktionen in HTML-Tags übersetzt werden.

Überprüfung wie dein Theme die HTML-Tags einsetzt

Du kannst ganz leicht überprüfen, mit welchen HTML-Tag dein Theme den „B“-Button und den „/“-Button im WordPress Editor belegt hat.

Dazu markierst du in deinem Beitrag eine Textpassage und klickst im Editor auf „B“ und bei einer anderen Textpassage auf „/“.

Anschließend schaust du, wie diese Markierungen im HTML-Code niedergelegt wurden.

Dazu klickst du auf den entsprechenden Block und danach auf das Symbol mit den drei Punkten, um das Menü zu erweitern. Anschließend klickst du auf „Als HTML bearbeiten“.

Dann erscheint der Abschnitt in HTML und du kannst den verwendeten Tag sehen.

Auf diesem Wege kannst du sehen, dass bei manchen Themes statt des „“-Tags für Fettschrift, das „“-Tag und statt des „“-Tags für Kursivschrift, das „“-Tag genutzt wird.

Typographische Darstellung der Tags

Wie die textliche Darstellung der „“, „“, „“ und „“-Tags umgesetzt wird, dass kann durch zwei Dinge bestimmt werden:

durch den Browser, der die Webseite aufruft
durch das CSS-Stylesheet des von dir verwendeten Themes

Alle Browser haben eine Grundformatierung, wie sie den Text von bestimmten Tags darstellen.

Und so stellen die meist verwendeten Browser (z.B. Google Chrome, Mozilla Firefox und Apple Safari) Text, der mit dem HTML-Tag „“ (Strong) oder „“ (Bold) markiert wird, standardmäßig in Fettschrift dar und Text, der mit dem Tag „“ (Emphasis) oder „“ (Italic) markiert ist, in Kursivschrift.

Diese Standardformatierungen des Browsers könnten jedoch durch das CSS-Stylesheet des verwendeten WordPress Themes auch überschrieben werden. Dort kann der Anbieter des Themes theoretisch alles so umsetzen wie er es möchte.

Allerdings gibt es auch ein Regelwerk, wie diese Tags eingesetzt werden sollen. In den Spezifikationen des W3-Consortiums wird definiert, wie der mit dem jeweiligen HTML-Tag markierte Text dargestellt werden soll.

Danach soll das „“(Bold)-Tag als Fettschrift und das „“(Italic)-Tag als Kursivschrift dargestellt werden.

Wie das „“-und „“-Tag dargestellt werden soll, ist allerdings nicht definiert.

Somit bleibt es letztendlich der CSS-Definition des Themes vorbehalten, ob und wie es das Strong- und Emphasis-Tag auf die Darstellung im Text einwirken lässt. Auch du kannst das theoretisch wiederum leicht durch ein wenig Anpassung des CSS-Code ändern.

Ich kenne allerdings kein Theme, dass eine solche Anpassung der semantischen Tags standardmäßig vornimmt. Falls du eines kennst, so schreibe doch bitte unten einen Kommentar. Danke Dir.

Somit wird das Strong-Tag standardmäßig als Fettschrift und das Emphasis-Tag standardmäßig als Kursivschrift von den Browsern dargestellt.

Auswirkung auf Suchmaschinen und SEO

Wenn nun die typographische Darstellung der Tags in der Praxis keinen Unterschied macht, warum werden dann die semantischen Tags statt der typographischen Tags genutzt, wenn man eine Fett- oder Kursivschrift nutzen möchte?

Der Grund liegt in der höheren Relevanz für das SEO.

Sowohl das Bold- als auch das Italic-Tag wollen nur rein textliche Aufmerksamkeit beim Leser erlangen. Dabei kommt bei beiden Tags beim Leser keine höhere Wertigkeit der Textpassage zu tragen.

Auch die Suchmaschinen können diesen rein textlichen Markierungen (Bold und Italic) eine gleiche Gewichtung zuordnen. So macht es auch Google. Google wertet beide Schreibweisen, die Fettschrift als auch die Kursivschrift als gleichwertige Hervorhebungen.

Zudem haben die rein typographischen Tags keine höhere Wertigkeit in Bezug auf das SEO.

Die semantischen Tags hingegen haben eine höhere Wertigkeit für das SEO, da sie zusätzlich eine Bedeutung hinter den Text legen.

Daher wird dem Strong- und dem Emphasis-Tag auch eine höhere Wertigkeit gegenüber den rein textlichen Markierungen zugeteilt.

Die Wertigkeit dieser Tags kann sogar durch eine Verschachtelung der Tags untereinander nochmals gesteigert werden. Dies hat dann aber rein semantische Wirkung, der Text wird durch den Browser nicht nochmal anders markiert.

Ein semantisch markierter Text erhält somit eine höhere Wertigkeit im SEO als eine rein textliche Hervorhebung. Allerdings muss man diese Textmarkierungen dann auch dem semantischen Zweck entsprechend nutzen, da es ansonsten auch nach hinten losgehen kann.

Neue Bedeutung der typographischen Tags in HTML5

Allerdings ist auch die Bedeutung der typographischen Tags im Wandel.

Die semantische „Markierung“ ist in der neuen HTML5-Spezifikation stärker in den Fokus geraten. Deswegen erhalten nun teilweise auch die bisher rein textlichen Markierungen eine semantische Wirkung.

Das Italic-Tag wird danach nun folgendermaßen neu definiert:

„Das i-Tag wird verwendet, um einen Teil des Textes in einer anderen Stimme oder Stimmung zu definieren. Dieses Tag wird verwendet, um Fachbegriffe, Phrasen aus Fremdsprachen usw. zu definieren.“

Dem Bold-Tag kommt allerdings auch nach der neuen Spezifikation weiterhin keine weitere semantische Bedeutung zu.

Das b-Tag steht weiterhin nur für eine Textpassage, auf die aus praktischen Gründen aufmerksam gemacht wird, ohne dass eine zusätzliche Bedeutung vermittelt wird, d.h. ohne dass eine andere Stimme oder Stimmung angedeutet wird. B-Tags werden z. B. für Schlüsselwörter in einer Zusammenfassung oder Produktnamen verwendet.

Nutzung der Strong und Emphasis Tags

Das Strong-Tag solltest du nur mit Bedacht einsetzen und nicht einfach nur um eine Textpassage in Fettschrift zu markieren. Für die reine Fettschrift solltest du nur den Bold-Tag „“ nutzen.

Gleiches gilt für das Emphasis-Tag „“. Auch dieses sollte nur seiner semantischen Bedeutung nach eingesetzt werden, nicht nur um eine Kursivschrift zu erzeugen. Möchtest du nur eine textliche Hervorhebung durch Kursivschrift nutzen, solltest du das „“ Italic-Tag nutzen.

Wenn dein Theme im WordPress-Visual-Editor die Belegung der Buttons „B“ für Fettschrift und „/“ für Kursivschrift mit den HTML-Tags „strong“ und „em“ statt „b“ und „i“ belegt, dann solltest du dies unbedingt berücksichtigen und entsprechend anwenden. Möchtest du in dem Fall nur eine rein textliche Markierung, musst du diese manuell per HTML-Eingabe der Tags durchführen.

In Überschriften solltest du diese Tags generell weglassen, da für diese speziell die Überschriften H1 – H6 reserviert sind.

Warum werden „fett“ oder „kursiv“ geschriebene Texte mit einem Strong und Emphasis Tag markiert?