HTML Entities

Why HTML entities exist

HTML uses a handful of characters as structure. The less-than and greater-than signs delimit tags, the ampersand opens an entity, and quotation marks bound attribute values. If you want any of those characters to appear as literal text rather than markup, you have to escape it, and an entity is how you do that. The named character references are defined by the WHATWG HTML Standard, so a browser resolves them the same way everywhere.

Entities also give you a portable way to write characters that are awkward to type or that might not survive a copy and paste, from a non breaking space to a mathematical symbol or an arrow. On a UTF-8 page you can often insert those characters directly, but the four markup sensitive characters still need escaping, and numeric entities remain the dependable fallback when a named form does not exist.

The four you must always escape

• The less-than sign, so text is not read as the start of a tag.
• The greater-than sign, for symmetry and to avoid edge cases.
• The ampersand, so it is not read as the start of another entity.
• The double quotation mark inside attribute values.

When you do not need an entity

This is the mistake that costs the most time: escaping everything. On a page served as UTF-8, and that is every page you write today, a euro sign, an arrow, an em dash, and an accented letter can all go in as themselves. They render identically, they are readable in the source, they survive a search across your codebase, and they take fewer bytes than the escape.

The four markup characters are the exception, and they are not negotiable. Beyond those, reach for an entity when the character is invisible and you need it to be obvious in the source, which is the real argument for writing a non breaking space as its named form, or when the output is not HTML at all. XML without a DTD knows only five names, so everything else must be numeric there.

Named or numeric

Named forms read better and are easier to remember. Numeric forms always work. The Since column in the table above tells you which named forms predate HTML5 and are therefore the safest to use outside a browser; the rest are HTML5 additions, and outside HTML5 the numeric form is the one to reach for.