Creating hyperlink|HTML|TechHunter

Hyperlinks are really important — they are what makes the Web a web. This article shows the syntax required to make a link, and discusses link best practices.

Prerequisites:

Basic HTML familiarity,as covered in getting started with HTML. HTML text formatting, as covered in HTML text fundamentals.

Objective:

To learn how to implement a hyperlink effectively, and link multiples files together

What is a hyperlink?

Hyperlinks are one of the most exciting innovations the Web has to offer. Well, they've been a feature of the Web since the very beginning, but they are what makes the Web a Web— they allow us to link our documents to any other document (or other resource) we want to, we can also link to specific parts of documents, and we can make apps available at a simple web address (contrast this to native apps, which have to be installed and all that business.) Just about any web content can be converted to a link, so that when clicked (or otherwise activated) it will make the web browser go to another web address (URL).

The BBC homepage, for example, contains a large number of links that point not only to multiple news stories, but also different areas of the site (navigation functionality), login/registration pages (user tools) and more.

frontpage of bbc.co.uk, showing many news items, and navigation menu functionality Anatomy of a link

A basic link is created by wrapping the text (or other content, see Block level links) you want to turn into a link inside an <a> element, and giving it an href attribute (also known as a Hypertext Reference , or target) that will contain the web address you want the link to point to.

<P>creating a link. <a> href="https:// www.techhunter.blogspot.com</p>

This gives us the following result:

I'm creating a link to the TechHunter homepag.

Adding supporting information with the title attribute

Another attribute you may want to add to your links is title; this is intended to contain supplementary useful information about the link, such as what kind of information the page contains, or things to be aware of. For example:

<P>I'm creating a link to

<a href="https://www.techhuntersai.blogspot.com/"

title="the best place to find more info about tech hunter</a></p>

This gives us the following result (the title will come up as a tooltip when the link is hovered over):

I'm creating a link to the TechHunter

Active learning: creating your own example link

Active learning time: we'd like you to create an HTML document using your local code editor (our getting started template would do just fine.)

Inside the HTML body, try adding one or more paragraphs or other types of content you already know about.
Turn some of the content into links.
Include title attributes.

Block level links

As mentioned before, you can turn just about any content into a link, even block level elements. If you had an image you wanted to turn into a link, you could just put the image between <a></a> tags.