URL encoding, also known as percent encoding, is a mechanism for encoding information in a Uniform Resource Identifier (URI). It is essential for ensuring URLs are transmitted correctly across the internet.

Why URLs Need Encoding

URLs can only contain a limited set of ASCII characters. Characters outside this set, or characters with special meanings in URLs, must be encoded. For example:

• Spaces become %20 or +
• & becomes %26
• = becomes %3D
• Non-ASCII characters like cafe become caf%C3%A9

Reserved Characters

These characters have special meaning in URLs and must be encoded when used as data:

: / ? # [ ] @ ! $ & ' ( ) * + , ; =

Encoding vs Component Encoding

JavaScript provides two functions with different behaviors:

encodeURI()

Encodes a complete URI, preserving special characters that are part of the URI structure:

encodeURI("https://example.com/path?q=hello world")

// "https://example.com/path?q=hello%20world"

encodeURIComponent()

Encodes a URI component, encoding ALL special characters:

encodeURIComponent("hello world&foo=bar")

// "hello%20world%26foo%3Dbar"

Rule of thumb: Use encodeURIComponent() for encoding parameter values, and encodeURI() for encoding a full URL.

Common Pitfalls

1. Double Encoding

Encoding an already-encoded string produces incorrect results:

Original:  "hello world"

Encoded:   "hello%20world"
Double:    "hello%2520world"  // Wrong!

2. Space Encoding

• %20 is used in path segments
• + is used in query strings (form data)
• Both represent a space but in different contexts

3. Unicode Characters

Modern browsers display Unicode in the address bar, but the actual URL is encoded:

Display: https://example.com/日本語

Actual:  https://example.com/%E6%97%A5%E6%9C%AC%E8%AA%9E

4. File Paths vs URLs

File paths use backslashes on Windows; URLs always use forward slashes. Always convert when building URLs from file paths.

URL Encoding in Different Languages

Python
from urllib.parse import quote, unquote
quote("hello world")    # "hello%20world"
unquote("hello%20world")  # "hello world"

// Java

URLEncoder.encode("hello world", "UTF-8")  // "hello+world"
URLDecoder.decode("hello+world", "UTF-8")  // "hello world"

Best Practices

1. Always encode user input before including it in URLs

2. Use encodeURIComponent() for query parameter values

3. Be aware of the space encoding difference (%20 vs +)

4. Test with non-ASCII characters (CJK, emoji, accented characters)

5. Never construct URLs by string concatenation without encoding

Use our URL Encoder/Decoder tool to encode and decode URLs instantly.