URL encoding explained: what %20 means and when to encode

Web addresses can only contain a limited set of characters. Anything else — a space, an accented letter, an ampersand inside a value — has to be written in a special form: a percent sign followed by two hexadecimal digits. That is URL encoding, also called percent-encoding.

Some common encodings

Non-English characters are first turned into their UTF-8 bytes, and each byte is encoded, so one character can become several escapes, as é does.

Characters that never need encoding

The URL standard defines a small set of “unreserved” characters that are always safe: the letters A to Z and a to z, the digits 0 to 9, and four symbols — hyphen, full stop, underscore and tilde. Anything else either has a special job in addresses or is not allowed, and is encoded when it appears as data. That is why readable web addresses tend to use only lower-case letters, digits and hyphens.

Why some characters must be encoded

Characters such as ?, &, = and # give an address its structure: ? starts the query string, & separates parameters, = joins a name to its value and # starts a fragment. If one of them appears inside a value — a search for “salt & pepper”, say — it must be encoded, or the server reads it as structure and the value is cut short.

Whole URL or single value?

This is where most encoding bugs come from. There are two different jobs:

• Encoding a whole address must leave its structure alone — the ://, the slashes, the ? and the & — and encode only what is not allowed, such as spaces.
• Encoding a single value that goes into an address must encode those same structural characters, so they are treated as data.

The URL Encoder has a mode for each. Encoding https://example.com/a b as a whole URL gives https://example.com/a%20b. Encoding it as a single value gives https%3A%2F%2Fexample.com%2Fa%20b — exactly right when that address is itself a parameter, such as a redirect target.

%20 or +?

In the query part of an address, many servers also accept + for a space, a convention from web forms. In the path, + means a literal plus sign. %20 is correct everywhere, so use it when in doubt.

Decoding

The URL Decoder turns an encoded address back into readable text and splits the query string into a table of parameters — far easier to read than a long tracking link on one line. If the result still contains percent signs, the address was encoded twice; look for %25, which is an encoded percent sign, and decode again. Both tools run in your browser.

Double encoding

Encoding a value that is already encoded turns %20 into %2520, and the receiving server sees the literal text “%20” instead of a space. Encode each value exactly once, at the point where it is added to the address.

Campaign links

When building tagged links for analytics, the UTM Link Builder encodes values for you and keeps the address's existing parameters and anchor intact.