Hyperlink in HTML
Great! Here’s a clear explanation of "Working with Hyperlinks in HTML", along
with a real-life example to help you explain it in class.
✅ What is a Hyperlink in HTML?
A hyperlink (or simply a link) allows users to navigate from one page or
resource to another — either within the same website or to an external site.
In HTML, hyperlinks are created using the `<a>` tag (short for "anchor").
🔧 Basic Syntax of a Hyperlink
<a href="URL">Link Text</a>
`href` (Hypertext REFerence): The destination URL (where the link goes).
`Link Text`: The clickable text users see on the webpage.
🌐 Real-Life Example
Imagine you are creating a personal portfolio website. On your homepage, you want to
add a link to your LinkedIn profile and to another internal page like "Contact Me".
Example Code:
🚀 Powered by ChatGPT Exporter 1/5
<!DOCTYPE html>
<html>
<head>
<title>My Portfolio</title>
</head>
<body>
<h1>Welcome to My Portfolio</h1>
<!-- External link to LinkedIn -->
<p>Visit my <a href="[Link]
target="_blank">LinkedIn Profile</a>.</p>
<!-- Internal link to [Link] -->
<p>Want to get in touch? <a href="[Link]">Contact Me</a></p>
</body>
</html>
🧠 Explanation of the Example:
1. External Link:
Clicking on “LinkedIn Profile” opens your LinkedIn page in a new tab
(because of `target="_blank"`).
2. Internal Link:
Clicking on “Contact Me” takes the user to `[Link]`, another page in
the same website.
🗒️ Extra Tip (Optional to Add in Class):
🚀 Powered by ChatGPT Exporter 2/5
You can also link to specific sections on a page using anchor IDs:
<a href="#about">Go to About Section</a>
<!-- Somewhere later on the page -->
<h2 id="about">About Me</h2>
Would you like a simple slide or diagram to help explain this in class visually?
Sure! Here's a simple 2–3 minute classroom script in easy language that you can use
to explain working with hyperlinks in HTML to your classmates:
🎤 Classroom Script: "Working with Hyperlinks in HTML"
"Good morning everyone!
Today, I will explain how hyperlinks work in HTML in a very simple way.
First, what is a hyperlink?
A hyperlink is a clickable text or image that takes us from one page to another. You all
use it every day — like when you click on a link in Google search, or when you click on
'Contact Us' on a website.
In HTML, we use the `<a>` tag to create a link. It looks like this:
<a href="URL">Link Text</a>
Let me break it down:
The `<a>` tag is called the anchor tag.
🚀 Powered by ChatGPT Exporter 3/5
The `href` attribute means hyperlink reference — this is where we put the link
we want to go to.
The text between the tags is what the user clicks.
For example:
<a href="[Link] to Google</a>
If I put this in my webpage, and someone clicks ‘Go to Google’, it will open Google.
Now, there are two types of links:
1. External links – these go to other websites, like Google or YouTube.
2. Internal links – these go to other pages of your own website, like a contact page.
Example of internal link:
<a href="[Link]">Contact Me</a>
You can also use a small extra part like `target="_blank"` to open the link in a new
tab. Like this:
<a href="[Link] target="_blank">LinkedIn</a>
So to sum up:
Use the `<a>` tag
Set the `href` to the page you want
Put link text inside the tag
That’s how hyperlinks work in HTML. Thank you!"
🚀 Powered by ChatGPT Exporter 4/5
Let me know if you'd like a version in Hindi or with a visual chart to show in class.
🚀 Powered by ChatGPT Exporter 5/5
