When to use “em” and “i” tags for italics in HTML5

Posted in Articles

In HTML5, both the <i> and the <em> tags are perfectly fine to use.  Both will italicize text with the same appearance.

So when do you use the <i> versus the <em> tags?

Use <em> when you want to place emphasize on particular words within a sentence that would change the meaning of the sentence.  For example, these three sentences mean something slightly different …

Dogs are smart and likable.
Dogs are smart and likable.
Dogs are smart and likable.

And they are using <em> for the italics.

Use the <i> tag for general italicize text when you want to offset italicized text from the rest of the non-italicized text.  Or when text is in a different tone.

HTML5 W3C says to use <i> for text …

“in an alternate voice or mood, or otherwise offset from the normal prose in a manner indicating a different quality of text”

To convey importance, use <strong> instead of <em>.

See also the use of <b> and <strong>.

---