HTML Hyperlinks

What is hyperlink?

A link of some web page. If we click on the hyperlink, then the page associated with this hyperlink is open.

How to put the hyperlinks in html?

Download code

There are two methods;

  1. Relative path
  2. Absolute path

Relative path: need to put both files in one folder, so there is no need to put the full path indicating that where is file located. For example <a href=”b.html”>Click here</a>

Relative Path Example:

Step 1: store all the web pages in a same folder

how to link a web page in html

Step 2: Write the code for first page

hyperlink in a web page html
Step 3: Check the output
links in html
Step 4: Write the code for second page














hyperlinks to html

Step 5: Check the output

hyperlinking in arabic






Step 6: Open the page 1 and click on the link below

links in html

Step 7: New page appears

hyperlinking in arabic

Can i put image in separate folder and code file in separate folder?

Yes, You can  but you need to put the absolute path.

What is absolute path?

Absolute path is a full path indicating that where is file located.

For example


  • your image name is 1
  • Your image type is jpg
  • Your image is in folder (images)

Then we can put the code as follows:  <img src=”images/1.jpg” />

More examples of absolute path

  • <a href=”folder1/b.html”>Click here</a>
  • <a href=”folder1/folder2/b.html”>Click here</a>
  • <a href=”../b.html”>Click here</a>
  • <a href=”../../b.html”>Click here</a>


hyperlinks html

hyperlinking in hypext markup language