Tutor:HTML text formatting: use tags to give structure and meaning. Two categories: semantic (strong, em) add meaning; presentational (b, i, u) only change appearance. Prefer semantic when you want to convey importance or emphasis.

⭐ 0 EXP

Step 1: Instruction

HTML text formatting: use tags to give structure and meaning. Two categories: semantic (strong, em) add meaning; presentational (b, i, u) only change appearance. Prefer semantic when you want to convey importance or emphasis.

Step 2: Instruction

Examples: important, emphasis. Presentational: bold, italic, underline. Also <s> strikethrough, highlight. Screen readers and search engines use semantic tags.

This is important and emphasized.

Step 3: Instruction

Rule of thumb: if you want to convey importance or emphasis, use strong or em. If you only want visual style, prefer CSS (e.g. span with class). Use for highlighted reference content.

See key term.

Step 4: Instruction

In the browser, strong and b both look bold; em and i both look italic. The difference is meaning: strong/em are understood by assistive tech. Prefer semantic for accessibility.

Bold and italic.

Step 5: Knowledge Check

Which tag adds meaning (strong importance) and is preferred for accessibility?

Step 6: Instruction

Correct! conveys importance; only makes text bold. Use strong for accessibility. Same idea: vs for emphasis vs italic.

important

Step 7: Instruction

You now know text formatting. Use strong/em for meaning; prefer CSS for pure style. Complete the challenges below!

Text Formatting Mastery

Semantic vs presentational. strong, em, b, i, mark.

Concept 1: Text Formatting

HTML text formatting uses tags to give structure and meaning. Semantic tags (, ) add meaning. Presentational tags (, ) only change appearance.

System Check

Which tag conveys strong importance and is preferred for accessibility?

Community Holo-Net

Text Format Patterns

Using strong, em, mark? Share your patterns.

Enjoying this guide?

Codesyllabus is 100% free and open-source. Support our mission, pay for server infrastructure, and fuel new tutorials by buying us a coffee!

HTML Text Formatting

Pascual Vila

Frontend Instructor.

Text formatting in HTML uses tags to give structure and meaning to text. Two main categories: semantic (, ) add meaning and are preferred for accessibility; presentational (, , ) only change appearance. Use semantic tags when you want to convey importance or emphasis; use CSS (e.g. ) for pure style.

Common tags

 = strong importance.  = emphasis.  = bold.  = italic.  = underline. <s> = strikethrough.  = highlighted (e.g. search results).

Best practices

Prefer  over  and  over  when the content has real importance or emphasis. Screen readers and search engines use this. For visual-only styling, use CSS.

Text Formatting Glossary

strong / em: Semantic: strong = strong importance, em = emphasis. Convey meaning to screen readers and search engines. Prefer over b/i when content has importance.
b / i / u: Presentational: bold, italic, underline. No extra meaning. Use when style only; prefer CSS or semantic tags when appropriate.
mark / s: mark = highlighted for reference. s = strikethrough (no longer accurate). Use mark for search highlights; prefer CSS for generic styling.

📖 INDEX