URL - Uniform Resource Locator

What is URL?

Like every house or building has a unique address, every car has a unique number plate in a similar way every document on the web has a unique address called the URL or the Uniform Resource Locator. The URL helps us to find any document on the web.

For instance, the URL of dyclassroom is https://dyclassroom.com so, when you type this URL or the website address in your web browser like Google Chrome, then your browser sends a request to the web server which holds the dyclassroom pages. After receiving your request the server responds back by sending the home page of the website to your browser.

Anatomy of URL

A URL can be divided into some important parts namely the protocol, domain name, path and files. The following image depicts the different parts of a URL.

Protocol

Protocol is a set of rules that governs the movement of date over the internet. To transfer data from one computer to the other we use the HTTP or HyperText Transfer Protocol.

You may also find protocol ending with s as in https. The s stands for secure connection and we general see a green lock in your web browser URL field.

The protocol is separated from the rest of the URL by a colon and two forward slash [://].

Hostname

Hostname is the name of the website. For example, facebook, the popular social networking website has a hostname www.facebook.com. Similarly, the famous search engine Google has a hostname www.google.com.

When we type in the hostname or the website address in our browser and press the enter key, a series of event takes place. Our request goes to the DNS or the Domain Name System that converts the human readable hostname into some numbers called the IP address or the Internet Protocol address and then our request is forwarded to that specific server that has the matching IP address for the entered hostname. When the server receives our request it responds by sending back the page we asked for. This page in the form of HTML is received by our web browser along with other dependent files like CSS (Cascading Style Sheet), JavaScript, images, videos, sounds etc. and is rendered on our screen.

It is really hard to remember the IP address of every website we use in our life. So, to solve this problem we have hostname for the website.

Prefix

The traditional prefix of a hostname is www which is World Wide Web. But you plan to create subdomains then this can have a different value.

Domain

It is the name of the website and every website has a unique domain.

Path

It is the directory on the server which holds the requested file. It is similar to the folder or directory system that we have on our computer.

File

It is the file we are requesting from the web server.

In the above example we have the following URL https://dyclassroom.com/image/dy-favicon-black-180x180.png. The protocol is http. The hostname is dyclassroom.com and the domain is dyclassroom.com. By looking at the URL we can say that we are requesting a png (image) file which is inside an image directory.

404

In case we enter wrong address or in case we are requesting a page or file that no longer exist then we get the 404 error which stands for file not found.

Root Directory of website

It is the top level directory of a website and contains all other files and directories. It is generally denoted by a forward slash [/]. When a user enters the website URL he generally lands on the index or home page present in the root directory of that website.

In the above picture the root directory is called public_html and it contains three sub-directories css, image and js and has an index.php page. When the user will enter the website address dyclassroom.com he will land on the index.php page as it is the default page under the root directory.

Absolute URL

Absolute URLs are the one that contains complete address (including the protocol, hostname, path and filename) of any document of a website.

Example of an absolute URL is https://dyclassroom.com/image/dy-favicon-black-180x180.png.

Relative URL

Relative URLs are the one that don’t include the prototype and the hostname of the website. They are used to point at resources that are present within the website root directory.

For example, if you are at the home page of dyclassroom and want to go to the dy-favicon image then the relative URL will be /image/dy-favicon-black-180x180.png

Note! Root directory is represented by a forward slash /.

Similarly, if you want to get the default stylesheet of the website and you are at the index.php page then the relative URL will be /css/default.css

Similarly, if you are inside the image directory and want to get the default stylesheet file which is inside the css directory so to get this the relative URL will be ../css/default.css

Note! ../ instruct the browser to move one level up the present directory.