CODEWITHSUNDEEP
htmlhref
Pupkin
Pupkin

Reputation: 1101

Href without http(s) prefix

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?

Upvotes: 57

Views: 61969

Answers (4)

Chemah
Chemah

Reputation: 638

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>

Upvotes: 15

Urmila Bholan
Urmila Bholan

Reputation: 21

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

Upvotes: -1

David
David

Reputation: 218837

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.

Upvotes: 100

ssc-hrep3
ssc-hrep3

Reputation: 16069

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).

Upvotes: 63

Related Questions