HTML Formatting.

HTML includes specialized elements for defining text with specific meaning and emphasis. Understanding the difference between visual and semantic formatting is key to accessibility.

The Essentials

is for importance, while is purely for visual boldness.

is for verbal emphasis, while is for alternative voice or mood.

highlights text for reference, like a highlighter pen.

<del> and <ins> represent document edits (deleted vs. inserted).

and are essential for math (x²) and chemistry (H₂O).

Professional Insights

Semantic Importance (Strong vs. B)

✔ Use: → for warnings, critical alerts, or key terms in a paragraph. → for purely stylistic bolding (like product names in a list). ❌ Avoid: → Using for anything that needs to be noticed by screen readers. 💡 Tip: → Search engines often give more weight to text wrapped in tags.

The Element for Accessibility

✔ Use: → To highlight search results or relevant parts of a quote. ❌ Avoid: → Using for decorative background colors. 💡 Tip: → Always provide additional context for screen readers when using , as it isn't always announced by default.

Critical Pitfalls

Using and as a shortcut for styling instead of and .

Nesting multiple formatting tags unnecessarily (e.g., Text).

Forgetting that formatting tags are inline—they won't create a new line automatically.

Using <del> and <ins> for visual effects rather than document revision history.

Interactive Lab

Sprint Tasks

Wrap 'WARNING' in a tag

Highlight the word 'Reference' using

Format the following math: E = mc2 (make the 2 a superscript)

Loading editor...

Production Preview