Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> HTML

HTML rel=noopener विशेषता का उपयोग कैसे करें (सुरक्षा के लिए महत्वपूर्ण)

rel="noopener" विशेषता जानने के लिए सबसे महत्वपूर्ण HTML विशेषताओं में से एक है क्योंकि यह सीधे बाहरी लिंक सुरक्षा . को प्रभावित करती है एंकर लिंक पर जो target="_blank" . का उपयोग करते हैं विशेषता।

target="_blank" लिंक को एक नए ब्राउज़र टैब में खोलता है।

यहां rel="noopener" . के साथ लिंक का एक उदाहरण दिया गया है विशेषता:

<a href="https://www.youtube.com" rel="noopener" target="_blank"
  >Link to youtube.com</a
>

कैसे rel="noopener" काम करता है

जब आप rel="noopener" add जोड़ते हैं आपकी वेबसाइट के बाहरी लिंक पर (target="_blank . के साथ) ), यह आपके द्वारा लिंक की गई वेबसाइट को आपके पृष्ठ . तक पहुंच प्राप्त करने से रोकता है विंडो ऑब्जेक्ट के माध्यम से (window.opener . के माध्यम से) संपत्ति)।

अनुवाद: यदि आपके द्वारा संदर्भित पृष्ठ में दुर्भावनापूर्ण कोड है, तो वह पिछले दरवाजे का उपयोग कर सकता है (window.opener ) आपके उपयोगकर्ता के ब्राउज़र को हाईजैक करने के लिए, और उदाहरण के लिए उन्हें एक खतरनाक फ़िशिंग वेबसाइट पर रीडायरेक्ट करने के लिए, जो उनकी जानकारी चुराती है या उनके कंप्यूटर पर मैलवेयर इंस्टॉल करती है।

यही कारण है कि वर्डप्रेस स्वचालित रूप से rel="noopener" जोड़ता है एक नए ब्राउज़र टैब में खुलने वाले सभी बाहरी लिंक पर विशेषता (target="_blank" का उपयोग करके विशेषता) — यह सुरक्षा कारणों से है।

मेरा सुझाव है कि आप भी ऐसा ही करें, भले ही आपके पास किसी भी प्रकार की वेबसाइट क्यों न हो, क्योंकि इसका उपयोग करने के नुकसान की तुलना में अधिक लाभ हैं।

rel="noopener" and SEO

खुशखबरी, rel="noopener" आपके SEO पर कोई प्रभाव नहीं पड़ता है।

noopener का उपयोग करने के नुकसान

मुझे पता है कि केवल नकारात्मक पक्ष यह है कि rel="noopener" इंटरनेट एक्सप्लोरर 11 सपोर्ट नहीं है।

मैं इसके बारे में ज्यादा चिंतित नहीं हूं क्योंकि:

  1. IE11 जल्द ही इतिहास बन गया है (Microsoft इसे छोड़ रहा है)।
  2. यदि आपका साइट विज़िटर IE11 का उपयोग करता है, तब भी वे आपके लिंक rel="noopener" पर क्लिक कर सकते हैं विशेषता अभी प्रभावी नहीं होगी।

इसके अलावा, एक जिम्मेदार वेबसाइट स्वामी के रूप में, आपको इस बात से सावधान रहना चाहिए कि आप किसी भी तरह बाहरी रूप से किससे लिंक करते हैं। अपने उपयोगकर्ताओं को उन वेबसाइटों पर न भेजें जिन पर आपको भरोसा नहीं है, और यह सुरक्षा समस्या न के बराबर हो जाती है।

वैकल्पिक 1:"noreferrer" का उपयोग करें

यदि आप Internet Explorer उपयोगकर्ताओं के बारे में चिंतित हैं, तो आप noreferrer . जोड़ सकते हैं आपके एंकर लिंक के लिए विशेषता मान (जो समर्थित है) इस तरह:

<a href="https://www.youtube.com" rel="noopener noreferrer" target="_blank"
  >Link to youtube.com</a
>

"noreferrer" विशेषता HTTP हेडर से रेफ़रल जानकारी को हटाकर रेफ़रलकर्ता (आप) को लक्ष्य वेबसाइट (जिससे आप लिंक करते हैं) को जानकारी भेजने से रोकती है।

rel="noreferrer" वेबसाइट विश्लेषिकी पर प्रभाव पड़ेगा क्योंकि जिन वेबसाइटों से आप लिंक करते हैं उन्हें यह नहीं पता होगा कि आप उनसे लिंक करते हैं, जो आपके उनके साथ हो सकने वाले किसी विशिष्ट व्यावसायिक समझौते को नुकसान पहुंचा सकता है।

तो इसे अपने विवेक से करें।

rel="noreferrer" and SEO

बहुत से लोग जो मानते हैं उसके विपरीत, rel="noreferrer" आपके SEO को सीधे तौर पर प्रभावित नहीं करता है, कम से कम इसके लिए कोई सबूत नहीं है। लेकिन जैसा कि ऊपर उल्लेख किया गया है, यह डेटा एकत्र करने/विश्लेषिकी में हस्तक्षेप करेगा, जो आपकी विशिष्ट स्थिति के आधार पर अन्य/अप्रत्यक्ष तरीकों से आपको नुकसान पहुंचा सकता है।

भ्रमित न करें noreferrer या noopener nofollow . के साथ विशेषता (जो 100% SEO को प्रभावित करेगी)।

वैकल्पिक 2:target="_blank" का उपयोग न करें

आप बस target="_blank" . का उपयोग करना बंद भी कर सकते हैं अपने एंकर लिंक पर विशेषता, और फिर आपको इसके बारे में चिंता करने की ज़रूरत नहीं है।

बिना target="_blank" . के जैसे ही वे उस पर क्लिक करेंगे, आपकी वेबसाइट का प्रत्येक लिंक उपयोगकर्ता को आपकी वेबसाइट से दूर उस वेबसाइट पर ले जाएगा जिससे आप लिंक करते हैं।

हालांकि, सावधान रहें कि target="_blank" . का उपयोग न करने से यह आपके एसईओ को नकारात्मक रूप से प्रभावित कर सकता है और शायद प्रभावित करेगा, विशेष रूप से आपकी बाउंस दर।

यह मेरी राय में विशेष रूप से एक ट्यूटोरियल के अंदर करने के लिए एक बुरा विचार है, जहां उपयोगकर्ता उस वेबसाइट पर किसी चीज़ से विचलित हो सकता है जिसे आप उन्हें संदर्भित करते हैं और अंत में आपकी साइट के बारे में भूल जाते हैं।

आप तर्क दे सकते हैं कि यदि आपके पाठक को आपकी सामग्री के बारे में भूलने के लिए केवल बाहरी लिंक लेता है, तो शायद यह पहली जगह में उतना अच्छा नहीं है। यह सच हो सकता है, लेकिन यह भी हो सकता है कि लोग आसानी से विचलित हो जाते हैं, आम तौर पर, और अक्सर उनके लाभ के लिए नहीं।

यह कोई श्वेत-श्याम विषय नहीं है और मैं वैकल्पिक दृष्टिकोण के लिए तैयार हूं।

संसाधन

बाहरी लिंक के साथ सुरक्षा समस्याओं के बारे में और पढ़ें


  1. HTML में आवश्यक विशेषता का उपयोग कैसे करें?

    HTML में आवश्यक विशेषता का उपयोग किया जाता है o यह निर्दिष्ट करें कि प्रपत्र जमा करने से पहले तत्व को भरा जाना चाहिए। यदि फ़ील्ड नहीं भरी जाती है और सबमिट बटन पर क्लिक किया जाता है, तो एक त्रुटि उत्पन्न होती है, जो फॉर्म जमा करने में विफल हो जाती है। त्रुटि कृपया इस फ़ील्ड को भरें होगी। आवश्यक विशेष

  1. एचटीएमएल में एकाधिक विशेषता का उपयोग कैसे करें?

    HTML में एकाधिक विशेषता उपयोगकर्ता को एक से अधिक मान दर्ज करने की अनुमति देती है। यह एक बूलियन विशेषता है और इसका उपयोग के साथ-साथ तत्व, . पर भी किया जा सकता है HTML प्रपत्रों में एकाधिक फ़ाइल अपलोड की अनुमति देने के लिए, एकाधिक विशेषता का उपयोग करें। एकाधिक विशेषता ईमेल और फ़ाइल इनपुट प्रकारों क

  1. एचटीएमएल में सूची विशेषता का उपयोग कैसे करें?

    HTML में, हम पूर्व-निर्धारित विकल्पों की सूची निर्दिष्ट करने के लिए तत्व का उपयोग करते हैं। यह सूची एक इनपुट तत्व के लिए है। सूची विशेषता इस तत्व को संदर्भित करती है। HTML5 ने सूची विशेषता पेश की। सूची विशेषता तत्व को संदर्भित करती है जिसमें तत्व के लिए पूर्व-निर्धारित विकल्प होते हैं। उदाहरण