आप एंकर का उपयोग कर सकते हैं (<a>
) किसी भिन्न पृष्ठ या किसी भिन्न वेबसाइट से लिंक करने के लिए HTML में लिंक। लेकिन आप वेब पेज के किसी खास हिस्से से कैसे लिंक कर सकते हैं?
उत्तर है जंप लिंक ।
जंप लिंक वे लिंक होते हैं जो न केवल पृष्ठ को लोड करते हैं, बल्कि वे वेब पेज के एक विशिष्ट भाग पर "कूद" जाते हैं। आप अपनी वेबसाइट के किसी भिन्न पृष्ठ से लिंक करने के लिए आंतरिक रूप से उनका उपयोग कर सकते हैं, और आप लिंक को बाहरी रूप से साझा भी कर सकते हैं।
ये लिंक काम करेंगे चाहे उपयोगकर्ता कहीं से भी आ रहा हो, और उन्हें काम करने के लिए मूल HTML के अलावा किसी और चीज़ की आवश्यकता नहीं है।
एंकर जंप लिंक बनाना
HTML में, आप <a>
. के सेट का उपयोग करके एंकर लिंक बना सकते हैं अंदर पाठ के साथ टैग। यहां एक उदाहरण दिया गया है:
<a>Here is a link that doesn't go anywhere!</a>
लिंक लक्ष्य के लिए id विशेषता का उपयोग करें
अब, एक जम्प लिंक बनाने के लिए, हमें एक लिंक की आवश्यकता है और हमें एक लक्ष्य की आवश्यकता है। लक्ष्य वेब पेज पर कोई भी तत्व हो सकता है जिसमें "आईडी" विशेषता हो।
एच टैग जैसे <h1>
. का उपयोग करके वास्तव में एक सामान्य लक्ष्य एक शीर्षक या उपशीर्षक होगा , <h2>
, <h3>
, और इसी तरह। आम तौर पर, इन उद्देश्यों के लिए किसी भी एच टैग में आईडी जोड़ना एक अच्छा अभ्यास है।
मान लें कि हमारे पास वास्तव में एक लंबा वेब पेज है, और हम इस तरह दिखने वाले पेज के एक सेक्शन से लिंक करना चाहते हैं:
<h2 id="extra_content">Extra content we don't want to link to</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sed porta est, nec pretium lectus. Quisque sit amet porta risus, sed faucibus magna.
</p>
<h2 id="linked_content">Subheadline of a section to link to</h2>
<p>
Vivamus orci erat, sagittis vitae aliquam at, pretium sagittis neque. Curabitur vel eros in turpis elementum sollicitudin.
</p>
URL में तत्व से लिंक करें
अब जब हमारे पास हमारा लक्ष्य तत्व है, तो हम इसमें #linked_content
जोड़कर एक जम्प लिंक बना सकते हैं। पृष्ठ के URL के अंत तक। लक्ष्य की जो भी आईडी हो, उसे #
. के बाद जोड़ें (पाउंड/हैशटैग) प्रतीक।
यदि हम एक पृष्ठ पर होते और उसी पृष्ठ पर एक अनुभाग पर नीचे कूदना चाहते, तो हम एक आंतरिक लिंक बना सकते थे। एक आंतरिक लिंक के लिए https://www.WebsiteName.com
. की आवश्यकता नहीं होती है लिंक के href
. में विशेषता।
एक आंतरिक छलांग लिंक का एक उदाहरण हो सकता है:
<a href="#linked_content">Link to the subheadline on the same page</a>
क्या होगा यदि आप किसी अन्य वेबसाइट पर लिंक जोड़ रहे हैं या इसे सोशल मीडिया या ईमेल पर दूसरों के साथ साझा कर रहे हैं? #linked_content
. जोड़कर आप अब भी वही काम कर सकते हैं पूरे URL के अंत तक इस तरह:
<a href="https://www.WebsiteName.com/PageName/#linked_content">Link to the subheadline on the same page</a>
“नाम” विशेषता पर ध्यान दें
अतीत में, इस प्रकार के जंप लिंक को रिक्त एंकर लिंक पर "नाम" विशेषता का उपयोग करके लक्षित किया गया था। Mozilla Developer Network के अनुसार, HTML5 के बाद से यह प्रथा अप्रचलित है। यह अभी भी कुछ ब्राउज़रों में काम कर सकता है, लेकिन मैं अत्यधिक अनुशंसा करता हूं कि आप लिंक करने की अधिक वर्तमान विधि का उपयोग करें।
मुझे उम्मीद है कि इससे आपको वेब पेज के किसी खास हिस्से के लिए जम्प लिंक बनाने में मदद मिलेगी!