Absolute vs Relative URLs: Worked Examples

An absolute web URL includes its scheme and host. A relative reference needs a base URL before a browser can determine the complete destination.

Examples at a glance

Start with this base

Base URL: https://example.com/docs/start/
Relative references below are resolved against this exact URL.

Go up one level

Relative reference: ../images/map.png
Move up from start/, then into images/.
Resolved URL: https://example.com/docs/images/map.png
The complete result.

Start from the site root

Root-relative reference: /contact/
The leading slash starts at the root.
Resolved URL: https://example.com/contact/
The complete result.

Resolve a parent path

Against https://example.com/docs/start/, ../images/map.png resolves to https://example.com/docs/images/map.png. /contact/ instead resolves to https://example.com/contact/.

A trailing slash matters

Against https://example.com/docs/start, the final start segment is treated differently from a directory ending in /. Enter the exact base when testing relative references.

Protocol-relative references

//example.org/path inherits the base’s scheme. The analyzer requires an explicit HTTP/HTTPS base for relative input rather than assuming this page is the base.