A matter of protocol

The web is made of sugar, spice and all things nice. On closer inspection, this is what most URLs on the web are made of:

protocol://domain/path
  1. The protocol—e.g. http—followed by a colon and two slashes (for which Sir Tim apologises).
  2. The domain—e.g. adactio.com or huffduffer.com.
  3. The path—e.g. /journal/tags/nerdiness or /js/global.js.

(I’m leaving out the whole messy business of port numbers—which can be appended to the domain with a colon—because just about everything on the web is served over the default port 80.)

Most URLs on the web are either written in full as absolute URLs:

a href="/web-asset-proxy?u=aHR0cDovL2FkYWN0aW8uY29tL2pvdXJuYWwvdGFncy9uZXJkaW5lc3M.a87e87b99d07e356eba91b1fa63c09cfd9cf657d&v=20260725-2"
script src="/web-asset-proxy?u=aHR0cHM6Ly9odWZmZHVmZmVyLmNvbS9qcy9nbG9iYWwuanM.23b2fe1df77cababe24f43fddce42f82d0fb479c&v=20260725-2"

Or else they’re written out relative to the domain, like this:

a href="/web-asset-proxy?u=aHR0cHM6Ly9hZGFjdGlvLmNvbS9qb3VybmFsL3RhZ3MvbmVyZGluZXNz.e6e2ebbbd9babdcdd3fa265b691df0162777d9a1&v=20260725-2"
script src="/web-asset-proxy?u=aHR0cHM6Ly9hZGFjdGlvLmNvbS9qcy9nbG9iYWwuanM.81fa8228054b2c4e6d5a1f24a154ecee0056f459&v=20260725-2"

It turns out that URLs can not only be written relative to the linking document’s domain, but they can also be written relative to the linking document’s protocol:

a href="/web-asset-proxy?u=aHR0cHM6Ly9hZGFjdGlvLmNvbS9qb3VybmFsL3RhZ3MvbmVyZGluZXNz.e6e2ebbbd9babdcdd3fa265b691df0162777d9a1&v=20260725-2"
script src="/web-asset-proxy?u=aHR0cHM6Ly9odWZmZHVmZmVyLmNvbS9qcy9nbG9iYWwuanM.23b2fe1df77cababe24f43fddce42f82d0fb479c&v=20260725-2"

If the linking document is being served over HTTP, then those URLs will point to http://adactio.com/journal/tags/nerdiness and https://huffduffer.com/js/global.js but if the linking document is being served over HTTP Secure, the URLs resolve to https://adactio.com/journal/tags/nerdiness and https://huffduffer.com/js/global.js.

Writing the src attribute relative to the linking document’s protocol is something that Remy is already doing with his :

<!--[if lt IE 9]>
<script src="/web-asset-proxy?u=aHR0cHM6Ly9odG1sNXNoaW0uZ29vZ2xlY29kZS5jb20vc3ZuL3RydW5rL2h0bWw1Lmpz.5dcf28f2771bb6ef4cbfa7f4e26dcf228bfbaead&v=20260725-2"></script>
<![endif]-->

If you have a site that is served over both and , and you’re linking to a -hosted JavaScript library—something I highly recommend—then you should probably get in the habit of writing protocol-relative URLs:

<script src="/web-asset-proxy?u=aHR0cHM6Ly9hamF4Lmdvb2dsZWFwaXMuY29tL2FqYXgvbGlicy9qcXVlcnkvMS40L2pxdWVyeS5taW4uanM.f05c67a7017121b36bf015060ab43251f20ed0ec&v=20260725-2">
</script>

This is something that HTML5 Boilerplate does by default. HTML5 Boilerplate really is a great collection of fantastically useful tips and tricks …all wrapped in a terrible, terrible name.

Have you published a response to this? :

Previously on this day

22 years ago I wrote Sunshine state of mind

I’m taking a flight from Gatwick to Orlando first thing tomorrow. Jessica and I will be spending the next two weeks in Florida.

22 years ago I wrote Not waving but drowning

Looking at the unusually large waves being churned up on the shore of Brighton’s beach yesterday put me in mind of a particularly descriptive line from Joyce:

24 years ago I wrote Cadbury's ad upsets India

This could have come from Adbusters: