Get Started 🚀
← Back to Images Chapter
Image Types

🔗 Image as Link — Photo Pe Click Karo

<a href="..."><img src="..." alt="..."></a>

<img> ko <a> tag ke andar wrap karo — poori image clickable ho jaati hai. Jaise deewar pe poster pe click karke us event mein jaana.

alt text screen readers ke liye link description ban jaata hai. Anchor ke andar extra text mat daalo — alt kaafi hai. Image KHUD link hai.

🛺
Hyderabad Analogy: Jaise Prasads IMAX pe movie poster — tum poster dekhte ho, click karte ho (mentally), movie dekhne jaate ho. Poster KHUD movie ka link hai.

Code Example

HTML — Image as Link — Photo Pe Click Karo
<!-- Image doosre page se link kar raha hai -->
<a href="/recipes/biryani">
  <img src="biryani-poster.jpg" alt="Biryani Recipe Dekho" width="400" height="300">
</a>

<!-- Image external site se link kar raha hai -->
<a href="https://paradisebiryani.com" target="_blank">
  <img src="paradise-banner.jpg" alt="Paradise Biryani website dekho" width="600" height="200">
</a>

<!-- Logo homepage se link kar raha hai -->
<a href="/">
  <img src="logo.svg" alt="Homepage pe jao" width="120" height="40">
</a>

<!-- GALAT — extra text mat daalo -->
<a href="/recipes/biryani">
  <img src="biryani.jpg" alt="Biryani Recipe Dekho">
  <span>Click here</span>  <!-- ❌ Yeh hata do -->
</a>
<a href="...">Anchor image ko wrap karta hai — clickable banata hai
<img> inside <a>Image link content ban jaata hai
alt="View..."Alt text LINK KA destination describe karta hai, sirf image nahi
No extra text"Click here" mat daalo — alt kaafi hai screen readers ke liye

✅ When to Use

  • Logo ko homepage se link karna
  • Banner images ko promo pages se link karna
  • Thumbnail images ko full article se link karna
  • Gallery images ko full-size version se link karna

❌ When NOT to Use

  • Jab sirf image ka kuch hissa clickable hona chahiye (image map use karo)
  • Jab image AUR text dono link hon (dono <a> ke andar daalo)
💡
Image links ke liye alt text ko link description jaise likho: "Biryani Recipe Dekho" sirf "Biryani" nahi. Screen readers isse link announce karte hain — "Link: Biryani Recipe Dekho" — bahut achha "Link: Biryani" se zyada.
← Back to Images Chapter