Links and attributes

Absolute and relative URLs

Link between pages using full URLs, root-relative paths, and document-relative paths without accidentally pointing to the wrong location.

7 minute lesson

~~~

An absolute URL includes the scheme and host:

<a href="https://example.com/about/">About Example</a>

Use an absolute URL when you link to another website.

For pages on the same site, you can use a relative URL. A path that starts with / begins at the root of the current site:

<a href="/about/">About us</a>

This points to /about/ no matter which page contains the link.

A path without the first slash is relative to the current document:

<a href="photos/">Photos</a>

If the current page is https://example.com/trips/copenhagen/, that link goes to:

https://example.com/trips/copenhagen/photos/

Use ../ to move up one directory:

<a href="../">All trips</a>

Relative URLs are useful because they keep working when the whole site moves to another domain. The tradeoff is that you need to understand which document they are relative to.

Quick check

Result

You got of right.

Lesson completed