Google का नवीनतम कोर वेब वाइटल अपडेट खोज परिणामों को प्रभावित करना शुरू कर देगा। और आपकी वेबसाइट का PageSpeed इनसाइट स्कोर बहुत कम है? तब आपको इसकी चिंता करनी होगी। अब आप पृष्ठ गति में सुधार कर सकते हैं और अपना SERP बनाए रख सकते हैं या इसे खो सकते हैं।
लेकिन क्या होगा यदि आपकी साइट की गति अच्छी है, लेकिन एडसेंस विज्ञापन कोड जोड़ने के बाद साइट की गति कम हो जाती है? आप AdSense सर्वर को ऑप्टिमाइज़ भी नहीं कर सकते हैं। यह लेख वेबसाइट की गति को प्रभावित किए बिना ऐडसेंस विज्ञापनों को लोड करने पर चर्चा करेगा।
इसलिए आप वेबसाइट को विकसित करने के लिए वेबसाइट पर एक अच्छे उपयोगकर्ता अनुभव के साथ राजस्व कमाना चाहते हैं। आपको Adsense के ads और वेबसाइट की speed का ध्यान रखना होगा।
वेबसाइट स्पीड परफॉर्मेंस कैसे चेक करें?
वेबसाइट की स्पीड चेक करने के लिए कई फ्री और प्रीमियम टूल्स उपलब्ध हैं। आप पहले से ही Google पेज स्पीड इनसाइट्स, GTmetrix, Pingdom Tools आदि के बारे में जानते होंगे, लेकिन यहाँ महत्वपूर्ण सवाल यह है कि आपको किस पेज स्पीड की जाँच करनी चाहिए?
अधिकांश ब्लॉगर अपने वेबसाइट होमपेज की गति की जांच करते हैं और सोचते है हो गया, लेकिन केवल यही नहीं करना चाहिए। इसके लिए आपको उपलब्ध सभी सामग्री की पृष्ठ गति की जांच करनी होगी। लेकिन व्यावहारिक तौर पर सभी पोस्ट और पेज की स्पीड चेक करना संभव नहीं है।
आपको इन समाधानो का जांच करना है:
मुखपृष्ठ गति,
ब्लॉग पोस्ट स्पीड,
पृष्ठ गति।
मान लीजिए कि आपके पास अन्य पेज जैसे उत्पाद पेज या ब्लॉग पोस्ट हैं जिनमें मीडिया, आईफ्रेम आदि हैं। आप उन पेजों के लिए स्पीड चेक भी कर सकते हैं। आप Adsense ads add करने से पहले और बाद में इन सभी pages की speed check कर सकते हैं।
वेबसाइट की गति से समझौता किए बिना एडसेंस विज्ञापनों को कैसे लोड करें?
पेजस्पीड इनसाइट्स टूल में AdSense लागू करने से पहले मेरी वेबसाइट की गति मोबाइल के लिए 95+ और डेस्कटॉप उपकरणों के लिए 100+ थी। लेकिन जैसे ही मैंने ऐडसेंस विज्ञापनों को जोड़ा, यह मोबाइल के लिए 30 से 40 और डेस्कटॉप के लिए 80 तक कम हो गया। मैं ब्लॉगर ब्लॉग और वर्डप्रेस वेबसाइट चला रहा हूँ और दोनों के लिए एक उचित समाधान ही चाहता हूँ।
जब हम एक ऐडसेंस विज्ञापन बनाते हैं, तो यह निम्न जैसा दिखेगा।
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Large Rectangle -->
<ins class="adsbygoogle"
style="display:inline-block;width:336px;height:280px"
data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
data-ad-slot="123456"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
उपरोक्त कोड में, सामग्री को लोड होने से रोके बिना adsbygoogle.js फ़ाइल सामग्री के साथ एसिंक्रोनस रूप से लोड होना शुरू हो जाती है। इससे सामग्री लोड होने में देरी होती है और इसलिए वेबसाइट लोड होने में अधिक समय लेती है।
लेकिन हम इस स्क्रिप्ट के साथ क्या करने जा रहे हैं कि वेबसाइट उपयोगकर्ता के साथ बातचीत करने के लिए तैयार होने के बाद विज्ञापन लोड हो जाएंगे। और जब उपयोगकर्ता स्क्रॉल करता है, क्लिक करता है, या बिना किसी इनपुट के 5 सेकंड के बाद।
सबसे पहले, हम सभी पृष्ठ विज्ञापन इकाइयों से adsbygoogle.js को हटा देंगे, जैसा कि नीचे दिखाया गया है।
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
सभी विज्ञापन ब्लॉक इसी तरह दिखने चाहिए। हमने मोबाइल और डेस्कटॉप उपकरणों के लिए 336×280 आकार का एक विज्ञापन ब्लॉक चुना है।
<!-- Large Rectangle -->
<ins class="adsbygoogle"
style="display:inline-block;width:336px;height:280px"
data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
आप अपने पेजस्पीड इनसाइट स्कोर को बढ़ाने के लिए निम्न स्क्रिप्ट को अपनी वेबसाइट के फुटर सेक्शन में जोड़ सकते हैं। लेकिन ऑटो-रिस्पॉन्सिव विज्ञापनों से बचना सबसे अच्छा होगा क्योंकि इसके परिणामस्वरूप एक विशाल संचयी लेआउट शिफ्ट स्कोर होगा। आप रिस्पॉन्सिव Adsense विज्ञापन भी दिखा सकते हैं।
<script id='flying-scripts' type='text/javascript'>const loadScriptsTimer=setTimeout(loadScripts,5*1000);const userInteractionEvents=["mouseover","keydown","touchstart","touchmove","wheel"];userInteractionEvents.forEach(function(event){window.addEventListener(event,triggerScriptLoader,{passive:!0})});function triggerScriptLoader(){loadScripts();clearTimeout(loadScriptsTimer);userInteractionEvents.forEach(function(event){window.removeEventListener(event,triggerScriptLoader,{passive:!0})})}function loadScripts(){document.querySelectorAll("script,iframe[data-type='lazy']").forEach(function(elem){elem.setAttribute("src",elem.getAttribute("data-src"))})}</script>
इस स्क्रिप्ट के नीचे, ऐडसेंस विज्ञापनों की प्रस्तुति स्क्रिप्ट को उसी प्रारूप में पेस्ट करें जैसा कि नीचे दिखाया गया है। हमने यूजर इंटरेक्शन के बाद ऐडसेंस विज्ञापनों को लोड करने के लिए src को data-src में बदल दिया है। कृपया ध्यान दें कि आपको उन सभी के बजाय सभी विज्ञापनों को ब्लॉक करने वाली निम्नलिखित पंक्तियों को हटाना होगा। निम्नलिखित को पेस्ट करें
<script data-ad-client='ca-pub-XXXXXXXXXXXXXXXX' data-src='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' data-type='lazy'></script>
वर्डप्रेस उपयोगकर्ता थीम पैनल का उपयोग करके पाद लेख अनुभाग में निम्न कोड जोड़ सकते हैं। यदि विषय पाद लेख में कस्टम जावास्क्रिप्ट का समर्थन नहीं करता है, तो इसे मैन्युअल रूप से जोड़ें। इसके लिए appearance> theme> edit theme पर जाएं और फिर footer.php खोजें। अब उपरोक्त स्क्रिप्ट (दोनों) को </body> टैग के पहले पेस्ट करें। थीम अपडेट के बाद भी इन बदलावों को बनाए रखने के लिए चाइल्ड थीम का इस्तेमाल करें. अपनी WordPress वेबसाइट के लिए चाइल्ड थीम बनाने का प्रयास करें।
ब्लॉगर उपयोगकर्ता ब्लॉगर थीम को संपादित कर सकते हैं और उपरोक्त स्क्रिप्ट को </body> टैग के ऊपर थीम फ़ाइल में पेस्ट कर सकते हैं। इतना करने के बाद आप वेबसाइट की स्पीड चेक कर सकते हैं। ब्लॉगर की ब्लॉग स्पीड बढ़ाने के लिए आप हमारी गाइड भी पढ़ सकते हैं।
मुझे आशा है कि आपको यह लेख मददगार लगा होगा; किसी भी संदेह, प्रश्न या प्रतिक्रिया के मामले में, नीचे दिए गए टिप्पणी अनुभाग में बेझिझक पूछें। धन्यवाद!
MNS.Code.Blog 