Now you might be wondering how the website works and takes us from one webpage to another. The webpages are linked with a hypertext reference. Linking webpages is one of the most basic thing to build a website, we keep referencing all the pages from one set to another. Now lets have a look at an example below.
In the below example the about.html file is linked in the index.html (index.html file is suppose to be the main indexing file. Basically, it is like the index of a novel which directs you to the right page number.)
We can not only link 2 web pages but also link images and other files.
<!--Save this file in the same folder as about.html
about.html is below this code -->
<!DOCTYPE html>
<html>
<head>
<title>Links and Images</title>
</head>
<body>
<center><h1>Hyperlinks</h1></center>
<h2>Examples of Hyperlinks</h2>
<p></p>
<a href="about.html">About Us</a><br><hr>
<!--This is a link with URL which works locally without internet-->
<a href="Logo.jpg">Electronics Simplified</a><br><hr>
<!--This is a local file link which works while not connected to the internet-->
<a href="www.electronicssimplified.in">Electronics Simplified</a>
<!--This is a url that will work while you are connected to the internet-->
</body>
</html><!DOCTYPE html>
<html>
<head>
<title>About</title>
</head>
<body>
<p>You have learned how to link 2 files</p>
<!--We must learn how to link the index.html
in this file in order to complete the activity-->
</body>
</html>Things to note while hyper referencing:
- Note that the links are case sensitive.
- The path inside the src=”” should be correct.
- The files should be present in the correct folder.
Incase you are unable to do the reference please check the above points.
Try to complete the activity to link an online link and also try to use an image in the hyperlink as shown in the index.html file.