HTML absolute and relative path

All HTML links are divided into external and internal. External links are links that lead from one site to another site or a file located on another site. Internal links are links that link from one page of a site to another page on the same site or to sections of the same page.

All external links in the href attribute of the <a> tag contain the absolute path to the document they reference. Internal links, in turn, can contain both an absolute path and a relative path (in this case it depends on your personal preferences).

All links can also be conditionally divided into relative and absolute. Relative links are HTML links that contain relative paths, relative links can only be internal. Absolute links are links containing absolute paths, absolute links can be both external or internal.

Relative path

The relative path means that the path to the file or page of the site is specified relative to the directory in which the current page is located, or relative to the root directory of the site. Consider the parts from which the relative path can consist:

Parts of the path Description Values example
file_name If you specify only the file name as an attribute value, this means that the desired file is in the same folder as the page with the link. page.html
directory/ If the file to which you want to specify the path is located in the child directory relative to the file with the link, this means that we need to go down one level (to the child folder of the current directory), in which case the path starts with the name of the child directory, after it name is the direct slash "/", it is used to separate parts of the path, after it the name of the file we need is specified.

Note: You can go down exactly as many folders down as you created them. For example, if you created a folder 10 levels below the root folder, you can specify a path that takes you down to 10 folders. However, if you have so many levels, this most likely means that the organization of your site is unnecessarily inconvenient.


../ If you want to specify that the file you are referring to is in the parent folder, use the symbols .. (two dots), they mean to go up one level (to the parent folder of the current directory). Next, we specify a forward slash "/" to divide the parts of the path, and write the name of our file.

Note: characters .. you can use as many times as you like, using them, you go up one folder each time. However, you can go up until you reach the root folder of your site. Above this folder you can not climb.



../../../dir1/dir2/page.html - go up from the current folder to the three folders above and from there we go down two levels below to the required file
/ A relative path does not have to always start relative to the current directory where the pages with the link are located, and it can also start relative to the site's root directory. For example, if the desired file is in the root directory, the path can start with the "/" character, after which you only need to specify the name of the file that is located in the root directory.

Note: When the "/" is indicated first, it means the beginning of the path from the root directory.



Absolute path

An absolute path is usually used to specify the path to a file that is located on another network resource. It is a complete URL to a file or page. In the absolute path, the protocol is first specified, followed by the domain name (site name). For example: - this is how the absolute path to a particular website looks. http:// is a data transfer protocol, and is the name of the site (domain).

The absolute path can also be used on your own site. However, within the site, it is recommended to use the relative path as the value of the links.

Now let's look at what a URL is. Each web page on the Internet has its own unique address, here it is called the URL. The abbreviation URL is decrypted as a Uniform Resource Locator, in simple terms, the URL is the locator of the resource. This way of recording the address is standardized on the Internet.

A couple of example URLs:


Copying materials from this site is possible only with the permission of the site administration and
when you specify a direct active link to the source.
2011 - 2021 © | ruen