Humans always search for absolute meaning in life. However, at times we find that “everything is relative”, often to our frustration.
Absolute vs relative take on a whole new meaning when we talk about websites, and the difference between the two can cause links to other pages on your website to suddenly go rogue in the strangest of situations.
What is an absolute link?
An absolute link is the full link URL of a website page. It works no matter where you are on the net.
For example, if we wanted to link to our resources page, https://www.heartcomms.com.au/resources/ is the absolute link. It is absolutely and positively the right address, no ifs buts or maybes.
You can copy and paste it into any browser, and our handy-dandy resources page will appear (Check it out if you haven’t already!)
What is a relative link?
A relative link is essentially a link shortcut so the link path appears relative to the page where the link appears.
What this means is that the link only works when you are already on the page or website to which the link appears.
So, for example, if I wanted to link to my resources page from this blog post, I could simply highlight the text I wanted to link, and in the hyperlink section I would type in /resources/ or, if my website theme allowed it, simply select the resources page.
This would get translated into the website code as <a href=”../resources/”>.
Unfortunately, if you go to your friendly Google browser, and copy and paste in /resources/, you will end up in a lost and obscure part of the internet. You certainly wouldn’t get to the resources page on my website.
A relative link only works when you are within the website it refers to, as it depends on where the link was found.
Relative links are like human relatives. In my case, I am Rachel and Teagan’s mum. I am only mum to a handful of cherubs and not every kid on the planet. However, if we are in the supermarket and a kid calls out “Mum” you will see loads of heads turn as all kids seem to get the same whine and tone happening, so Mum could be any one of the mothers there.
How are relative links created?
Most modern WordPress developers will only create absolute links on a website. However, many traditional WordPress web developers in their zeal to shave off time during the website development phase, will often create a relative link rather than an absolute link when they link between pages on your website.
They do it as a shortcut. Developers often build websites on staging sites and then migrate them to your live location once you are a happy little Vegemite.
If they use relative URLs, they don’t have to go back and find all of the links on your site and update them to your new URLs. They just lift and plonk and the code all works … sort of.
The trouble is these traditional developers defend their need to use relative URLs with the same fierce passion as if they suddenly started talking with a Scottish accent, and painted their faces blue while yelling “But they will never take our freedom.”
My brain exploded a few sentences back: Why does the type of links on my site matter?
If you have an older site and you don’t touch anything, then you may never be the wiser about all this stuff. However, relative URLs can cause no end of grief for you down the track.
Scrapers love relative links
Have you ever wondered why a version of all the content of your website has suddenly appeared in an unsavoury part of the internet?
A scraper has lifted your website content in full and uploaded it to their website, and of course, all the relative links now point to their website instead of yours. Relative links made their job so much easier!
AMP breaks relative links
If you decide to add AMP (Accelerated Mobile Pages) to your site to speed up delivery of your site content for mobiles, then all relative links will break, throwing 404 page not found errors.
This is not ideal as the reason you were jumping through the AMP hoops was to make your content more accessible not disappear.
You can end up with massively long lists of “page not found”. Here are just a few of the problems we found on our site when we added in AMP.
Relative links can mess with your RSS feed
Similar to the AMP problem, RSS feeds deliver your content with a slightly different URL structure. This can end up breaking all relative URLs which can include images and links, meaning people who prefer to read your content through a feed aggregator such as Feedly may end up following links to broken pages or not see images in your content.
Relative links can confuse Google
Bots are not the brightest things in the world. They follow along wherever the link goes.
When your website migrates to https instead of HTTP – links can get missed in the migration, which means Google bots head off on a tangent following a mixture of relative and absolute URLs.
Unless you set up your website correctly from day one, so that the www version of your site and the non-www version of your site both point to the one place, you may end up with mixed URL links, and confuse the heck out of the poor defenceless Google bots.
What happens is Google can then end up indexing the same content on your website multiple times, resulting in potential duplicate content problems.
A confused Google bot is not what you want when it comes to clients finding your website.
Need more light reading? Here’s a Yoast article on why relative URLs need to be banned.
What should you do if you have relative links on your website?
There really is only one option. Find and fix each and every relative link on your site.
The safest option for DIYers is one-by-one, page-by-page. It may be slow, but it works.
For the more technically minded, you could try running some scripts on your data to make it faster, but often the scripts create more problems than they fix. If you are keen, here is an SQL script to try out to replace relative URLs with Absolute URLs (Don’t try this without a full database backup first, and don’t do this at all if you don’t use the term SQL in common conversation).
In the wonderful world of WordPress, you definitely want to quest for absolute truth rather than relative truth. Leave the shades of grey for other parts of your life.