53

I just have created primitive html page. Here it is: example And here is its markup:

<a href="www.google.com">www.google.com</a>
<br/>
<a href="http://www.google.com">http://www.google.com</a>

As you can see it contains two links. The first one's href doesn't have 'http'-prefix and when I click this link browser redirects me to non-existing page https://fiddle.jshell.net/_display/www.google.com. The second one's href has this prefix and browser produces correct url http://www.google.com/. Is it possible to use hrefs such as www.something.com, without http(s) prefixes?

1

4 Answers 4

97

It's possible, and indeed you're doing it right now. It just doesn't do what you think it does.

Consider what the browser does when you link to this:

href="index.html"

What then would it do when you link to this?:

href="index.com"

Or this?:

href="www.html"

Or?:

href="www.index.com.html"

The browser doesn't know what you meant, it only knows what you told it. Without the prefix, it's going to follow the standard for the current HTTP address. The prefix is what tells it that it needs to start at a new root address entirely.

Note that you don't need the http: part, you can do this:

href="//www.google.com"

The browser will use whatever the current protocol is (http, https, etc.) but the // tells it that this is a new root address.

3
  • 2
    What do you mean by 'browser will use whatever the current protocol is'. When I do this for a url that runs only for http it opens it in https which doesn't work, unfortunately. is there a way around for this? Oct 29, 2018 at 10:53
  • 1
    @ZeeshanAdil: The current protocol which was used to open whatever page contains the link being clicked. So if the page was accessed via HTTP, links will default to that unless otherwise specified. If it was accessed via HTTPS, links will default to that unless otherwise specified. The way around that is to specify the protocol in the link if it needs to be a specific one.
    – David
    Oct 29, 2018 at 10:58
  • 1
    Where // is mentionned in html documentation. I don't find anythings about this (but it work)
    – Ruokki
    Dec 18, 2020 at 13:43
63

You can omit the protocol by using // in front of the path. Here is an example:

<a href="//www.google.com">Google</a>

By using //, you can tell the browser that this is actually a new (full) link, and not a relative one (relative to your current link).

1
  • 9
    Additionally, if your website runs on https the link will also be https, and if your website runs on http, the link will be http.
    – Rudey
    Sep 17, 2018 at 8:37
14

I've created a little function in React project that could help you:

const getClickableLink = link => {
    return link.startsWith("http://") || link.startsWith("https://") ?
      link
      : `http://${link}`;
  };

And you can implement it like this:

const link = "google.com";
<a href={getClickableLink(link)}>{link}</a>
-2

Omitting the the protocol by just using // in front of the path is a very bad idea in term of SEO. Ok, most of the modern browsers will work fine. On the other hand, most of the robots will get in trouble scanning your site. Masjestic will not count the flow from those links. Audit tools, like SEMrush, will not be able to perform their jobs

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.