Utility Coder
Back to Blog
encoding

URL Encode

Andy Pham
url encode, url encode, url encode online

Ready to try URL Encode?

Access the free online tool now - no registration required

Open Tool

URL Encode - Complete Guide

URL encoding (percent encoding) converts special characters into a format safe for URLs. Characters like spaces, &, =, and non-ASCII characters are replaced with % followed by their hexadecimal byte values. This is essential for query parameters, form submissions, and any data passed via URLs.

How It Works

The encoder identifies characters that aren't URL-safe (letters, digits, -_.~) and converts each byte to %XX format where XX is the hexadecimal value. Spaces can become %20 or + depending on context. UTF-8 strings may produce multiple %XX sequences per character (e.g., € becomes %E2%82%AC).

Technical Details

RFC 3986 defines unreserved characters (A-Z, a-z, 0-9, -_.~) that don't need encoding. Reserved characters (:/?#[]@!$&'()*+,;=) have special URL meanings and must be encoded when used as data. The application/x-www-form-urlencoded format (HTML forms) additionally encodes spaces as + and handles special cases for form data.

Common Use Cases

  1. Query String Parameters: Encode values in URL query strings to handle special characters.
    • Example: ?search=hello world becomes ?search=hello%20world
  2. Form Data Submission: Browser forms encode data before sending as POST body or GET query.
  3. API Requests: Encode user input before including in API URLs.
  4. File Names in URLs: Safely include file names with spaces or special characters in download links.
  5. OAuth & Authentication: Properly encode redirect URIs and callback URLs.

Code Examples

JavaScript

// Encode query parameter value
const encoded = encodeURIComponent('hello world & goodbye');
// Result: "hello%20world%20%26%20goodbye"

// Build URL with parameters
const params = new URLSearchParams({
  name: 'John Doe',
  city: 'New York'
});
const url = 'https://api.example.com/search?' + params.toString();
// Automatically encodes: ?name=John+Doe&city=New+York

// Don't double encode!
const alreadyEncoded = 'hello%20world';
// WRONG: encodeURIComponent(alreadyEncoded) = "hello%2520world"

Use URLSearchParams for building query strings - it handles encoding automatically.

Python

from urllib.parse import urlencode, quote, quote_plus

# Encode single value
encoded = quote('hello world')  # hello%20world
encoded = quote_plus('hello world')  # hello+world (form style)

# Build query string
params = urlencode({'name': 'John Doe', 'city': 'São Paulo'})
# name=John+Doe&city=S%C3%A3o+Paulo

# Encode path component
path = quote('my file.pdf', safe='')
# my%20file.pdf

quote() uses %20 for spaces, quote_plus() uses + (form encoding). urlencode() handles entire dictionaries.

Tips & Best Practices

  • Use URLSearchParams/urlencode for query strings instead of manual encoding
  • Always encode user input before putting it in URLs
  • Be aware of double-encoding when working with already-encoded strings
  • Test with Unicode characters like emoji and international text
  • Remember that + and %20 both represent space in query strings

Common Mistakes to Avoid

  • Double encoding (encoding already-encoded strings)
  • Using encodeURI for parameter values (use encodeURIComponent)
  • Not encoding user input, allowing URL injection
  • Forgetting that encodeURIComponent doesn't encode -_.~!*()'

When to Use This Tool

Use URL encoding whenever inserting variable data into URLs: query parameters, path segments, form submissions. Essential for preventing URL injection and handling special characters in web applications.

Frequently Asked Questions

What's the difference between encodeURI and encodeURIComponent?

encodeURI encodes a complete URL, preserving :/?#[]@!$&'()*+,;= which have URL meanings. encodeURIComponent encodes everything except letters/digits/-_.~, making it suitable for query parameter values. Use encodeURIComponent for user input in parameters.

Should spaces be + or %20?

In query strings (application/x-www-form-urlencoded), spaces can be + or %20. In URL paths, use %20. encodeURIComponent always produces %20; form data typically uses +. Both decode to space correctly.

Why do some characters encode to multiple %XX?

URL encoding works on bytes, not characters. UTF-8 encodes non-ASCII characters as multiple bytes. The Euro sign (€) is 3 UTF-8 bytes (E2 82 AC), so it becomes %E2%82%AC. This is correct behavior.

Do I need to encode the entire URL?

No! Only encode the parts that contain user data or special characters. Never double-encode an already-encoded URL. Parse the URL, encode just the parameter values, then reconstruct.

How do I encode a URL that's already partially encoded?

Be careful of double encoding (%20 becoming %2520). Decode first if unsure: decodeURIComponent(str).then(encodeURIComponent). Or parse with URL constructor to let the browser handle it.

Get Started

Ready to try URL Encode? Use the tool now - it's free, fast, and works right in your browser.


Last updated: June 27, 2026

Start using URL Encode

Free, fast, and privacy-focused - try it now

Launch Tool