EM vs. I – Was ist der Unterschied zwischen Emphasis und Italic?
Die HTML-Elemente EM und I sind Inline-Elemente, d.h. sie erzeugen keinen automatischen Zeilenumbruch.
Die beiden HTML-Tags EM (für Englisch: Emphasis) und I (für Englisch: italic) geben den Text normalerweise gleich formatiert aus. Beide HTML-Elemente geben den Text standardmäßig kursiv geschrieben aus. Aber es gibt einen entscheidenden Unterschied zwischen dem EM-Tag und dem I-Tag.
Das HTML EM-Tag hat im Gegensatz zum I-Tag eine eine semantische (d.h. inhaltliche) Bedeutung. Text, der mit EM ausgezeichnet wird, ist wichtig und soll betont werden. Der hervorgehobene Text wird mit <em> eingeleitet und muss mit </em> abgeschlossen werden.
Mit EM ausgezeichneter Text wird im Schriftbild in der Regel durch kursive Schrift dargestellt. Der auf diese Weise formatierte Text muss aber nicht zwangsläufig in jedem Browser kursiv dargestellt werden.
Das HTML I-Tag hat keine semantische Bedeutung, sondern ist nur eine visuelle Formatierung. Kursiv gedruckter Text wird mit <i> eingeleitet und muss mit </i> abgeschlossen werden.
Das I-Tag (in HTML5: idiomatisch) wird verwendet, wenn einzelne Wörter anders formatiert werden sollen als normaler Text. Der so ausgezeichnete Text wird aber nicht betont.
Betonter Text wird mit dem <em>-Tag erzeugt.
<em>Dieser Text wird besonders betont.</em>Dieser Hintergrund repräsentiert das Ausgabe-Display und gehört nicht zum Beispiel-Code.
BeispielKursiv gedruckter Text ohne besondere Bedeutung wird mit dem <i>-Tag erzeugt.
<i>Dieser Text wird kursiv gedruckt.</i>Dieser Hintergrund repräsentiert das Ausgabe-Display und gehört nicht zum Beispiel-Code.
HinweiseVermeide Doppel-Auszeichnungen wie
<em><strong>Dieser Text ist wichtig und soll stark betont werden.</strong></em>Dieser Hintergrund repräsentiert das Ausgabe-Display und gehört nicht zum Beispiel-Code.
<strong><em>Dieser Text ist wichtig und soll stark betont werden.</em></strong>Dieser Hintergrund repräsentiert das Ausgabe-Display und gehört nicht zum Beispiel-Code.
Das EM-Tag hat eine niedrigere Relevanz als das STRONG-Tag. Verwende statt <strong> besser <b>, wenn betonter Text durch kursive Schrift und fettgedruckt dargestellt werden soll. Optimal ist diese Form:
<em><b>Dieser Text wird stark betont und soll fett gedruckt werden.</b></em>Dieser Hintergrund repräsentiert das Ausgabe-Display und gehört nicht zum Beispiel-Code.
<em><i>Dieser Text wird stark betont und soll kursiv gedruckt werden.</i></em><i><em>Dieser Text wird stark betont und soll kursiv gedruckt werden.</em></i>Solche Konstruktionen können als Spam interpretiert werden.