Links
🏠The everyday picture
Signposts. One says "Library, 200 m" (somewhere in this town); another says "Delhi, 1,000 km" (somewhere far away). Links are the web's signposts, and the "hyper" in HyperText.
📘What it really is
-
A link uses the
<a>(anchor) element with anhrefattribute saying where it goes:<a href="about.html">About me</a>. -
Relative links point to pages in your own site, using the paths from Module 8:
about.html,blog/first-post.html,../index.html. -
Absolute links point to other sites, with the full address:
<a href="https://prolearners.in">. -
Links within a page jump to an element with an
id:<a href="#contact">jumps to<section id="contact">. -
Email and phone links:
href="mailto:hello@example.com"andhref="tel:+919800000000"open the mail or phone app. Remember these are public: anyone (and spam bots) can read them. -
Link text should make sense on its own: "Read the booking rules", not "click here". Screen-reader users often hear a list of links with no surrounding text.
-
target="_blank"opens a new tab. Use it rarely; people can choose that themselves.
🖱️Try it
Create a second page, about.html, with the same skeleton and an <h1>. On index.html, add
<a href="about.html">More about me</a>. On about.html, add a link back home. Click between them in your
browser.
✅Quick check
*Your link href="About.html" works on your Windows laptop but breaks on the server. The file is
Show the answer
about.html. Why?*
Most web servers treat upper and lower case as different. Keep file names and links in lowercase.
Why is "click here" bad link text?
Show the answer
It says nothing about where the link goes, especially to someone hearing a list of the page's links.