Online Tool Store
· 4 min read
How to Encode and Decode HTML Entities
Manesh Jayawardhana
CIO & Co-founder
You want a tutorial page to display <section> as text, but the browser treats it as markup. Or a copied product description contains & and " everywhere instead of ordinary punctuation. Both problems involve HTML entities: representations that let reserved characters and symbols survive inside HTML source without being interpreted in the wrong role.
Encoding and decoding are simple operations, yet context matters. Escaping visible text is different from sanitizing untrusted HTML, and attribute values introduce rules beyond the page’s text content. Use an entity tool to transform known text—not as a substitute for the security controls in your application framework.
What HTML entities do
HTML gives a few characters structural meaning. The less-than sign begins something that could be a tag, the ampersand begins a character reference, and quotation marks can delimit attributes. Entity references represent those characters safely in source text.
Common named forms include < for <, > for >, & for &, and " for a double quote. Numeric references such as < can represent characters by code point. When the browser parses the HTML, it displays the intended character.
Not every Unicode character needs an entity in modern UTF-8 HTML. Ordinary letters, accents, and many symbols can be stored directly when the document encoding is correct. Encode because the character conflicts with HTML syntax or a specific workflow—not merely because it is non-ASCII.
Why entity text becomes confusing
Double encoding is the classic failure. If & is encoded again, the ampersand becomes &amp;, and the page displays the entity text instead of &. Repeatedly passing content through uncertain layers can build even longer sequences.
| Character | Entity | Typical Reason | Common Error |
|---|---|---|---|
< | < | Show a tag literally | Starts markup |
> | > | Complete literal tag | Inconsistent pair |
& | & | Prevent reference start | Double encoding |
" | " | Quoted attribute context | Wrong quote boundary |
' | Context-dependent | Single-quoted attribute | Mixed delimiters |
Decoding can be risky when the result will be inserted as live HTML. Text that looked harmless while encoded may become a real tag or attribute after decoding. Keep display text in a text context and use trusted framework escaping.
What good entity handling looks like
The direction is clear
Encode when literal characters must appear safely in HTML source. Decode when entity text needs to become readable characters for inspection or plain-text use. Do not apply both repeatedly without knowing the current state.
The output matches its context
Text nodes, HTML attributes, URLs, JavaScript strings, and CSS each have different escaping needs. HTML entity encoding alone does not prepare a value safely for every one of those contexts.
UTF-8 remains the default
Use a correct document charset and keep ordinary international text readable in source. Entities are helpful for reserved syntax, not a requirement for every accented letter or emoji.
For another practical markup workflow, see the guide to turning CSV data into an HTML table. Other development utilities are available in the online tools directory.
Common mistakes to avoid
- Encoding content twice.
&can become visible&amp;-style output. - Decoding directly into live HTML. Untrusted markup may become executable or alter the page.
- Using HTML escaping for JavaScript or URLs. Each context has its own encoding rules.
- Encoding every Unicode character. Correct UTF-8 usually makes that unnecessary.
- Forgetting the ampersand. Literal ampersands can accidentally begin malformed references.
How to do it with HTML Entity Encoder
- Decide whether the source contains literal characters to encode or entity references to decode.
- Open the HTML Entity Encoder.
- Paste the known text into the input area.
- Choose encode or decode and inspect the live browser-only preview.
- Check ampersands, angle brackets, both quote styles, and any non-ASCII symbols.
- Copy or download the result using the available controls.
- Place it only into the intended context and verify the rendered page or plain-text destination.
The transformation happens locally and requires no account. Application security should still rely on contextual escaping and sanitization provided by trusted libraries or frameworks.
Frequently asked questions
Is HTML entity encoding the same as sanitizing HTML?
No. Encoding represents characters so they display as text. Sanitization evaluates markup and removes or permits elements and attributes according to a security policy.
Why does my page show & instead of an ampersand?
The text may have been double encoded or inserted into a context that does not parse HTML entities. Trace which layer encoded the content and avoid repeating the operation.
Do I need entities for emoji and accented letters?
Usually not in a correctly declared UTF-8 document. Store them directly unless a particular system or interchange format requires a reference.
Final thought
Entity handling works when you know both the current form and the destination context. Encode literal HTML-sensitive characters once, decode only for a safe text destination, and let context-aware application libraries handle untrusted input.