HTML में कैसे वेबसाइट प्रतीक जोड़ें

HTML में वेबसाइट प्रतीक (Favicon) जोड़ने का सीखें (Favicon)。

HTML में कैसे वेबसाइट प्रतीक जोड़ें

वेबसाइट प्रतीक (favicon) ब्राउज़र टैब में पृष्ठ शीर्षक के बगल में दिखाया जाने वाला छोटा इमेज़ है।

आप अपनी पसंद की कोई भी इमेज़ को वेबसाइट प्रतीक के रूप में इस्तेमाल कर सकते हैं। आप ऐसे वेबसाइटों जैसे https://favicon.cc पर अपने वेबसाइट प्रतीक को भी बना सकते हैं।

सूचना:वेबसाइट प्रतीक एक छोटा इमेज़ है, इसलिए यह उच्च कंट्रास्ट वाला साधारण इमेज़ होना चाहिए।

वेबसाइट प्रतीक (favicon) ब्राउज़र टैब के पृष्ठ शीर्षक के बाईं ओर दिखाया जाता है, जैसा कि नीचे दिया गया है:

वेबसाइट आइकन का उदाहरण

अपने वेबसाइट में वेबसाइट प्रतीक जोड़ने के लिए, अपने वेब सर्वर के रूट डिरेक्ट्री में अपने वेबसाइट प्रतीक इमेज़ को सहेजें या रूट डिरेक्ट्री में एक नाम "images" की फ़ोल्डर बनाएं और अपने वेबसाइट प्रतीक इमेज़ को इस फ़ोल्डर में सहेजें। वेबसाइट प्रतीक इमेज़ का सामान्य नाम "favicon.ico"।

अगले, "index.html" फ़ाइल में, <title> एलीमेंट के बाद एक जोड़ें <link> इस तरह के एलीमेंट, जैसा कि नीचे दिया गया है:

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

स्वयं प्रयास करें

अब, "index.html" फ़ाइल को सहेजें और ब्राउज़र में फिर से लोड करें। आपके ब्राउज़र टैब को अब पृष्ठ शीर्षक के बाईं ओर आपके वेबसाइट के प्रतीक दिखाना चाहिए।