URL Encoder Decoder

Instantly encode and decode URLs with our free online converter! Whether you’re working with query parameters, handling special characters, or processing international text in URLs, our tool provides accurate URL encoding and decoding following RFC 3986 standards.

What is URL Encoding?

Definition and Purpose

URL encoding (also called percent encoding) is a mechanism to encode information in URLs by replacing unsafe or reserved characters with percent-encoded equivalents (%XX format).

Key Features:

• Uses percent (%) followed by two hexadecimal digits
• Ensures URLs are transmitted correctly across all systems
• Handles special characters, spaces, and non-ASCII text
• Required for query parameters and form data

Why URL Encoding is Necessary

Character Limitations: URLs can only contain ASCII characters safely Reserved Characters: Characters like &, =, ?, # have special meanings in URLs Special Characters: Spaces, quotes, and symbols need encoding International Text: Non-English characters require encoding for compatibility

URL Encoding Rules

Safe Characters (No Encoding Needed)

Unreserved Characters:

• Letters: A-Z, a-z
• Numbers: 0-9
• Symbols: - . _ ~

These characters can appear in URLs without encoding.

Characters That Must Be Encoded

Reserved Characters:

• Space → %20 (or + in query strings)
• ! → %21
• " → %22

• → %23

• $ → %24
• % → %25
• & → %26
• ’ → %27
• ( → %28
• ) → %29
• • → %2B
• , → %2C
• / → %2F
• : → %3A
• ; → %3B
• = → %3D
• ? → %3F
• @ → %40
• [ → %5B
• ] → %5D

Common Use Cases

Web Development

Query Parameters: Encode values in URL parameters

https://example.com/search?q=hello%20world&category=tech%26gadgets

Form Data: Handle form submissions with special characters AJAX Requests: Encode data for GET and POST requests Dynamic URLs: Build URLs programmatically with user input

API Development

REST APIs: Encode path parameters and query strings Search Functionality: Handle search terms with spaces and symbols Data Filtering: Encode filter parameters with special characters Authentication: Encode credentials and tokens in URLs

Content Management

SEO-Friendly URLs: Create clean URLs from titles with spaces File Uploads: Handle filenames with special characters Internationalization: Support non-English URLs and parameters Social Media: Encode URLs for sharing on platforms

Email and Marketing

Email Links: Encode tracking parameters and UTM codes Campaign URLs: Handle campaign names with spaces and symbols Affiliate Links: Encode complex affiliate parameters Analytics: Track encoded parameters in web analytics

URL Components and Encoding

Different Parts Need Different Encoding

Protocol: http:// or https:// (never encoded) Domain: example.com (special rules apply) Path: /path/to/resource (encode special chars) Query: ?key=value&key2=value2 (encode values) Fragment: #section (encode if needed)

Query String Encoding

Key-Value Pairs: Both keys and values may need encoding Multiple Values: Handle arrays and complex data structures Special Characters: & and = have special meaning in queries Spaces: Can be encoded as %20 or + in query strings

Example:

Original: user name=John Doe&tags=web development,javascript
Encoded:  user%20name=John%20Doe&tags=web%20development%2Cjavascript

International Character Support

Unicode and UTF-8

UTF-8 Encoding: Convert Unicode to UTF-8 bytes first Multi-byte Characters: Each byte becomes %XX International Domains: Use Punycode for domain names Right-to-Left Text: Support Arabic, Hebrew, and other scripts

Examples

Spanish: “niño” → “ni%C3%B1o” Japanese: “こんにちは” → “%E3%81%93%E3%82%93%E3%81%AB%E3%81%A1%E3%81%AF” Arabic: “مرحبا” → “%D9%85%D8%B1%D8%AD%D8%A8%D8%A7” Emoji: “😀” → “%F0%9F%98%80”

JavaScript Implementation

Built-in Functions

encodeURIComponent(): Encode everything except unreserved characters

encodeURIComponent("hello world!"); // "hello%20world%21"

encodeURI(): Encode only unsafe characters

encodeURI("https://example.com/hello world"); // "https://example.com/hello%20world"

decodeURIComponent(): Decode percent-encoded strings

decodeURIComponent("hello%20world%21"); // "hello world!"

When to Use Each Function

encodeURIComponent(): For query parameters and form data encodeURI(): For complete URLs with unsafe characters decodeURIComponent(): To decode any percent-encoded text

Common Problems and Solutions

Double Encoding

Problem: Encoding already encoded strings Example: “hello%20world” → “hello%2520world” Solution: Check if string is already encoded before encoding

Incorrect Decoding

Problem: Decoding URLs that aren’t encoded Example: Trying to decode “hello world” (not encoded) Solution: Validate input before decoding

Mixed Encoding

Problem: Inconsistent encoding across URL parts Solution: Use appropriate encoding for each URL component

Character Set Issues

Problem: Assuming non-UTF-8 character encoding Solution: Always use UTF-8 for consistent results

Best Practices

Security Considerations

Input Validation: Always validate decoded URLs XSS Prevention: Encode user input before including in URLs Path Traversal: Be careful with encoded path separators SQL Injection: Don’t trust decoded URL parameters

Performance Optimization

Caching: Cache encoded/decoded results for frequent operations Bulk Operations: Process multiple URLs efficiently Memory Usage: Consider memory usage for large URL lists Streaming: Use streaming for very large datasets

Cross-Platform Compatibility

Consistent Encoding: Use UTF-8 consistently across systems Standards Compliance: Follow RFC 3986 specifications Browser Compatibility: Test across different browsers Server Compatibility: Ensure server properly handles encoded URLs

Framework-Specific Examples

React/JavaScript

// Encoding user input for search
const searchTerm = "React & JavaScript";
const encodedSearch = encodeURIComponent(searchTerm);
const url = `/search?q=${encodedSearch}`;

PHP

// Encoding query parameters
$searchTerm = "Hello World!";
$encoded = urlencode($searchTerm);
$url = "search.php?q=" . $encoded;

Python

from urllib.parse import quote, unquote

# Encoding
encoded = quote("Hello World!", safe='')
# Decoding
decoded = unquote("Hello%20World%21")

Node.js

const querystring = require('querystring');

// Encoding query parameters
const params = { search: "Hello World!", category: "tech & gadgets" };
const encoded = querystring.stringify(params);

Testing and Debugging

Common Test Cases

Spaces: “hello world” ↔ “hello%20world” Symbols: “name=value&type=test” ↔ “name%3Dvalue%26type%3Dtest” Unicode: “café” ↔ “caf%C3%A9” Mixed Content: URLs with various character types

Debugging Tips

Step-by-Step: Encode/decode one component at a time Hex Inspection: Understand the hex values being generated UTF-8 Validation: Ensure proper UTF-8 byte sequences Browser Tools: Use browser developer tools to inspect URLs

SEO and URL Structure

SEO-Friendly Encoding

Readable URLs: Balance encoding with readability Hyphens vs Spaces: Use hyphens instead of encoded spaces when possible Keyword Preservation: Keep important keywords unencoded when safe Length Considerations: Avoid overly long encoded URLs

URL Canonicalization

Consistent Encoding: Use consistent encoding across your site Lowercase: Convert to lowercase when appropriate Trailing Slashes: Handle trailing slashes consistently Parameter Order: Maintain consistent parameter ordering

Frequently Asked Questions

When should I encode URLs?

Encode URLs when they contain spaces, special characters, or non-ASCII text. Always encode query parameter values and user input.

What’s the difference between encodeURI and encodeURIComponent?

encodeURI() preserves URL structure characters like :, /, ?, while encodeURIComponent() encodes everything except basic alphanumeric characters.

Can I encode the entire URL including the domain?

No, domains have special encoding rules. Use Punycode for international domain names, not percent encoding.

Why do I see + instead of %20 for spaces?

In query strings, + is an alternative encoding for spaces. Both are valid, but %20 is more universal.

How do I handle arrays in query parameters?

Common approaches include: ?tags=web&tags=dev or ?tags=web,dev. Choose consistently and encode values appropriately.

Is URL encoding secure?

URL encoding is not a security measure. It’s for compatibility. Always validate and sanitize decoded URLs for security.

Conclusion

URL encoding is essential for web development, ensuring that URLs with special characters and international text work correctly across all systems and browsers. Understanding when and how to encode URLs properly prevents many common web development issues.

Our URL encoder/decoder provides accurate, standards-compliant encoding and decoding with support for international characters and various encoding scenarios. Whether you’re building APIs, handling form data, or working with complex query parameters, proper URL encoding is crucial for reliable web applications.

Start encoding and decoding your URLs today and ensure your web applications handle all types of text and characters correctly across different platforms and browsers.

All encoding and decoding happens locally in your browser. No URLs or data are transmitted to our servers, ensuring complete privacy and security.