URL Encoding Explained: Why %20 Appears in Your Links

You have seen it: you copy a link with a space in it and suddenly there is a %20 where the space used to be. Or an accented character turns into a string of % symbols. This is URL encoding — also called percent-encoding — and understanding it will save you from a whole category of broken links and mysterious API errors.

Why URLs need encoding at all

URLs were designed to contain only a limited, safe set of characters: letters, digits, and a handful of punctuation marks. Many other characters are either unsafe (they can be mangled by old systems) or reserved — they have a special structural meaning in a URL. Consider the characters that build a URL's structure:

• ? starts the query string
• & separates query parameters
• = joins a parameter to its value
• / separates path segments
• # starts the fragment

If your data contains one of these — say a search term with a literal & — it must be encoded, or the browser will misread where your value ends and the URL's structure begins.

How percent-encoding works

The rule is mechanical: take the character's byte value and write it as a percent sign followed by two hex digits. A space is byte 32, which is 0x20 in hex, so it becomes %20:

Hello World      →  Hello%20World
café             →  caf%C3%A9       (é is two UTF-8 bytes)
a&b              →  a%26b
100%             →  100%25          (the % sign itself)

Non-ASCII characters like é are first turned into their UTF-8 bytes, then each byte is percent-encoded — which is why one accented letter can become several percent codes.

The space-versus-plus confusion

Here is a classic source of bugs: sometimes a space becomes %20, and sometimes it becomes +. Both are valid, but in different contexts:

• In the path of a URL, a space is always %20.
• In a query string, the older HTML form-encoding standard turns spaces into +. So ?q=hello+world and ?q=hello%20world usually mean the same thing.

Modern code generally prefers %20 everywhere because it is unambiguous, but decoders accept both. If a literal plus sign in your data is being read as a space, this is why — encode it as %2B.

When you need to encode

Encode any value you insert into a URL that might contain special or non-ASCII characters:

• Search queries and any user-typed input
• Redirect URLs passed as a parameter (these contain their own ? and &)
• UTM and tracking parameters
• File names or titles with spaces, accents, or punctuation

The double-encoding trap

One of the most confusing bugs is double-encoding. If text that is already encoded gets encoded again, the percent sign itself becomes %25, so a space turns into %2520 (the encoding of %20). If you ever see %25 sequences multiplying through your URLs, something in your pipeline is encoding twice. The fix is to find the duplicate encoding step — or, to recover the original, decode the string twice.

Whether you are building a query string by hand, debugging a webhook, or untangling a deeply nested redirect, the encoder/decoder below converts text to safe URL form and back instantly — entirely in your browser.