URL Encoder and Decoder
Convert special characters into safe format for URLs. Encode and decode text using percent-encoding (application/x-www-form-urlencoded).
URL Encoder/Decoder
Mode:
🔗 What is URL Encoding?
URL encoding (or percent-encoding) converts special characters into a format that can be transmitted over the internet. Special characters are replaced by "%" followed by two hexadecimal digits.
📖 Conversion examples:
• Space → %20 or +
• @ → %40
• # → %23
• & → %26
• = → %3D
• ? → %3F
• á → %C3%A1
• ç → %C3%A7
💡 When to use:
• Passing parameters in URLs
• Creating query strings
• Encoding file names in URLs
• HTML forms with GET
📝 Practical example:
Text: "Hello World!"
URL: "Hello%20World%21"
Link: https://site.com/search?q=Hello%20World%21
What is URL Encoding?
URL Encoding (also called Percent Encoding) is a mechanism for encoding special characters in URLs. Since URLs can only contain safe ASCII characters, special characters are converted to %XX format where XX is the hexadecimal code.
Why is it necessary?
URLs have reserved characters with special meanings (such as ? & = #). To use these characters literally or include non-ASCII characters (accents, emoji, etc.), it is necessary to encode them.
Common Encoded Characters
Use Cases
- Query strings: URL parameters with special values
- APIs: Send data in GET requests
- Forms: Data submission via URL
- Links: Share URLs with special characters
- SEO: Friendly URLs with accents
- Redirects: Pass URLs as parameters
Practical Example
Original Text:
São Paulo - Brasil
Encoded URL:
S%C3%A3o%20Paulo%20-%20Brasil
Usage in URL:
https://example.com/search?city=S%C3%A3o%20Paulo%20-%20Brasil
Reserved Characters
URLs have characters with special meanings that must be encoded when used literally:
- • : Protocol separator (http://)
- • / Path separator
- • ? Start of query string
- • & Parameter separator
- • = Key/value separator
- • # Fragment/anchor
- • @ Credentials in URLs
Difference: + vs %20
%20 (Percent Encoding)
Official standard. Works in any part of the URL. Safer and recommended.
+ (application/x-www-form-urlencoded)
Used in form query strings. More readable but less universal.
Common Pitfalls
⚠️ Double encoding:
Be careful not to encode already encoded URLs! "São Paulo" becomes "S%C3%A3o%20Paulo", which if re-encoded becomes "S%25C3%25A3o%2520Paulo" (incorrect).
JavaScript Functions
encodeURIComponent() - Encodes everything except: A-Z a-z 0-9 - _ . ! ~ * ' ( )
encodeURI() - Encodes fewer characters (preserves :/?#[]@)
decodeURIComponent() / decodeURI() - Decode
💡 SEO Tip: Friendly URLs with readable words (even when encoded) rank better than URLs with numeric IDs. Use descriptive slugs!