HTML URL Encoding
In HTML, a URL (Uniform Resource Locator) is used to specify addresses on the web.
Encoding in URLs is important because URLs can only be sent over the
Internet using the ASCII character set.
If a URL contains characters outside this set, they need to be encoded. Here’s a brief overview of how URLs and encoding work
URL Structure
A URL typically has the following structure:
scheme://host:port/path?query#fragment
Scheme: Indicates the protocol (e.g., http, https, ftp).
Host: Domain name or IP address (e.g., www.example.com).
Port: Optional, specifies the port number (default ports are 80 for HTTP and 443 for HTTPS).
Path: Specifies the path to the resource on the server (e.g., /path/to/page).
Query: Optional, provides additional parameters (e.g., ?key=value).
Fragment: Optional, points to a specific section within the resource (e.g., #section1).
URL Encoding
URL encoding replaces non-ASCII characters with a "%" followed by two
hexadecimal digits. Spaces are encoded as "%20" or replaced by a plus sign
"+" in query strings.
Common Encodings
- Space: %20 or +
- Double quotes ("): %22
- Number sign (#): %23
- Percent (%): %25
- Less than (<): %3C
- Greater than (>): %3E
Simple URL
https://www.example.com/page
URL With Query Parameters
https://www.example.com/search?q=html+url+encoding
URL With Special Characters
https://www.example.com/path/to/page?query=hello%20world%20%23welcome
Encoding In HTML
When embedding URLs in HTML, you often need to ensure they are properly
encoded to avoid issues with special characters.
In these examples, special characters in the URL are encoded to ensure
they are correctly interpreted by browsers. Here’s how you might use URLs
in HTML:
Example 1:
<a
href="https://www.example.com/search?q=html%20encoding%20example">Search</a>
Example 2:
<img src="https://www.example.com/images/logo.png" alt="Example Logo">More topic in HTML
