**`<u>`** is one of the more misunderstood elements: it looks like a plain underline, which historically was used for links, so many developers avoid it to prevent confusing users into thinking underlined text is clickable. Semantically, HTML5 redefined `<u>` to represent a **non-textual annotation** — for example, marking a spelling error (as a spell-checker would), labeling a proper name in Chinese text (a traditional annotation convention), or similar 'this is marked, but not for emphasis' cases. It's not meant as a generic 'underline for style' tag.
1Understanding <u>
`<u>` is one of the more misunderstood elements: it looks like a plain underline, which historically was used for links, so many developers avoid it to prevent confusing users into thinking underlined text is clickable. Semantically, HTML5 redefined <u> to represent a non-textual annotation — for example, marking a spelling error (as a spell-checker would), labeling a proper name in Chinese text (a traditional annotation convention), or similar 'this is marked, but not for emphasis' cases. It's not meant as a generic 'underline for style' tag.
If you just want underlined text for visual style, use CSS text-decoration: underline instead — and never use <u> (or CSS underline) on plain non-link text near actual links, since it creates confusing visual ambiguity.
<p>Please review this <u>drafted</u> section before publishing.</p>2Practical Example
Here is a real-world application of <u> showing how it is used in production HTML.
<!-- Marking a misspelling, similar to a spell-checker's red squiggle -->
<p>I recieved <u>recieved</u> your message. <!-- should be "received" --></p>3Best Practices
Follow these guidelines when working with <u>:
1. Reserve <u> for genuine non-textual annotations (spelling markup, proper name marks), not generic styling
2. Use CSS text-decoration: underline for purely visual underlines
3. Avoid underlining non-link text anywhere near real links, to prevent confusing users
Tip: If you just want underlined text for visual style, use CSS text-decoration: underline instead — and never use <u> (or CSS underline) on plain non-link text near actual links, since it creates confusing visual ambiguity.
<p>Please review this <u>drafted</u> section before publishing.</p>