Absolute and relative URLs
Learn the difference between absolute and relative URLs.
What is an absolute URL?
An absolute URL is the full address of a resource; it carries every part — protocol, server and path. Example: https://www.city-guide.com/contact.html. Here https:// is the protocol, www.city-guide.com is the server, and /contact.html is the path.
Absolute addresses are used when linking to a page on another site; the browser reads them as-is and ignores the current page's location. Their clearest sign is that they start with a protocol, so they open the same page in any context.
What is a relative URL?
A relative URL is an address interpreted against the current page's location. No protocol or server is written; only the path is given. For a page in the same folder you write menu.html, for the parent folder ../contact.html.
The browser combines these addresses with the current page's address. When moving around within one site, relative addresses stay short and portable; if the site moves to another server, most links keep working.
Exercise Add two links to a library site.
Add two links to the skeleton: one absolute, pointing to an external archive (https://archive-library.example); one relative, to contact.html in the same folder. Choose your own anchor text.
Show example solution
<h1>Çamlık Library</h1>
<p>Welcome.</p>
<a href="https://archive-library.example">Archive</a>
<a href="contact.html">Contact</a>
Test yourself
-
Which one is an absolute URL?
- /about.html
- https://www.city-guide.com/istanbul
- menu.html
- ../faq
Show answer
https://www.city-guide.com/istanbul — Correct. An address with protocol and server is absolute.
-
Relative link to a page in the same folder.
<a href="____">See the menu</a>Show answer
<a href="menu.html">See the menu</a> -
Sort absolute and relative addresses.
- https://www.city-guide.com
- Absolute
- menu.html
- Relative — same folder
- ../contact.html
- Relative — parent folder
- /about.html
- Relative — site root
-
What is the best choice when moving between pages of the same site?
- Write an absolute URL for every link
- Avoid using links at all
- Use relative URLs
- Use only paragraphs
Show answer
Use relative URLs — Correct. Relative addresses stay short and survive a site move.