HTML Entity Encoder: Escape Web Characters

HTML entity encoding replaces special characters with HTML-safe text. It is useful when you want a browser to display characters literally instead of interpreting them as markup.

Use the HTML Entity Encoder / Decoder when preparing examples, escaping snippets, cleaning copied HTML, or inspecting encoded text.

Why HTML Entities Matter

In HTML, some characters have special meaning:

< starts a tag
> ends a tag
& starts an entity
" can close an attribute value
' can close some attribute values

If you want to display this text:

<strong>Hello</strong>

as visible code instead of bold text, you can encode it:

<strong>Hello</strong>

The browser displays the tag rather than interpreting it.

Common HTML Entities

Common examples:

<  -> &lt;
>  -> &gt;
&  -> &amp;
"  -> &quot;
'  -> &#39;

Named entities are readable, while numeric entities can represent many characters.

Entity Encoding Reference

You do not always need to encode every possible character. Encode based on the output context and the parser that will read the content.

Body Text vs Attribute Values

Escaping rules depend on where the text will appear. In normal HTML body text, <, >, and & are the most important characters to encode. In attributes, quotes matter too:

<a title='Tom "checked" the markup'>Example</a>

If user-provided text is inserted into an attribute, unescaped quotes can break the attribute and change how the browser reads the rest of the tag.

This is why context matters. HTML body text, HTML attributes, URLs, JavaScript strings, and JSON values each need the right escaping method.

Examples by Context

HTML body text:

<p>&lt;button&gt;Save&lt;/button&gt;</p>

HTML attribute:

<input value="Tom &amp; Jerry" />

HTML showing a URL:

<p>https://example.com/?a=1&amp;b=2</p>

Actual URL parameter value:

https://example.com/?q=Tom%20%26%20Jerry

The visible HTML uses entities. The URL value uses percent encoding. Mixing these up is a common cause of broken links and confusing output.

Encoding Text vs Sanitizing HTML

HTML entity encoding is not the same as full HTML sanitization.

Encoding turns special characters into safe text. Sanitization decides which tags, attributes, and URLs are allowed in user-provided HTML.

If you accept user input in a real application, use a trusted sanitizer and proper output escaping for the context. A browser-based encoder is useful for inspection, examples, and manual cleanup, but it is not a full security framework.

Encoding Is Output Protection

Entity encoding is usually applied when content is placed into HTML output. It is not a replacement for input validation, permissions, moderation, or sanitization.

For example, a comment system may need:

• input length limits
• spam filtering
• moderation rules
• storage of the original text
• HTML escaping when rendering the text

The database can store the raw text safely as data. The page template should escape it when displaying it in HTML.

HTML Entities vs URL Encoding

HTML entity encoding is for HTML text and attributes. URL encoding is for URL parts.

For example:

HTML entity: &
URL encoded: %26

Both can represent an ampersand, but they are used in different contexts.

Use the URL Encoder & Decoder for query parameters and URL-safe values. Use the String Escape / Unescape when preparing text for JSON, JavaScript, HTML, or CSV contexts.

Decoding Entities for Debugging

Decoding is useful when copied text contains entities and you need to inspect the original characters:

Tom & Jerry

decodes to:

Tom & Jerry

This is helpful when reviewing CMS output, email templates, documentation examples, or API responses that contain encoded HTML.

Double Encoding and Broken Display

Double encoding happens when already encoded content is encoded again:

< becomes <

The browser may then display < instead of <. This often happens when content passes through multiple systems, such as a CMS, template engine, email tool, and frontend component.

When debugging, decode one layer at a time and identify which system encoded the value. Do not simply replace all & values globally; some ampersands may be correct.

A Practical Workflow

1. Identify where the text will be used: HTML body, attribute, URL, JSON, or JavaScript.
2. Encode HTML-sensitive characters when displaying text as literal content.
3. Decode entities when you need to inspect copied markup.
4. Use the HTML Formatter when reviewing larger HTML snippets.
5. Avoid pasting secrets or private production data into any web tool.

Common Mistakes

Do not use HTML entities for normal URL query parameters. Use URL encoding instead.

Do not assume entity encoding validates HTML structure. It only changes character representation.

Do not double-encode content. & can become &, which is usually not what you want.

Publishing Checklist

Before publishing HTML examples or user-visible snippets, check:

• code examples display as text, not active markup
• links still work after entity encoding
• attribute values do not contain unescaped quotes
• copied CMS content is not double-encoded
• URL values use URL encoding where needed
• larger snippets are reviewed with an HTML formatter

This small check is especially useful for documentation pages, email templates, and blog posts that show real markup examples.

Final Tip

HTML entity encoding is most useful when you need text to appear exactly as text. Always match the escaping method to the context where the value will be used.

Related Guides

• String Escaping for JSON, JS, HTML, and CSV for choosing the right escaping context.
• Base64 vs URL Encoding for understanding when URL encoding is the better fit.
• Security & Encoding Tools for related escaping, encoding, hashing, JWT, and password tools.