URL Encoding in HTML – HTML URL Encode Characters

Welcome to DataFlair HTML Tutorial. We will learn about HTML URL Encode and encoding process along with encode characters.

HTML URL Encoding

Uniform Resource Locator or URL is used as the address of a document on the web. It can be composed of words, typically the Domain Name Server(DNS), or IP address. For example, https://data-flair.training/blogs/ is a URL.

The structure of this URL is as follows-
scheme://prefix.domain:port/path/filename

Here:

Scheme – Defines the internet service type, commonly http or https.
Prefix – Defines the domain prefix, www.
Domain – It defines the domain name of the internet, data-flair.training
Port – Defines the host’s port number, 80 is the default port number for http.
Path – Defines the path at the server.
Filename – It defines the name of the file or the document that is being displayed.

HTML URL Schemes

Some common URL schemes are-

• Http(HyperText Transfer Protocol) – Used for common web-pages. It is not encrypted.
• Https(Secure HyperText Transfer Protocol) – Used for secure web-pages. It is encrypted.
• ftp(File Transfer Protocol) – Used for downloading and uploading files.

HTML URL Encode Characters

URL encoding is the practice of translating characters within URL to ASCII so that they can be easily transmitted and get accepted by all the browsers present globally on the internet. The non-ASCII characters are shown with a percentage sign (%) followed by hexadecimal digits.

Hence, URL encoding basically involves replacing a character that does not start with ‘%’ followed by hexadecimal digits to the ASCII character set. For example, if you want to type a space in the URL, you write it as %20. $ is replaced by %24.

http://www.example.com/new%20article.htm

We would interpret this as ‘new article.htm’

The browser encodes the input as per the character set used in the document. The character set used in HTML5 is UTF-8.

The character that is encoded are:

a. HTML ASCII Control Characters

The characters used for output control. Typically from 00-1F(0-31 in decimal) and 7F(127 in decimal).
ASCII Encoding Example:

For entire URL encoding, please visit https://www.eso.org/~ndelmott/url_encode.html

b. HTML Non-ASCII Characters

The characters beyond the ASCII characters i.e., beyond 128 characters. Following is the list of Non-ASCII url encoding-

c. HTML Reserved Encode Characters

These include all the special characters such as semicolon(;), dollar($), question mark(?). These characters have a different meaning in URLs and need to be encoded. For example, the ‘/’ character has a special meaning i.e. it is used to separate the paths of URL and at the same time, it is also a reserved character. It is encoded as %2F. Following is the list of reserved characters.

d. HTML Safe Encode Characters

Alphanumeric characters i.e. 0-9, a-z,A-Z , special characters such as $, -, _, ., +, !, *, ‘, (, ), and reserved characters are not encoded and known as safe characters.

e. HTML Unsafe Encode Characters

These include space, greater than and less than signs, quotation marks, etc. They have a tendency to be misinterpreted in the URL and thus should be encoded properly. Following is the list of some unsafe characters-

URL-Encoding for Control Characters

ASCII characters from %00-%1F were designed to control hardware devices.

Summary

In this article, we’ve discussed the Uniform Resource Locator, which typically defines the address of a document on the web. We’ve discussed the process of encoding the character of the URL to the corresponding ASCII characters that are globally understood by the browsers on the internet. We’ve also looked at some common URL encoded characters in Windows-1252 and UTF-8 along with URL encoding of control characters.