HTML डॉक्यूमेंट में लिंक कैसे बनाये। टैग ए - इसके सिंटैक्स और विशेषताएँ

  1. इंटरनेट पर किसी पृष्ठ का URL या "पता"
  2. <A> टैग और इसका मूल सिंटैक्स
  3. पूर्ण और सापेक्ष संदर्भ
  4. वर्तमान से अधिक निर्देशिका के सापेक्ष संबंध
  5. <A> टैग की विशेषताएँ। नई विंडो में संदर्भ द्वारा कोई दस्तावेज़ कैसे खोलें
  6. शीर्षक लिंक। <A> टैग के लिए शीर्षक विशेषता
  7. हाइपरलिंक nofollow विशेषता। साइट के "ट्रस्ट" के हस्तांतरण का निषेध
  8. दस्तावेज़ के अंदर आंतरिक लिंक या लंगर
  9. लिंक एंकर - चित्र
  10. विस्तार

संदर्भ (या हाइपरलिंक्स) रक्त वाहिकाओं की तरह इंटरनेट की अनुमति देता है। यदि कोई लिंक नहीं थे, तो कोई इंटरनेट नहीं होगा।

HTML डॉक्यूमेंट में लिंक कैसे बनाएं और इसकी विशेषताओं को सही तरीके से दर्ज करें, URL क्या है और Search Engines लिंक से कैसे संबंधित हैं - शुरुआती जानने के लिए HTML सीखने के इस अगले पाठ में।

इंटरनेट पर किसी पृष्ठ का URL या "पता"

वेब पर प्रत्येक HTML दस्तावेज़ का अपना "सटीक पता" होता है। इसे अंग्रेजी से "URL" कहा जाता है। URL - यूनिफ़ॉर्म रिसोर्स लोकेटर

URL संरचना अक्सर ब्राउज़र के एड्रेस बार में दिखाई देती है। इसमें शामिल हैं:

  1. प्रोटोकॉल नाम http: // या https: // है
  2. साइट डोमेन
  3. फ़ोल्डर या फ़ोल्डर जहाँ यह दस्तावेज़ स्थित है, पथ
  4. फ़ाइल नाम (हमेशा नहीं हो सकता है)।

इस "सटीक पते" के लिए धन्यवाद, इस दस्तावेज़ को किसी अन्य दस्तावेज़ के पाठ से संदर्भित करना संभव हो गया।

<A> टैग और इसका मूल सिंटैक्स

मुझे उम्मीद है कि शब्द "सिंटैक्स" अब आपको डराता नहीं है synt

<a href="http://domen-saita.ru/papka-na-servere/dokument.html "लिंक लिंक </a>

जैसा कि आप देख सकते हैं, <A> टैग की शुरुआत के बाद, एक अनिवार्य href विशेषता होनी चाहिए जो उस दस्तावेज़ के पते को निर्दिष्ट करती है जिस पर आप जाना चाहते हैं।

<A> कंटेनर टैग के अंदर स्वयं एक पाठ है (हालांकि कोई चित्र हो सकता है), जो लिंक का पाठ है। इसे " एंकर " या बस - एंकर भी कहा जाता है।

पूर्ण और सापेक्ष संदर्भ

उपरोक्त उदाहरणों में, पूर्ण संदर्भों का उपयोग किया गया था। जिनमे डॉक्यूमेंट का पूरा URL होता है

कुछ मामलों में, href विशेषता में प्रोटोकॉल और साइट के डोमेन के नाम के साथ एक पूर्ण URL नहीं होता है। यदि दस्तावेज़ जिस लिंक पर जाता है, उसी साइट पर है - आप उस स्थान से अग्रणी लिंक का उपयोग कर सकते हैं जहां दस्तावेज़ स्थित है।

सापेक्ष संदर्भ लागू होने पर योजना

उदाहरण: first.html दस्तावेज़ से एक लिंक दूसरी html फ़ाइल की ओर जाता है, जो समाचार फ़ोल्डर में स्थित है।

वर्तमान से अधिक निर्देशिका के सापेक्ष संबंध

कोड:

<a href="../first.html"> यह निर्देशिका स्तर एक में एक फ़ाइल के लिए एक रिश्तेदार लिंक है </a>

यह लिंक "पैरेंट" डायरेक्टरी में फ़ाइल को पहले html में ले जाता है, अर्थात एक स्तर ऊपर

संयोजन ../ फ़ाइल के दिए गए स्थान से एक फ़ोल्डर को इंगित करता है जिसमें लिंक बनाया जा रहा है।

<A> टैग की विशेषताएँ। नई विंडो में संदर्भ द्वारा कोई दस्तावेज़ कैसे खोलें

दस्तावेज़ के लिए एक नया ब्राउज़र टैब खोलने के लिए, आपको विशेषता लक्ष्य = "_ रिक्त" का उपयोग करने की आवश्यकता है

दस्तावेज़ के लिए एक नया ब्राउज़र टैब खोलने के लिए, आपको विशेषता लक्ष्य = _ रिक्त का उपयोग करने की आवश्यकता है

लिंक लक्ष्य संलग्न करें = "_ रिक्त"

इसका दुरुपयोग न करें। इस विशेषता के साथ साइट पर आंतरिक लिंक बनाने की आवश्यकता नहीं है। उपयोगकर्ता "स्पार्किंग विंडो" से परेशान होंगे।

सामान्य तौर पर, इस लक्ष्य विशेषता के साथ - पूरी कहानी। अभी भी इसके कई अर्थ हैं, लेकिन उन सभी का उपयोग आज शायद ही कभी किया जाता है।

ऐसा इसलिए है क्योंकि वे फ्रेम पर साइट के साथ काम करने के लिए डिज़ाइन किए गए हैं जो अब लोकप्रिय नहीं हैं और एचटीएमएल 5 के आगमन के साथ, अतीत की बात बन रहे हैं।

शीर्षक लिंक। <A> टैग के लिए शीर्षक विशेषता

एक अन्य उपयोगी विशेषता है शीर्षक = "यह व्याख्या करते हुए पाठ कि यह लिंक कहाँ जाता है"

वाक्य रचना:

<a href="http://domen-saita.ru/papka-na-servere/dokument.html" title="the pop-up hint"> यह एक संकेत लिंक है </a>

जैसा कि आप देख सकते हैं, ब्राउज़र इसे एक टूल टिप के रूप में प्रदर्शित करता है। और फिर भी, यह खोज इंजनों को ध्यान में रखता है।

लिंक शीर्षक के लिए संकेत दें

हाइपरलिंक nofollow विशेषता। साइट के "ट्रस्ट" के हस्तांतरण का निषेध

लिंक rel = "nofollow" के लिए एक और अस्पष्ट विशेषता है

वह खोज इंजन को बताता है कि लिंक दस्तावेज़ भरोसेमंद नहीं हो सकता है। उसी समय, स्रोत साइट से ट्रस्ट ("ट्रस्ट") संकेतक को संदर्भ द्वारा साइट पर प्रेषित नहीं किया जाता है।

"ट्रस्ट" और लिंक रैंकिंग का विषय अभी भी आगे है, लेकिन अगर यह छोटा है, तो खोज इंजन में साइटों का "भाग्य" भी इस साइट पर जाने वाले लिंक की संख्या पर निर्भर करेगा। उनमें से अधिक, अधिक आधिकारिक साइटें लिंक - संदर्भ द्वारा साइट की अधिक विश्वसनीयता।

कुछ मामलों में, यह इस विशेषता के साथ "स्क्रीनिंग" लिंक के लायक है। उदाहरण के लिए, यदि आप किसी सेवा के बारे में नकारात्मक समीक्षा लिखते हैं।

<a href="http://bad-sait.ru/dokument.html" rel="nofollow"> खराब साइट </a>

दस्तावेज़ के अंदर आंतरिक लिंक या लंगर

बड़े ग्रंथों में, दस्तावेज़ के तार्किक भागों में तथाकथित "एंकर" की स्थापना अक्सर आवश्यक होती है। फिर, यह इस जगह पर है, आप उल्लेख कर सकते हैं।

इसका उपयोग करने का सबसे आसान तरीका हाइपरलिंक से सामग्री की एक स्थानीय तालिका बनाना है जो इन एंकरों तक ले जाती है। सामग्री की ऐसी तालिकाओं को आमतौर पर लेख की शुरुआत में रखा जाता है।

ऐसा एंकर बनाते समय, href विशेषता के बजाय नाम विशेषता का उपयोग किया जाता है।

लंगर बनाने का सिंटैक्स है:

<a name="top"> </a>

लिंक बनाते समय, URL के अंत में साइन # के माध्यम से जोड़ें - "एंकर" का नाम:

<p> <a href="#top"> शीर्ष </a> </ p>

संक्रमण बिल्कुल इस जगह पर होगा, अर्थात ब्राउज़र इस जगह को उसके ऊपरी दृश्य भाग में रखेगा।

अक्सर, लंबे दस्तावेज़ों में, बहुत नीचे वे इस तरह के एक लिंक "टॉप" डालते हैं।

... सुगंधित अनाज की दुनिया भर में यात्रा करने के बाद, उन्होंने उन लोगों की उच्चतम गुणवत्ता पाई जिनके लिए अफ्रीका, एशिया, मध्य और दक्षिण अमेरिका प्रसिद्ध हैं। इसलिए, आज ब्रांड के कॉफी घरों में कॉफी बीन आपको मान्यता प्राप्त निर्माताओं से सबसे अच्छी कॉफी किस्में मिलेंगी।

? ऊपर तक ?

किसी अन्य दस्तावेज़ से, आप इस स्थान से बाहर भी निकल सकते हैं, यदि आप URL के अंत में साइन # name_ के माध्यम से जोड़ते हैं

<a href="http://domen-saita.ru/dokument.html#top"> लिंक पाठ इस दस्तावेज़ में एक लंगर "शीर्ष" की ओर जाता है </a>

लिंक एंकर - चित्र

कोई भी छवि एक कड़ी हो सकती है।

कोड:

<a href="http://sait.ru/dokument.html"> <img src = kartinka.jpg "चौड़ाई =" 100 "ऊंचाई =" 131 "/> </a>

डिफ़ॉल्ट रूप से, लिंक को ठोस नीली रेखा के साथ ब्राउज़र द्वारा रेखांकित किया जाता है, और लिंक-चित्रों को नीला फ्रेम मिलता है।

लिंक्स-तस्वीरों में एक नीला फ्रेम मिलता है

इससे छुटकारा पाने के लिए, साइट के लिए CSS फ़ाइल में एक सरल नियम जोड़ा गया है:

एक {सीमा: 0px;}

यह सभी छवि लिंक के लिए बॉर्डर की मोटाई शून्य बनाने के लिए एक निर्देश है।

विस्तार

अगली पोस्ट में, मैं बुरे स्पैमर से ईमेल लिंक, उनकी विशेषताओं और "संरक्षण" के तरीकों के बारे में बात करूंगा