How to Add Links in Web Pages

Frank Olivo

Frank Olivo is the founder of Sagapixel. He writes on a number of topics related to digital marketing, but focuses mostly on web design and SEO.

Table of Contents


Making Links or Hyperlinks:

You’re probably trying to figure out how to add a simple text link from a page on your website to another page on the web. This article will explain how to do this, as well as share some valuable information about the role of links in SEO.

Text links are commonly used on websites. Their primary purpose is to easily share a resource found on another page on the web, but this is not their only reason for being. Linking to another page on the web can impact the search rank of both your web page and the page you are linking to.

How to Create a Hyperlink in HTML

To create a link you need to know the URL (Uniform Resource Locator) address of the page you want to link to. For example, let us say we want to make a link to Sagapixel’s website.

First, we’ll need the URL of the webpage, including the protocol. In other words, the URL should look like “https://sagapixel.com” and not simply “sagapixel.com.” We can use a search engine such as Yahoo or Google to search for the site’s URL address. Once we have the address, we need the correct HTML statement. For example:

Philadelphia SEO company

And here’s the code that made it:

<a href=”https://sagapixel.com/seo/philadelphia”>Sagapixel SEO</a>

       Notice the three parts which make up this line of code. First, there is the <a href=”https://sagapixel.com/seo/philadelphia”> which begins the reference link. Notice the use of the full URL address in this case which is enclosed in quotations. Relative URL addresses may also be used. Second, there is the text which will become our link. Third, and most important, is the </a> tag which ends the reference link.

Makes sense, right? You have a beginning, and end, and the stuff between which becomes linked.

Now, what if we were to combine the unordered list statement with this reference link statement. We could create a list of links. That is what you wanted, right?

Here’s the code that did it:

<ul>
<li><a href=”https://moz.com/”>Moz</a></li>
<li><a href=”
http://www.rareamericana.com/“>Rare Americana</a></li>
<li><a href=”https://sagapixel.com/web-design/philadelphia/”>Website Design</a></li>
<li><a href=“http://tucows.com/”>Tucows.com</a></li>
</ul>

       Pretty simple, right? If not, maybe you should review the making lists tutorial. Notice how each link is surrounded by the <li> and </li> tags.


Image Links:

      You are not restricted much when making links. You can link images such as a JPG (JPEG) file or even a GIF file. Here’s an example using my masterpiece, “image.gif”.

How to Add Links in Web Pages

       This link is to the Metropolitan Museum of Art. Ironic isn’t it. Nevertheless, I home you can see the beginning of the link and the end in the following. If your not sure how to insert graphics into your home page, visit my tutorial on images.

<a href=”http://www.metmuseum.org/”><img src=”image.gif”></a>

       Normally, this would all be on one line. I had to wrap it to make it fit. Notice, that in this case you need to know two addresses. You need to know the URL address where the link will take you and the URL address of the image you are using.

       You probably noticed the blue lines around my image. That is actually the border of the image turning blue just the same way the text turns the color blue when it is a link. To remove the blue border, add the BORDER=”0″ attribute or option to the <img src=”…”> statement. This is shown below.

How to Add Links in Web Pages

And here’s the code that did it.

<a href=”http://www.metmuseum.org/”><img src=”image.gif” border=”0″></a>

The SEO Impact of Links

Linking to a page on the web can impact the search rank of both your web page and the page you are linking to.

The Impact on Your Search Rank When Linking to a Resource

Google uses hyperlinks to determine the relevance of both your content and the content of other websites. For example, if you have a blog post that talks about mortgage foreclosure in Pennsylvania, including a link to a resource on pa.gov that talks about the process will indicate to Google that this post is citing an authoritative resource. This link is a signal that your content is more likely to be well researched, making it more trustworthy.

Conversely, linking to a “bad neighborhood can have the opposite impact.

An article on mortgage foreclosure that links to a spammy payday loan website is likely to send signals that your resource does not aim to inform, rather aiming to direct visitors to an unsafe place on the web. This can have a detrimental impact on your search rank.

The Impact on the Page You Link to

Linking to another page on the web passes PageRank. This is Google proprietary method for determining the authoritativeness of a web page. In other words, a page that earns a lot of links from other websites is considered to be more “authoritative” and a better resource for Google users than a page that doesn’t earn links.

Additionally, the text used to create the link, known as anchor text, sends signals about the relevance of a page. In the example of the mortgage foreclosure link, if the web page is linked to with the anchor text “ways to prevent foreclosure,” Google will determine that this page is about that topic. This will increase the likelihood of this page ranking highly for that query.

The context of the link matters as well.

Linking to the foreclosure page with the anchor text “ways to prevent foreclosure” in an article about auto repair will not have the same impact as the same exact link in an article about home ownership.

Well, I hope you enjoyed this little link tutorial. Have fun creating links.

Related Posts

Call Now Button