<b> oder <strong>

Strong hebt hervor, b soll etwas in Fettdruck darstellen. Das eine ist semantisch korrekt, das andere ist ein Relikt aus der Anfangszeit von HTML.

Ja, das wusste ich auch.

Aber man wenn immer strong verwendet wird, hebt man doch alles hervor, auch einzelne Wörter, obwohl semantisch gesehen es nur Sinn macht, einen halben/ganzen Satz hervorzuheben oder zumindest mehrere Wörter. Semantisch ein einzelnes Wort hervorheben macht wohl weniger Sinn, da ist wohl Fettdruck besser.

Aber was ist nun üblich? Immer strong verwenden? Und warum?

Nein, nicht unbedingt. Es ist durchaus häufig erwünscht, auch nur ein einzelnes Wort in einem Satz hervorzuheben (zum Beispiel um dieses Wort bei einer Sprachausgabe betonen zu lassen).

<b> ist ein sogenannter "visueller HTML-Tag". Damit wird (anders als in heutiger Zeit üblich) bereits durch die HTML-Struktur das spätere Aussehen bestimmt. Dies kann heutzutage auch mittels <span class="bold"> erreicht werden, womit die Struktur keine Vorgaben in Richtung des späteren Erscheinungsbildes macht.

<b> fällt für mich ungefähr in die gleiche Kategorie wie class="rot" :)

Der <strong> Tag wird im Übrigen auch nur freundlicherweise von den meisten Browsern fett dargestellt (mittels vom Browser gelieferter Standard CSS-Anweisung).

edit: <strong> wird übrigens für starke Betonungen eingesetzt. Um etwas nur leicht zu betonen, bietet sich <em> an.

Ja genau, das hab ich vergessen zu schreiben:

Dann müsste ja strong und em ständig gemicht werden, aber das tut doch wohl keiner, alle verwenden anscheinend nur strong. Ist das so? (Und neben em gibt es ja noch weitere, die em ähnlich sind).

Das Problem hier liegt bereits in den Spezifikationen vom W3C. Die Wahl der Bezeichner von <strong> und <em> sind bereits unglücklich, zum Glück wurde die Bedeutung in HTML5 wieder zurecht gebogen.

Aber erstmal zu den alten Bedeutungen ein paar Worte:

• <b> … das b steht für bold und entspricht einem style="font-weight:bold" oder Fettschrift in Textdokumenten (Microsoft Word). Dieses Tag sollte keine Verwendung mehr finden, da HTML eine Auszeichnungssprache und keine Formatierungssprache ist.
• <i> … das i steht für italic und entspricht einem style="font-style:italic" oder Kursiv. Dieses Tag sollte keine Verwendung mehr finden, siehe voriger Punkt.
• <em> … aus der Original-Dokumentation: „Indicates emphasis.“ Soweit so klar. Die gängigen Browser stellen Text der sich zwischen diesen Tags befindet kursiv dar.
• <strong> … aus der Original-Dokumentation: „Indicates stronger emphasis.“ Tja und was das bedeuten soll weiß wohl keiner so genau, wie sieht eine stärkere Betonung aus? Wie hört sich eine stärkere Betonung an? Fragen über Fragen! Gängige Browser stellen Text der sich zwischen diesen Tags befindet fett dar.

Was bedeutet das nun für Webdesigner?
Die Tags <b> und <i> sind obsolet und sollten gar nie Verwendung finden, wie die Formatierung zu erfolgen hat folgt gleich.
Die Tags <em> und <strong> werden von den Meisten synonym zu <b> und <i> verwendet. Dies ist jedoch völlig falsch und sollte so auch nicht passieren. HTML ist eine reine Auszeichnungssprache, vergleichbar mit z. B. LaTeX oder XML (was wiederum eine Obermenge von XHTML ist) bzw. SGML (was eine Obermenge von HTML ist). Die Tags sollten wirklich nur dann verwendet werden, wenn der Text der sich darin befindet auch hervorgehoben werden sollte, ihr müsst dabei darüber nachdenken wie wenn ihr mit jemandem sprechen würdet. Daraus folgt, dass diese Tags innerhalb von einem reinen Design niemals Anwendung finden. Sie können ausschließlich in Fließtexten vorkommen.

Für all jene von euch die sich für SEO interessieren noch der folgende Hinweis. Das <strong>-Tag sollte ausschließlich einmal in einer Ressource vorkommen, ziemlich am Anfang vom Fließtext, und sollte den Text der sich auch in der <h1>-Überschrift bzw. im <title>-Tag vom <head> befindet umschließen.

Die Formatierung (also das Design) sollte ausschließlich über CSS erfolgen. Dazu erstellt ihr euch am einfachsten generische CSS-Klassen, also z. B. .bold und .italic (.bold{font-weight:bold}.italic{font-style:italic}), die ihr nachher in euren Themes mit <span>-Tags verwendet.

In HTML5 sieht die Definition vom W3C wie folgt aus:

• <b> … wie in HTML4 [1].
• <i> … wie in HTML4, jedoch mit dem Hinweis, dass dieses Tag im Besonderen dann zum Einsatz kommen sollte, wenn ein bestimmter Textabschnitt als unterschiedlich zum Rest ausgezeichnet werden soll. Mir fällt hier z. B. ein Absatz in einer anderen Sprache ein, Bsp. <i lang="ja">リヒャルト</i> (was übrigens mein Benutzername auf Japanisch ist) [2].
• <em> … wie in HTML4 [3].
• <strong> … wurde geändert, das Tag sollte dazu verwendet werden besonders wichtigen Text auszuzeichnen, wie obig im SEO-Abschnitt beschrieben [3].

Danke, Super Erklärung.

Wie man sich das nun merkt ohne wieder darauf zu vergessen, ist schwer zu sagen.
Am besten kein bold, b und i mehr verwenden, sondern CSS Klassen anlagen.