HTML Text Formatting

Historically, developers used the <b> (bold) and <i> (italic) tags to format text. However, these tags are purely visual—they tell the browser how to render the text, but they convey zero meaning to assistive technologies or search engines.

Modern web architecture demands semantic rigor. Instead of <b>, you must use the <strong> tag to indicate that a piece of text has critical, urgent importance. Instead of <i>, use the <em> tag to indicate stress emphasis. Screen readers actively change their vocal intonation when they encounter these tags. Using semantic formatting is the difference between a page that merely looks right and a page that actually works for all users.

When documenting software or referencing specific data, you need specialized modifiers. The <code> tag is explicitly designed to distinguish actionable computer code from conversational prose. The browser will natively render this using a monospace typeface.

Additionally, the <mark> tag is used to highlight text for contextual relevance—imagine using a yellow highlighter in a textbook. This is aggressively used in search interfaces to instantly draw the user's eye to their query term within a large block of text. These tags provide immediate clarity without forcing you to write complex CSS.

When data changes, you shouldn't just delete the old text. By using the <del> (deleted) and <ins> (inserted) tags, you programmatically document the revision history of the page. Browsers natively strike through the deleted text and underline the inserted text, providing instant transparency for price drops or corrected information.

Similarly, when importing external data, the <blockquote> element is mandatory for extended quotations. It explicitly links the borrowed text to a source and structurally distances it from your own prose.