URL Component Encoding Explained

A URL has structure

A URL uses reserved characters to separate parts such as the scheme, host, path, query, and fragment. A value inserted into one of those parts may itself contain characters with structural meaning.

For example, & separates query parameters. If it is part of a single value, it should be encoded as %26 so it is not mistaken for a separator.

Encode the component, not the whole URL

Component encoding turns a value into a form that can safely occupy one URL component. Encoding a complete URL as if it were a component also encodes its structural separators. That is usually not what you want when constructing a URL.

For a query parameter value, encode the value before placing it into a query string. APIs such as URL and URLSearchParams can help construct URLs while preserving their structure.

Percent encoding and UTF-8

Percent-encoded sequences such as %C3%A9 represent bytes as hexadecimal pairs. Modern web URL handling generally uses UTF-8 when converting non-ASCII text to bytes.

Do not assume that a plus sign always means a space. In component decoding, + is a literal plus; form-encoded query bodies have separate conventions.

Try it

Use the URL Encoder & Decoder for one component at a time. It reports malformed percent sequences rather than silently replacing them.