Links

HTML uses the <a> (anchor) tag to create a link to another document. An anchor can point to any resource on the Web: an HTML page, an image, a sound file, a movie, etc. Throughout this HTML tutorial we will cover how to properly make links within HTML.

The syntax of creating an anchor:

<a href="url">Text to be displayed</a>

The <a> tag is used to create an anchor to link from, the href attribute is used to address the document to link to, and the words between the open and close of the anchor tag will be displayed as a hyperlink.

Another attribute also exists called “target”. With the target attribute you can define where the linked document will be opened. Let’s take a look at some of the options we have here:

  • “_blank”
  • “_parent”
  • “_self”
  • “_top”

So let’s use this and put together a simple link:

<a href="http://www.rapidpurple.com" target="_blank">Rapid Purple</a>

This gives us: Rapid Purple which when clicked on would open in a new browser window/tab.

The name attribute is used to create a named anchor. When using named anchors we can create links that can jump directly into a specified section on a page, instead of letting the user scroll around to find what he/she is looking for.

Syntax of a named anchor:

<a name="label">Text to be displayed</a>

The name attribute is used to create a named anchor. The name of the anchor can be any text you care to use. The line below defines a named anchor:

<a name="tips">Read the Useful Tips section</a>

You should notice that a named anchor does not display in a special way. Let’s take a closer look at how we can use named anchors in the example below:

<html>
<body>

<p>
<a href="#C4">
See also Chapter 4.
</a>
</p>

<p>
<h2>Chapter 1</h2>
<p>This chapter explains bla bla bla</p>

<h2>Chapter 2</h2>
<p>This chapter explains more bla bla bla</p>

<h2>Chapter 3</h2>
<p>This chapter explains why the earlier chapters explained only bla bla bla</p>
<P> some text here to make the page scroll
for instance

Far out in the uncharted backwaters of the western spiral arm lies an small unregarded yellow sun. Orbiting this at a distance of roughly 90 million miles lies an utterly insignificant blue green planet whose ape decended life forms are so amasingly primitive that they still think digital watches are a pretty neat idea!
<BR>
From the HitchHikers Guide to the Galaxy<BR>
By Douglas Adams

<a name=”C4″><h2>Chapter 4</h2></a>
<p>This paragraph has the Anchor tag with the name attribute so when clicked ,you scroll here</p>

<h2>Chapter 5</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 6</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 7</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 8</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 9</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 10</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 11</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 12</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 13</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 14</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 15</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 16</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 17</h2>
<p>This chapter explains ba bla bla</p>

</body>
</html>

 

 

 

 

 

The above code would give us the following outcome. Take note that clicking on “See also Chapter 4” immediately brings us down the page to where Chapter 4 is.

See also Chapter 4.

 

Chapter 1

This chapter explains bla bla bla

Chapter 2

This chapter explains more bla bla bla

Chapter 3

This chapter explains why the earlier chapters explained only bla bla bla

some text here to make the page scroll for instance Far out in the uncharted backwaters of the western spiral arm lies an small unregarded yellow sun. Orbiting this at a distance of roughly 90 million miles lies an utterly insignificant blue green planet whose ape decended life forms are so amasingly primitive that they still think digital watches are a pretty neat idea!
From the HitchHikers Guide to the Galaxy
By Douglas Adams

Chapter 4

This paragraph has the Anchor tag with the name attribute so when clicked ,you scroll here

Chapter 5

This chapter explains ba bla bla

Chapter 6

This chapter explains ba bla bla

Chapter 7

This chapter explains ba bla bla

Chapter 8

This chapter explains ba bla bla

Chapter 9

This chapter explains ba bla bla

Chapter 10

This chapter explains ba bla bla

Chapter 11

This chapter explains ba bla bla

Chapter 12

This chapter explains ba bla bla

Chapter 13

This chapter explains ba bla bla

Chapter 14

This chapter explains ba bla bla

Chapter 15

This chapter explains ba bla bla

Chapter 16

This chapter explains ba bla bla

Chapter 17

This chapter explains ba bla bla

 

About Michael Boguslavskiy

Michael Boguslavskiy is a full-stack developer & online presence consultant based out of New York City. He's been offering freelance marketing & development services for over a decade. He currently manages Rapid Purple - and online webmaster resources center; and Media Explode - a full service marketing agency.

Check Also

Do More With Horizontal Lines

Chances are you probably already know about the <hr> tag available inside HTML – however ...

Like every other website, this site uses cookies to deliver to analyze our traffic. Cookies may also be utilized by our advertisers and partners. By using this website you agree to the use of said cookies. More Information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings, continuing to navigate past this message, or you click "Accept" below then you are consenting to the use of cookies on the Rapid Purple website.

Close