हाइपरलिंक क्या है? HTML Link के Types और उनके उपयोग

Hyperlink क्या है? लिंक किसे कहते हैं? आइये इसके बारे में विस्तार से चर्चा करते हैं।

जैसा कि हम सभी जानते हैं कि कई सारे pages से मिलकर एक website बनता है और ये सारे pages HTML links के माध्यम से ही एक-दूसरे से connected होते हैं।

आपने देखा होगा लगभग सभी websites में एक menu होता है जिस पर click करके हम दूसरे pages तक पहुँचते हैं ठीक ऐसा ही menu आप ऊपर इस पेज में भी देख सकते हैं, तो ये सारे menus HTML links से ही बनाये जाते हैं। HTML में बनाये गये links को ही हाइपरलिंक कहा जाता है।

जब आप Google में कुछ search करते हैं तब वहां भी आपको result वाले पेज में कई सारे links दिखाई देते है जिसपर click करके आप सम्बंधित site तक पहुंचते हैं, तो कहने का मतलब ये कि हम बिना link के internet पर अपनी मनचाही जानकारी हासिल नही कर सकते। इससे पता चलता है कि ये links कितने important हैं।

आईये जानते हैं की ये link क्या है? Hyperlink किसे कहते हैं? और ये कितने प्रकार के होते हैं?

जरूर पढ़ें : सिर्फ 20 minute में सीखें HTML – Tutorial in Hindi

हाइपरलिंक क्या है? Link क्या होता है?

हाइपरलिंक (Hyperlink) या link एक प्रकार का text होता है जिसे HTML द्वारा बनाया जाता है। जब इस पर click किया जाता है तो browser हमें किसी दुसरे web page पर लेकर जाता है।

क्लिक करने पर कौन सा पेज open होगा यह HTML के code से तय होता है जिसमे हम उस पेज के URL यानि address का उपयोग करते हैं।

लिंक बनाने के लिए आपको HTML की जानकारी होनी चाहिए। इसके लिए आप हमारी पोस्ट: HTML क्या है? इसे कैसे सीखें? जरुर पढ़ें।

HTML में Link कैसे बनायें?

लिंक कैसे बनाया जाता है इसे समझने के लिए आप सबसे पहले दो तीन html page बनाकर एक folder में save कर लें और किसी एक पेज को notepad (या किसी code editor) में open करें और उसमें नीचे दिये तरीके से लिंक बनाने का अभ्यास करें।

लिंक बनाने के लिये हमको anchor tag <a> की जरूरत पडती है जिसका एक example नीचे देख सकते हैं:

<a href="contact.html" title="visit my contact page" target="_self">Contact </a>

  <a> Tag के Attributes

Anchor tag (<a>) में मुख्य रूप से तीन attributes उपयोग होते हैं जो की इस प्रकार हैं:

1. href: इस attribute से target page यानि कि link पर क्लिक करने पर कौन सा पेज open होगा उसका url या address बताते हैं।

ऊपर मैंने एक link बनाया जिसपर क्लिक करने पर contact पेज खुलेगा, href=”contact.html” लिखा क्योंकि contact.html वाला पेज same location (folder) पर है। अगर आप किसी दूसरी website के पेज को लिंक करना चाहते हैं तो आपको उसका पूरा address लिखना होगा।

2. title: जब visitor हमारे लिंक पर hover करेगा यानि की जब cursor link के ऊपर आयेगा तो title में हमने जो लिखा है show हो जायेगा।

3. target: इससे हम browser को ये बताते हैं कि हमारा link कहां open होगा। अगर आप इसका उपयोग ना करें तो लिंक same browser window या tab में open होगा। इसके कुछ और भी values हो सकते हैं जो इस प्रकार है:

•  _blank : इससे पेज एक नये tab या window पर open होता है (जो आपके browser की setting पर depend करता है)

•  _parent: ये पुराने जमाने में use होता था जब frames का उपयोग किया जाता था लेकिन अब ये न के बराबर काम आता है।

HTML Link के Types:

Link के कई सारे प्रकार होते हैं जिनमे से कुछ नीचे दिये गये हैं:

• Local : same location के page को link किया जाता है
• Internal: page-jump यानि उसी पेज के अलग-अलग sections को लिंक करते हैं
• External: किसी दूसरी site के पेज को लिंक करने के लिये
• Download: किसी फ़ाईल को download कराने के लिये
• E-mail: visitor के system उपलब्ध email program को open करता है

Local link:

Same server, directory, folder या same location पर उपलब्ध पेज को लिंक किया जाता है। जैसे:

<a href="contact.html" title="visit my contact page">Contact </a>

यहां पर हमार पेज contact.html same folder में save किया गया है।

Internal link:

इसे page-jump भी कहते हैं, आपने देखा होगा कई सारे वेबसाइट में सबसे नीचे back to top या top का लिंक होता है जिस पर क्लिक करते ही cursor पेज के सबसे top में चला जाता है। इसे बनाना बहुत ही आसान है इसके लिये आपको दो simple steps follow करने पडेंगे:

Example: हम पेज के सबसे top में एक point create करेंगे और point का नाम रखेंगे top, कुछ इस तरह:

<a name="Top"></a>

अब page के सबसे bottom में एक लिंक बनायेंगे

<a herf="#Top">Goto Top</a>

अब जब भी Go to Top link पर click करेंगे तो पेज के सबसे top position पर पहुंच जायेंगे।

External link:

Internet उपलब्ध किसी भी पेज को लिंक करने के लिये हमें उस page के URL की जरूरत पडेगी।

<a href="url for the website">Click Here</a>

उदहारण:

<a href=www.webinhindi.com>Click Here to visit WebinHindi Website</a>

Download link:

यह local और external link जैसा ही होता है अंतर बस यही होता है कि इसमें page के url की जगह किसी file का address डाला जाता है जिससे लिंक पर क्लिक करने से वह file download होने लगता है।
उदहारण:

<a href="file_url.zip">Click here to download this file</a>

E-mail link:

अगर आप चाहते हैं कि आपका visitor आपको e-mail के जरिये संपर्क कर सके तो इसके लिये आप अपने website में e-mail link दे सकते हैं।

इस प्रकार के लिंक पर जब visitor क्लिक करता है तब उसके system में उपलब्ध कोई e-mail software जैसे Outlook Express आदि हो तो open हो जाता है और उसमे हमारा e-mail address, subject, cc, bcc आदि automatic fill हो जाते हैं।
Example:

<a href=mailto:[email protected]?subject='email from the web-site' &[email protected]&[email protected]>Contact Us</a>

Hyperlink के Color को कैसे बदलें

लिंक्स के color अलग-अलग हो सकते हैं ये depend करता है browser की setting पर लेकिन अगर आप आपके पेज के link colors को अपने हिसाब से दिखाना चाहते हैं तो आप <body> tags में कुछ attributes डालकर ऐसा कर सकते हैं।

इसके लिये तीन तरह के attributes होते हैं:

• LINK: जिस link पर visit नही हुआ है उसका कलर
• VLINK: Visited link, जिसपर पहले से click किया जा चुका है उसका color change करने के लिये
• ALINK: Active link color, जब हम किसी लिंक पर click किये होते हैं तो वह active state में होता है

आप इसका example निचे देख सकते हैं:

<body link="#FFCC33" vlink="#FF3333" alink="#00FF00"> 
पेज के HTML Codes 
</body>

ध्यान रहे <body> tag एक page में सिर्फ़ एक बार लगाया जा सकता है, इसलिये एक से ज्यादा बार इसका प्रयोग न करें।

अगर आप अलग-अलग लिंक को अलग-अलग रंग देना चाहते हैं तो आप CSS का उपयोग कर ऐसा कर सकते हैं।

आगे पढ़ें:

• WWW क्या है? क्या वर्ल्ड वाइड वेब इंटरनेट से अलग है?
• वेबसाइट क्या है? Static और Dynamic Website में क्या अंतर है?
• ब्लॉग क्या है? लोग blogging क्यों करते हैं? इसके क्या फायदे हैं?
• Protocol क्या हैं? ये कितने प्रकार के होते हैं?

Conclusion – Link क्या है?

Link को ही Hyperlink कहते हैं यह वेब पेज के अंदर किसी अन्य पेज को जोड़ने के लिए उपयोग होता है। हाइपरलिंक बहुत ही महत्वपूर्ण है इसके बिना हम वेबसाइट के पेजेज को एक-दुसरे से जोड़ नही सकते।

अभी आपने पढ़ा लिंक क्या होता है? HTML Link के Types और उनके उपयोग जिसमे हमने html में हाइपरलिंक के types के बारे में जाना और उनको coding करके बनाना सीखा हमें उम्मीद है आपको यह article पसंद आया होगा, आप comment के माध्यम से अपने विचार हमे बता सकते हैं|