𝗧𝗵𝗲 𝗜𝗻𝗹𝗶𝗻𝗲 𝗛𝗧𝗠𝗟 𝗔𝗹𝗺𝗼𝘀𝘁 𝗡𝗼𝗯𝗼𝗱𝘆 𝗨𝘀𝗲𝘀

Most developers know , , and .

You likely ignore others like , , , , , and . This happens because you reach for a instead.

Using these elements adds meaning. A styled span says nothing to a machine. These elements provide data for screen readers and search engines.

Here are the useful elements you should know:

and : These track changes. Use for deleted text and for new text. They work together to show edits. • : Use this for content that is no longer accurate. It is different from a deletion. It marks stale info like an old price. • and : Use these for chemical formulas or math exponents. Do not use them just to make text small. • : Use this for variables in math or code. • : This highlights text for relevance. Search engines use this to show query matches. • : This provides the full version of an abbreviation via a tooltip. • : Use this to mark the specific instance where you define a term. • : Use this for the title of a work like a book or a paper. It is not for a person's name. • : This handles inline quotes. The browser adds the quotation marks for you.

The browser defaults often look ugly. looks like yellow highlighter. has random marks.

You do not need to avoid these tags. You only need to add CSS.

Give a brand color. Give a dotted underline. This turns semantic code into clean typography.

Using the right tag once a year is better than using a span that lies about what the content actually is.

Source: https://dev.to/dimonb19a/the-inline-html-almost-nobody-uses-205d