Brief Introduction to URL Encoding

URL encoding protects against characters that shouldn't appear as-is

Close up of https on internet search bar

KTSDESIGN/SCIENCE PHOTO LIBRARY / Getty Images

When you pass information through a URL, the string must only use specific allowed characters. These allowed characters include alphabetic characters, numerals, and a few special characters that have meaning in the URL string. Any other characters that need to be added to a URL should be encoded so that they don't cause problems during the browser's trip to locate the pages and resources you are looking for.

Encoding a URL

Encoding merely takes a special character and replaces it with its encoded alternative. The string looks messy, but the result is easy for computers to read and you won't risk URL misdirections.

For example, linking to a file titled my resume.pdf requires URL encoding to accommodate the space between my and resume. The result is my%20resume.pdf. Without the encoding for the space symbol, the web browser will assume that the URL ends at the end of the word my, with resume.pdf being discarded as superfluous data. In such a situation, you'd never find your file!

What Should Be Encoded?

Any character that is not an alphabetic character, a number, or a special character that is being used outside its normal context must be encoded in your page. Below is a table of common characters in URLs and their encoding:

Reserved Characters URL Encoding

Character Purpose in URL Encoding
: Separate protocol (http) from address %3B
/ Separate domain and directories %2F
# Separate anchors %23
? Separate query string %3F
& Separate query elements %24
@ Separate username and password from domain %40
% Indicates an encoded character %25
+ Indicates a space %2B
<space> Not recommended in URLs %20 or +

These encoded examples are different from what you find with HTML special characters. For example, to encode a URL with an ampersand character, use %24. However, in HTML, use either &amp; or &#38;, both of which would write out the ampersand in the HTML page.

These different encoding schemes aren't as contradictory as they seem. One set governs URLs while the other governs the content of the page to which the URL points.