How To Web Design & Dev Brief Introduction to URL Encoding URL encoding protects against characters that shouldn't appear as-is Share Pin Email Print KTSDESIGN/SCIENCE PHOTO LIBRARY / Getty Images Web Design & Dev Basics HTML CSS By Jennifer Kyrnin Freelance Contributor Jennifer Kyrnin is a professional web developer who assists others in learning web design, HTML, CSS, and XML. our editorial process LinkedIn Jennifer Kyrnin Updated January 03, 2020 25 25 people found this article helpful 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 & or &, 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. Continue Reading Everyone Uses URLs but Do You Know What It Means? Every Wonder How Base64 Encoding Works to Send Data Over Email? How to Use Special Characters in HTML How to Construct Failproof 'Mailto' URLs A Quick Guide to Using Mailto URL Elements What Should I Name My HTML File? How Do You Type Characters With Umlaut Marks? Here's How Text Strings Are Used in Excel Here's How a URL Helps You Find Things on the Internet Yes, You Can Type Characters With Cedilla Accent Marks. Here's How Fun Facts About Common Keyboard Symbols How to Show a File's Printable Characters With the Strings Command Get Your Own Personalized Facebook Username How to Type a Tilde Mark How to Test a Suspicious Link Without Clicking It How Do You Put Accents Over Letters on Mac and PC?