Why URLs Need Encoding

What percent-encoding is and when you need it

URLs Have Reserved Characters

A URL is structured text with specific characters that carry special meaning: / separates path segments, ? starts the query string, = separates key from value, & separates parameters, and so on.

What happens if your data contains these characters? For example, if a search query is salt & pepper, you can't just put it in a URL as-is — the & would be interpreted as a parameter separator, breaking the URL structure.

Percent-Encoding (URL Encoding)

The solution is percent-encoding: replace each special character with a % followed by its two-digit hexadecimal ASCII code.

salt & pepper  →  salt%20%26%20pepper
https://example.com/?q=salt%20%26%20pepper

Space becomes %20 (or + in query strings). & becomes %26. = becomes %3D. And so on.

Which Characters Need Encoding?

RFC 3986 defines "unreserved characters" that are always safe in URLs without encoding:

  • Letters: A–Z, a–z
  • Digits: 0–9
  • Special: - _ . ~

Everything else — including spaces, &, =, /, #, ?, and non-ASCII characters like é or 한글 — must be percent-encoded when used as data (not as URL structure).

encodeURI vs encodeURIComponent

In JavaScript, two functions handle URL encoding with different scopes:

  • encodeURI(): Encodes a complete URL, preserving characters that form URL structure (:, /, ?, #, &, =). Use when encoding a full URL.
  • encodeURIComponent(): Encodes a URL component (a single parameter value), encoding even ?, &, and =. Use when encoding a query parameter value.

The Votilo Tools URL Encoder uses encodeURIComponent for encoding individual values, which is the correct choice for query parameter data.