URL Encoding: A Practical Guide

Why Do URLs Require Encoding?

Uniform Resource Identifiers (URIs) are governed by the RFC 3986 specification, which limits permitted URL characters to a narrow subset of the US-ASCII character set. Furthermore, within that subset, specific characters serve structural duties as delimiters (such as / separating path components, ? denoting the query string start, and & separating key-value pairs).

If user data or text contains these delimiter characters literally, it would corrupt the syntax of the URL. URL encoding (often termed percent-encoding) solves this by translating reserved or unprintable characters into safe, unambiguous hexadecimal triplets.

Character Classifications in RFC 3986

1. Unreserved Characters

These characters never require escaping and should always be represented literally:

• Uppercase and lowercase letters: A-Z, a-z
• Decimal digits: 0-9
• Four special symbols: - (hyphen), _ (underscore), . (period), and ~ (tilde)

2. Reserved Characters

These characters have structural meaning in URIs and must be percent-encoded if they are used as raw data inside a query parameter:

• :, /, ?, #, [, ], @ (General delimiters)
• !, $, &, ', (, ), *, +, ,, ;, = (Sub-delimiters)

How Percent-Encoding Operates

When an unsafe character is encoded, its binary byte value in UTF-8 is converted to a two-digit uppercase hexadecimal number preceded by a percent sign (%):

• A space (ASCII 32) becomes %20.
• An ampersand & (ASCII 38) becomes %26.
• An equals sign = (ASCII 61) becomes %3D.
• A question mark ? (ASCII 63) becomes %3F.

The Danger of Double-Encoding

Double encoding occurs when an already encoded string is mistakenly passed through an encoder a second time. Because the percent symbol (%) is itself encoded as %25, the sequence %20 transforms into %2520. When decoded once by the server, the application receives %20 instead of the intended space character, leading to subtle database bugs, broken search queries, and 404 errors.

Frequently Asked Questions About URL Encoding

What is the difference between encodeURI and encodeURIComponent?

encodeURI assumes you are passing an entire, complete URL. It preserves structural delimiters like http://, /, ?, &, and # so the browser can navigate the path correctly. In contrast, encodeURIComponent assumes you are encoding a single query parameter value, and escapes all structural delimiters so they do not inadvertently break query string parsing.

Why do spaces sometimes encode as '+' and sometimes as '%20'?

In standard RFC 3986 URL paths and query strings, spaces are encoded as %20. However, when HTML forms submit data using the legacy application/x-www-form-urlencoded MIME format, spaces are historically encoded as +. Modern REST APIs and single-page applications generally prefer %20 everywhere to maintain strict RFC compliance.

Are Unicode characters allowed in URLs?

URIs are strictly defined in ASCII. When non-ASCII characters (such as accents, Cyrillic, Chinese, or emojis) appear in URLs, they must first be converted into UTF-8 byte sequences, and then each byte must be individually percent-encoded (for example, the emoji 🚀 encodes as %F0%9F%9A%80).