Html <i> oder <em>?

3 Antworten

Vom Beitragsersteller als hilfreich ausgezeichnet

Visuell gibt es zwischen i und em keinen Unterschied. Der liegt stattdessen in der Semantik. Um es dir besser vorstellen zu können, würde ich dir empfehlen, dir vorzustellen, ein Computer sollte dein HTML-Dokument vorlesen. Die Tags geben ihm dabei Hinweise darauf, wie Inhalte zu interpretieren und schlussendlich auch zu betonen sind.

Ein Text, der von i umgeben ist, hebt sich vom übrigen Text ab, um bspw. einen Fachbegriff, ein Fremdwort oder einen Songtitel zu kennzeichnen.

Beispiel: Ich lief durch die Straßen und pfiff dabei Another Day In Paradise, während mehrere Passanten meinen Weg kreuzten. Im Gegensatz zu mir waren sie in ihrem Kleidungsstil mehr en vogue.

Bei einem em hingegen soll eine gesonderte Betonung markiert werden.

Beispiel: We can do it.

Bei einem strong und einem b gibt es ebenso einen semantischen Unterschied. Ersteres Element bezieht sich stärker auf die Hierarchie des markierten Inhalts. Es könnte eine Überschrift repräsentieren oder generell einfach Text mit einer stärkeren Betonung. Wie bei einem Text, bei dem einzelne Sätze / Wörter hervorgehoben werden, weil sie besonders prägnant sein sollen. Es kommt hierbei nicht speziell darauf an, dass der Inhalt fett formatiert wird. Genauso gut könnte man ihn mit einer gelben Hintergrundfarbe markieren (wie mit einem Fineliner).

Das b-Element könnte ähnlich wie bei einem i bestimmte Wörter markieren, weil z.B. darauf hingedeutet werden soll, dass es sich um einen Fachbegriff o.ä. handelt. Es hat allerdings keinen Nachdruck / keine hierarchische Bedeutung, so wie das strong-Element.

Die Elemente i und b wurden damals noch zu anderen Zwecken in den HTML-Standard aufgenommen: Zur visuellen Textformatierung. Man hat sich mit Einführung von HTML5 allerdings wieder auf die eigentliche Motivation von HTML besonnen, Inhalte lediglich mit Metainformationen auszustatten und so zu beschreiben, statt mit HTML auch Formatierungen / Stylings umzusetzen.

Die beiden genannten Tags wurden nach einigen Überlegungen nicht aus dem Standard entfernt, da sie, wie oben beschrieben, auch gewisse semantische Zwecke erfüllen können.

Um ehrlich zu sein, ich glaube das ist sogar das selbe, bin mir gerade nicht sicher. Wo ich mir aber sicher bin, dass wenn du später zu CSS kommst, du diese nie wieder brauchst. Mach dir also am besten um die keinen Kopf

Edit: Das eine ist alt, das andere ist neu. Das ist der Unterschied. https://www.mediaevent.de/html/em.html#:~:text=HTML%20em%2DTag&text=Die%20Tags%20em%20und%20i,einen%20Text.

Nur em!

Das i-Tag ist veraltet und hat keine Semantik!

Woher ich das weiß:Berufserfahrung