Em vs i tag in HTML - Quick Revision & Key Differences

Recall & Review

beginner

What does the <em> tag represent in HTML?

The <em> tag is used to emphasize text, indicating that the content has stress or importance. Screen readers often change their tone when reading emphasized text.

beginner

What is the primary purpose of the <i> tag in HTML?

The <i> tag is used to display text in an alternate voice or mood, such as a technical term, a phrase from another language, or a thought. It is mainly for styling and does not imply emphasis.

intermediate

How do <em> and <i> tags differ in meaning and usage?

<em> adds emphasis and changes meaning or importance, affecting screen readers. <i> is for text that is stylistically different but not necessarily emphasized, like foreign words or titles.

beginner

Which tag should you use to emphasize a word for screen readers and why?

Use <em> because it signals emphasis semantically, so screen readers can adjust their voice to convey importance.

intermediate

Can <i> and <em> tags look the same visually? Should they be used interchangeably?

Yes, by default both render text in italics. But they should not be used interchangeably because they have different meanings and accessibility roles.

Which HTML tag is best for emphasizing important text for screen readers?

A <em>

B <i>

C <b>

D <u>

is used to emphasize text semantically, helping screen readers convey importance.

What is the main visual effect of both <em> and <i> tags by default?

A Bold text

B Italic text

C Underlined text

D Strikethrough text

Both and tags render text in italics by default.

Which tag is appropriate for marking a foreign word in a sentence?

A <em>

B <mark>

C <strong>

D <i>

is used for text that is stylistically different, like foreign words.

Does the <i> tag add semantic emphasis to text?

A No, it only changes style

B Yes, it adds strong emphasis

C Yes, it signals importance to screen readers

D No, it underlines text

changes the style but does not add semantic emphasis.

Which tag should you use to indicate a thought or a technical term?

A <strong>

B <em>

C <i>

D <code>

is suitable for marking thoughts, technical terms, or alternate voice text.

Explain the difference between the and tags in HTML and when to use each.

Think about meaning vs style and accessibility.

Describe how screen readers treat text inside compared to tags.

Focus on accessibility and semantic meaning.