How a browser resolves a relative link against its base
RFC 3986 says a URI reference is either a full URI or a relative reference. Relative references come in three forms:
Network-path. A relative reference that starts with two slashes (
//host/path) is a network-path reference; RFC 3986 says these are rarely used.Absolute-path. A relative reference that starts with one slash is an absolute-path reference (MDN calls it root-relative). For a root-relative URL, the path part of the base URL does not matter.
Relative-path. A relative reference that does not start with a slash is a relative-path reference.
Resolution against the base
In the RFC 3986 example, with base http://a/b/c/d;p?q, both g and ./g resolve to http://a/b/c/g. MDN notes that resolving a relative reference against a base URL is not simple string concatenation. Relative-path references resolve against the base path up to its last slash, so a trailing slash changes where they point.
Except for fragment-only references, relative references can be used only when a base URI is known. The WHATWG URL Standard requires a non-null base URL to parse a relative-URL string.
Relative links, canonical tags and crawl traps
Google makes two recommendations:
Crawl traps. Google warns that a parent-relative link (
../) placed on the wrong page can create infinite URL spaces. Google recommends root-relative instead of parent-relative URLs to fix that problem.Canonical tags. Google recommends absolute, not relative, paths in
rel="canonical"; it supports relative paths but they can cause problems.
If a platform move touches hard-coded links and canonicals, see the headless CMS SEO migration guide.
For link markup in general, see web development best practices.
How Pagepro writes canonical URLs
When Pagepro takes over an existing site, canonical URLs come from one shared helper in the code, as absolute, self-referencing URLs by default. A per-document override field in Sanity lets SEO specialists fix a single page without a deploy.
Sources
- RFC 3986: Uniform Resource Identifier (URI): Generic SyntaxIETF · rfc-editor.org
- Resolving relative references to a URL - MDNMozilla (MDN) · developer.mozilla.org
- URL StandardWHATWG · url.spec.whatwg.org
- URL structure best practices for Google SearchGoogle · developers.google.com
- How to specify a canonical URL with rel="canonical" and other methodsGoogle · developers.google.com