URL encoding — properly called percent-encoding — replaces characters that would otherwise confuse a URL with a % followed by their byte value in hexadecimal. It is what turns a space into %20 and lets a query parameter carry an ampersand without splitting the query in half.
Component or full URL?
The two scopes escape different sets of characters, and choosing the wrong one is the most common mistake with this conversion.
- Component — for a single value: one query parameter, one path segment, one fragment. It escapes the reserved characters too, so & = ? / # inside your value cannot break the URL around it.
- Full URL — for an entire address. It leaves : / ? # [ ] @ intact, because those characters are what give a URL its structure. Encoding them would destroy the address.
Why + sometimes means space
HTML form submissions use a variant called application/x-www-form-urlencoded, which encodes a space as + rather than %20. Standard URL decoding leaves that plus sign alone, so a decoded query string can come back full of them.
Enable "Treat + as a space" when you are decoding something that came from a form or a query string. Leave it off when the plus sign is meant literally — in an email address, for example, or a base64 value.
What gets encoded
Unreserved characters — A–Z, a–z, 0–9, and - _ . ~ — are never escaped, because they are safe everywhere in a URL.
Everything else is converted to its UTF-8 bytes first and then written as one %XX pair per byte. That is why an emoji becomes four pairs and an accented letter becomes two: percent-encoding works on bytes, not on characters.
FAQ
What is the difference between encodeURI and encodeURIComponent?
They are the two scopes offered here. encodeURI is for a whole URL and preserves the reserved characters that structure it. encodeURIComponent is for a single value and escapes those characters too. Use component encoding for anything you are inserting into a URL, and full-URL encoding for an address you are cleaning up.
Why does my decoded text show a URI malformed error?
The input contains a % that is not followed by two valid hexadecimal digits, or a percent sequence that does not form valid UTF-8. A common cause is text that was encoded twice, or a literal percent sign that was never escaped as %25.
Should I encode the whole URL or just the parameters?
Just the parameters, in almost every case. Encoding a whole URL with component encoding turns the slashes and colons into escapes and produces an address that no longer works.
Is my URL sent anywhere?
No. Encoding and decoding both use the browser’s built-in functions and run entirely on your device. Nothing is transmitted, logged or stored, so internal URLs and URLs containing tokens are safe to paste.