URL encoding (also called percent encoding) converts special characters into a format that can be safely transmitted in a URL. A space becomes %20, an ampersand becomes %26, and a hash becomes %23.
Why is URL encoding needed?
URLs can only safely contain a limited set of characters: letters (A–Z, a–z), digits (0–9), and the characters -, _, ., ~. Everything else — spaces, special characters, non-ASCII letters, emoji — must be percent-encoded or the URL breaks.
Common URL encoded characters
| Character | Encoded | Usage |
|---|---|---|
| Space | %20 or + |
Query strings |
& |
%26 |
When used in values |
= |
%3D |
When used in values |
+ |
%2B |
When literal + needed |
/ |
%2F |
Path separators in values |
? |
%3F |
When used in values |
# |
%23 |
Fragment identifiers |
@ |
%40 |
Email addresses in URLs |
encodeURI vs encodeURIComponent
These two JavaScript functions behave differently:
encodeURI(url)— encodes a complete URL. Preserves:,/,?,&,=,#because they are meaningful in a URL.encodeURIComponent(value)— encodes a URL component (like a query parameter value). Encodes everything including/and?.
Rule of thumb: Use encodeURIComponent for individual query parameter values. Use encodeURI for complete URLs.
Real-world examples
Encoding a search query with special characters:
Original: https://example.com/search?q=hello world & more
Encoded: https://example.com/search?q=hello%20world%20%26%20more
Encoding a URL parameter that contains another URL:
Original: ?redirect=https://example.com/path?foo=bar
Encoded: ?redirect=https%3A%2F%2Fexample.com%2Fpath%3Ffoo%3Dbar
Space: %20 or +?
Both appear in real URLs, and the difference trips people up constantly.
%20is valid everywhere in a URL — path, query string, fragment.+means a space only inside a query string, and only because of the olderapplication/x-www-form-urlencodedform format. In a path segment,+is a literal plus sign.
So /search?q=a+b means "a b", but /files/a+b.txt is a file literally named a+b.txt. When in doubt, use %20 — it is unambiguous in every position.
Double encoding: the most common bug
Double encoding happens when already-encoded text is encoded again. The % character is itself special, so %20 becomes %2520:
Original: hello world
Encoded once: hello%20world -> decodes to "hello world"
Encoded twice: hello%2520world -> decodes to "hello%20world"
That second value looks fine in logs but produces a broken link. It usually happens when a URL is encoded by application code and then encoded again by a framework, proxy, or redirect handler.
How to spot it: look for %25 in a URL. That is an encoded %, and it almost always means something got encoded one time too many. Decoding once and inspecting the result will confirm it.
Common mistakes
| Mistake | What breaks | Fix |
|---|---|---|
encodeURI on a query value |
& and = stay raw and split the parameter |
Use encodeURIComponent |
| Encoding the whole URL twice | % becomes %25, link 404s |
Encode once, at one layer only |
| Hand-encoding with find/replace | Misses non-ASCII and emoji | Use a real encoder |
Encoding https:// inside a redirect param |
Unencoded // and ? break parsing |
Encode the parameter value, not the outer URL |
Frequently asked questions
Is URL encoding the same as Base64?
No. URL encoding makes unsafe characters transmittable while keeping text mostly readable. Base64 converts binary data into an ASCII string and looks nothing like the original. They solve different problems and are sometimes combined — Base64 output contains +, /, and =, which then need URL encoding.
Does URL encoding encrypt anything?
No. It is a reversible formatting step with no key and no secret. Anyone can decode it instantly. Never use it to hide sensitive values.
Why do non-English characters become long strings?
They are encoded as UTF-8 bytes first, then each byte is percent-encoded. The character é is two bytes in UTF-8, so it becomes %C3%A9. Characters outside the Basic Multilingual Plane, like most emoji, take four bytes and produce eight characters.
Should I encode the entire URL or just parts?
Just the parts. Encoding a whole URL destroys the structural characters that make it a URL — ://, ?, &, and / all have meaning. Encode individual query parameter values and path segments separately.
Is percent encoding case sensitive?
The hex digits are not: %2F and %2f decode identically. Uppercase is the convention recommended by RFC 3986, and some systems compare URLs as strings, so uppercase is the safer habit.
How to URL encode or decode online
- Go to URL Encoder
- Paste your text or URL into the input
- Click Encode or Decode
- Copy the result
Everything runs in your browser — the text never leaves your machine, which matters when the URL contains an API key or session token.