The <em> Element
As defined in the HTML Living Standard, the <em> element represents emphatic stress—that is, the component of a sentence that is emphasized.
You must ensure your website is accessible.
I thought we were meeting at the cafe.
<p>This is <em>very</em> important.</p>
View HTML Living Standard: The em element
Emphatic Stress vs. Styling
A common mistake is using <em> purely for italicizing text. Under semantic standards, the tag choice depends on the meaning:
<em>: Used for stress that changes the meaning of a sentence. (e.g., "I did write that.")<i>: Used for text set off from the normal prose for a different reason, such as technical terms, idiomatic phrases from another language, or ship names.<strong>: Used for content that is of great importance, seriousness, or urgency.
WCAG Requirement: Info and Relationships
Success Criterion 1.3.1 (Level A): Information, structure, and relationships conveyed through presentation can be programmatically determined.
While most screen readers currently do not change their vocal inflection when encountering an <em> tag by default, using the semantic element ensures that the relationship (the stress) is programmatically available. This allows users to enable specific screen reader settings that do announce emphasis, providing a comparable experience to sighted users who perceive the italics.
Nesting and Levels of Stress
The <em> element can be nested. Each level of nesting represents a greater degree of emphatic stress.
<p>
The deadline is <em>today, <em>not</em> tomorrow</em>.
</p>
A11y Tip: Beyond Italics
If the emphasis is critical for understanding (such as a warning), do not rely on the <em> tag alone. Supplement the visual styling with text cues (e.g., "Note:" or "Important:") to ensure the message is clear regardless of the user's assistive technology settings.