What is the difference between absolute and relative URLs?
An absolute URL spells out the full address (protocol + domain + path); a relative URL gives only a partial path that the browser completes against the current page's address.
An absolute URL is complete on its own and is needed to reach a different domain:
<a href="https://www.example.com/page.html">Link</a>
A relative URL omits the protocol and domain; the browser fills those in from the base — the address of the page currently loaded. The leading character decides how it resolves:
| Type | Example | Resolves against |
|---|---|---|
Domain-relative (starts with /) |
/news/article.html |
The site's domain → https://current-domain.com/news/article.html |
Document-relative (no leading /) |
article.html |
The current page's directory |
Parent directory (../) |
../other/page.html |
One level up, then into other/ |
A worked example makes the two relative cases clear. Say the current page is http://www.example.com/news/overview.html:
/news/2024/artikel.htmlstarts with/, so the base is just the domain →http://www.example.com/news/2024/artikel.html.2024/artikel.htmlhas no leading slash, so the base is the current directory (/news/) →http://www.example.com/news/2024/artikel.html.
This combining happens entirely client-side — the browser already has the base address, so it assembles the full URL itself. Rule of thumb: prefer relative URLs within your own site, because they keep links working even if you move the whole site to a new domain.
Go deeper:
What is a URL? — MDN — breaks down URL parts and walks through every flavour of relative path (domain-relative, document-relative, ../).