HTML Grundlagen: Was ist der Unterschied zwischen <em> und <i>?

EM vs. I – Was ist der Unterschied?

Die Ausgabe der HTML Tags EM und I wird vom Web-Browser in gleicher Weise dargestellt. Beide Tags stellen den Text kursiv dar. Es gibt aber einen entscheidenden Unterschied zwischen den beiden HTML Elementen.

HTML <em> TagDas HTML EM Tag hat im Gegensatz zum I Tag eine semantische, das heißt inhaltliche Bedeutung. Text, der mit dem EM Tag (em für Englisch »emphasis«) ausgezeichnet wird, ist wichtig und soll betont werden. Betonter Text wird mit <em> eingeleitet und muss mit </em> abgeschlossen werden. Der mit EM ausgezeichnete Text wird im Schriftbild in der Regel kursiv gedruckt dargestellt. Der mit EM ausgezeichnete Text wird aber nicht zwangsläufig in jedem Web-Browser kursiv gedruckt.

HTML <i> TagDas HTML I Tag (i für Englisch »italic«) 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 wird verwendet, wenn Text kursiv gedruckt dargestellt werden soll, aber nicht betont wird.

Die HTML Elemente EM und I sind Inline-Elemente, sie erzeugen keinen automatischen Zeilenumbruch.

Besonders betonter Text wird mit dem <em> Tag erzeugt.

Vermeide Doppel-Auszeichnungen wie

Das STRONG Tag hat eine höhere Wertigkeit als das EM Tag. Verwende statt <strong> besser <b>, wenn betonter Text kursiv und fett gedruckt dargestellt werden soll. Optimal ist diese Form:

Solche Konstruktionen können als Spam interpretiert werden.