Why does an anchor tag's href values need http:// preprended to the URL?

Solution 1:

There are several protocols: HTTP, HTTPS, FILE, SSH, SSL, FTP. In addition, as Jeremy mentioned, it's quite possible you may have a file on your server with the exact name of the text you're entering in the HREF.

Basically, any text in the href without a protocol is assumed to be a relative path if there is no / or protocol.

Solution 2:

Update 3/2/2016:

Just use HTTPS for everything, eg: https://www.example.com

Paul Irish recommends against using protocol-relative URLs, i.e. //, and recommends writing all links using https:// - the rationale being:

Now that SSL is encouraged for everyone and doesn’t have performance concerns, this technique [protocol-relative URLs] is now an anti-pattern. If the asset you need is available on SSL, then always use the https:// asset.

Allowing the snippet to request over HTTP opens the door for attacks like the recent Github Man-on-the-side attack. It’s always safe to request HTTPS assets even if your site is on HTTP, however the reverse is not true.


Original post:

As other answers have stated, including protocols in URIs is important because otherwise you leave it up to chance how the URI is interpreted. You could have a MP4 video file literally named "www.something.com" instead of "video.mp4", or a client might try to access your website over FTP because it guessed the protocol wrong.

As Kolink pointed out in a comment, you can omit the http: entirely and just use //, eg //www.example.com. It stops mixed-content security errors ("this page has insecure elements"). It does this because browers will fetch assets such as images as if those assets were using https:// when the user is connected to the current page via HTTPS.

Solution 3:

If you leave off the protocol (http, https, ftp, mailto, etc...) the link will be relative to the current request URI. It is the same as prefixing the href with a ./ meaning this directory.

browser address bar is http://domain.com/questions/

<a href="www.stackoverflow.com" becomes domain.com/questions/www.stackoverflow.com

<a href="./www.stackoverflow.com" becomes domain.com/questions/www.stackoverflow.com


If you prefix with a / you will get from the domain root <a href="www.stackoverflow.com" becomes domain.com/www.stackoverflow.com


By adding the http:// (or any other protocol) the browsers knows this link is meant to be external to the current page. It is an absolute path because it contains the protocol and full path information.

<a href="http://www.stackoverflow.com" becomes http://www.stackoverflow.com

The link can also be protocol-relative in order to easily avoid mixed content security errors.


Furthermore, if you specify the <base href="http://domain.com/dir/"> in the (* it must be an absolute URL) Then all non-protocol prefixed URLs in href= and src= will be based on that base URL instead of the current page.

assuming the same address bar of http://domain.com/questions/ and the <base set above.

<img src="file.jpg" becomes http://domain.com/dir/file.jpg <a href="www.stackoverflow.com" becomes http://domain.com/dir/www.stacoverflow.com

Solution 4:

Because the URL could have any number of protocols:

The browser doesn't know if you mean ftp://www.stackoverflow.com, http://www.stackoverflow.com or whatever, so you need to specify.