You have probably seen URLs that look strange — full of percent signs, numbers, and letters that seem random. For example, https://example.com/search?q=hello%20world&lang=en. That %20 is not a mistake. It is URL encoding at work, and understanding it prevents countless bugs in web development.
What Is URL Encoding?
URL encoding (also called percent-encoding) is a mechanism for translating characters that are not safe or reserved in a URL into a format that can be reliably transmitted over the internet. Each encoded character is replaced by a percent sign followed by two hexadecimal digits representing its ASCII or UTF-8 byte value.
The most common encoded characters include:
- Space becomes
%20(or+in query strings) - ! becomes
%21 - # becomes
%23(because#starts a fragment identifier) - & becomes
%26(because&separates query parameters) - = becomes
%3D(because=separates keys from values) - / becomes
%2F(because/separates path segments) - ? becomes
%3F(because?starts the query string)
Reserved vs. Unreserved Characters
The URL specification (RFC 3986) divides characters into two categories:
Reserved Characters
These have special meaning in URL structure: : / ? # [ ] @ ! $ & ' ( ) * + , ; = %. You must encode them when they appear as literal data. For example, a search query containing & must encode it as %26, otherwise the URL parser will treat it as a parameter separator.
Unreserved Characters
These are safe to use without encoding: A-Z a-z 0-9 - _ . ~. They have no special meaning in URLs and can appear freely in any part of the URL.
Common URL Encoding Mistakes
Developers run into these problems regularly:
Double-encoding. If you encode a URL that is already encoded, %20 becomes %2520. This is the most common URL encoding bug — it usually happens when encoding is applied twice in a middleware chain or API gateway.
Not encoding query parameter values. If a user searches for "hello&world" and you build the URL as ?q=hello&world, the & will be interpreted as a parameter separator, creating a phantom world parameter.
Encoding the wrong characters. Encoding everything (including / in paths) breaks the URL structure. Only encode characters that are not safe in the specific position they occupy.
When to Use URL Encoding
- Query parameters: Always encode user input before inserting it into a URL query string. Use your language's built-in function: JavaScript's
encodeURIComponent(), Python'surllib.parse.quote(), PHP'surlencode(). - Form data: HTML forms use
application/x-www-form-urlencodedencoding, which converts spaces to+signs and encodes special characters. - API calls: REST and GraphQL APIs expect properly encoded URLs. Missing encoding can cause 400 errors or silently wrong results.
- Redirects: When building redirect URLs with user-controlled data, always encode to prevent open redirect vulnerabilities.
Test Your URLs
If you are unsure whether a URL is properly encoded, paste it into the ToolShack URL Encoder to encode it, or use the URL Parser to break it into its component parts and verify each segment. Proper URL encoding prevents bugs, security issues, and frustrating debugging sessions.