एक पेज के ऐप्लिकेशन मेज़र करना

यह दस्तावेज़ उन डेवलपर के लिए है जो Google Analytics का इस्तेमाल करके, अपने एक पेज के ऐप्लिकेशन पर पेज व्यू मेज़र करना चाहते हैं.

एक पेज वाले ऐप्लिकेशन (एसपीए) ऐसी वेबसाइटें होती हैं जो एचटीएमएल दस्तावेज़ को एक बार लोड करती हैं और JavaScript एपीआई का इस्तेमाल करके, कोई भी अतिरिक्त कॉन्टेंट फ़ेच करती हैं.

उदाहरण: मान लें कि आपके पास कुछ लीड पाने के लिए एक फ़ॉर्म है. फ़ॉर्म में तीन स्क्रीन होती हैं: > * पहली स्क्रीन पर ग्राहक की जानकारी कैप्चर की जाती है. * दूसरी स्क्रीन, जहां ग्राहक कुछ सेवाओं में दिलचस्पी दिखाते हैं. * तीसरी स्क्रीन पर, ग्राहक की दिलचस्पी के हिसाब से वेबिनार के लिए साइन अप करने का पेज.

एसपीए से पेज व्यू को सही तरीके से मेज़र करने के लिए, हर उस स्क्रीन के पेज व्यू की गिनती करें जिससे कोई उपयोगकर्ता इंटरैक्ट करता है. साथ ही, पेज रेफ़रर को सही तरीके से पाएं, ताकि आप उपयोगकर्ता की गतिविधि को सही तरीके से ट्रैक कर सकें.

शुरू करने से पहले

इस पेज पर यह माना गया है कि आपके पास पहले से ही:

• आपकी वेबसाइट के लिए Google Analytics खाता और प्रॉपर्टी. Google Analytics सेट अप करने का तरीका जानें.

• आपकी वेबसाइट पर लागू किया गया Google टैग, जो पेज के लोड होने पर ट्रिगर होता है. Google टैग को सेट अप करने का तरीका जानें.

एक पेज के ऐप्लिकेशन के मेज़रमेंट को लागू करना

एसपीए को सटीक तरीके से मेज़र करने के लिए, इनमें से किसी एक तरीके का इस्तेमाल करके, नया वर्चुअल पेज व्यू ट्रिगर करें:

• ब्राउज़र इतिहास में बदलाव (सुझाया गया): अगर आपका एसपीए, History API का इस्तेमाल करता है, तो इस विकल्प का इस्तेमाल करें. खास तौर पर, स्क्रीन अपडेट करने के लिए pushState() और replaceState() तरीके का इस्तेमाल करें.

• कस्टम इवेंट: अगर आपकी वेबसाइट अलग-अलग स्क्रीन रेंडर करने के लिए, DocumentFragment ऑब्जेक्ट का इस्तेमाल करती है, तो इस विकल्प का इस्तेमाल करें.

ब्राउज़र इतिहास में बदलाव लागू करना

अगर आपका एसपीए, History API का इस्तेमाल करता है, तो Google Analytics में बेहतर मेज़रमेंट की सुविधा चालू की जा सकती है. इससे ब्राउज़र के ब्राउज़िंग इतिहास से जुड़े इवेंट के आधार पर, पेज व्यू को अपने-आप ट्रैक किया जा सकता है.

Google Analytics में बेहतर मेज़रमेंट की सुविधा चालू करना

ब्राउज़िंग इतिहास के आधार पर, page_views को अपने-आप मेज़र करने के लिए:

1. Google Analytics खोलें

2. एडमिन पेज पर, डेटा कलेक्शन और डेटा में बदलाव में जाकर, डेटा स्ट्रीम > वेब पर क्लिक करें.

3. बेहतर मेज़रमेंट की सुविधा के बगल में मौजूद स्विच को चालू पर सेट करें. इससे मेज़रमेंट के सभी विकल्प चालू हो जाएंगे.

4. अलग-अलग विकल्पों में बदलाव करने के लिए क्लिक करें. पेज व्यू में जाकर, बेहतर सेटिंग दिखाएं पर क्लिक करें. पेज लोड और ब्राउज़र इतिहास के इवेंट के मुताबिक पेज में बदलाव, दोनों को चालू करना न भूलें.

   

5. बदलावों को सेव करें.

मेज़रमेंट सेटअप की पुष्टि करना

यह पुष्टि करने के लिए कि आपका एक पेज का ऐप्लिकेशन, पेज व्यू को सही तरीके से मेज़र करता है:

1. अपने एसपीए मेज़रमेंट सेटअप में मौजूद हर टैग के लिए, डीबग मोड चालू करें. DebugView में इवेंट को मॉनिटर करने का तरीका जानें.

2. एक पेज के ऐप्लिकेशन पर क्लिक करें. किसी नई वर्चुअल स्क्रीन पर क्लिक करने पर, आपको DebugView में एक नया page_view इवेंट दिखेगा. page_view इवेंट पैरामीटर की तुलना, पिछले page_view इवेंट से करें. इससे यह पता चलेगा कि पेज रेफ़रर और पेज की जगह की जानकारी सही तरीके से अपडेट हुई है या नहीं.

एसपीए के लिए ध्यान देने वाली अन्य बातें

page_view इवेंट भेजने के अलावा, Google Analytics के साथ एसपीए को बेहतर तरीके से इंटिग्रेट करने और उपयोगकर्ता अनुभव को बेहतर बनाने के लिए, इन पहलुओं पर भी ध्यान दें:

स्क्रोल पोज़िशन मैनेज करना

जब उपयोगकर्ता किसी एसपीए में व्यू के बीच नेविगेट करते हैं, तो ब्राउज़र आम तौर पर मौजूदा स्क्रोल पोज़िशन को बनाए रखता है. इसका मतलब है कि हो सकता है कि उपयोगकर्ताओं को नए वर्चुअल पेज का सबसे ऊपरी हिस्सा न दिखे. साथ ही, इससे पेज पर सबसे नीचे तक स्क्रोल करने की ट्रैकिंग पर असर पड़ सकता है.

सुझाव: हर वर्चुअल पेज ट्रांज़िशन के बाद, प्रोग्राम के हिसाब से स्क्रोल की पोज़िशन को पेज के सबसे ऊपर या मुख्य कॉन्टेंट कंटेनर पर रीसेट करें.

// Example: Reset window scroll position on a route change in your SPA
window.scrollTo(0, 0);

// Or, if your content is within a specific element:
// document.getElementById('main-content').scrollTo(0, 0);

इस बदलाव के बाद, उपयोगकर्ता नए कॉन्टेंट के सबसे ऊपर से शुरुआत करेंगे. इससे Google Analytics स्क्रोल ट्रैकिंग, नए वर्चुअल पेज पर यूज़र ऐक्टिविटी को सटीक तरीके से मेज़र कर पाएगी.

पक्का करें कि ब्राउज़र की सुविधाओं के लिए कॉन्टेंट ऐक्सेस किया जा सके

अगर उपयोगकर्ता, ब्राउज़र की सुविधाओं से जुड़ी समस्याओं की शिकायत करते हैं, जैसे कि वर्चुअल पेज लोड होने के बाद, पेज पर खोज (Ctrl+F) की सुविधा काम नहीं कर रही है, तो इससे पता चल सकता है कि आपका एसपीए, डीओएम को कैसे अपडेट करता है.

सुझाव: पक्का करें कि आपका एसपीए फ़्रेमवर्क और रूटिंग लॉजिक, डीओएम के काम के हिस्सों को नए पेज के कॉन्टेंट के साथ पूरी तरह और एक साथ अपडेट करता हो. ऐसा हो सकता है कि रेंडरिंग में देरी होने या मुख्य डीओएम ट्री से कॉन्टेंट छिपा होने पर, ब्राउज़र का सर्च फ़ंक्शन उसे तुरंत इंडेक्स न कर पाए. वर्चुअल नेविगेशन के बाद, पेज पर मौजूद कॉन्टेंट को खोजने की सुविधा की जांच करें, ताकि यह पक्का किया जा सके कि कॉन्टेंट को ऐक्सेस किया जा सकता है.

अपने-आप होने वाले इवेंट पर असर

अगर आपने अपने एसपीए में वर्चुअल पेज व्यू मेज़रमेंट को सही तरीके से लागू किया है, तो Google Analytics अपने-आप होने वाले अन्य इवेंट को सही तरीके से मैनेज करेगा. अगर स्क्रीन में होने वाले बदलावों के लिए वर्चुअल पेज व्यू रिकॉर्ड नहीं किए जाते हैं, तो Google Analytics, एसपीए को एक ही पेज के तौर पर मानता है. इससे मेट्रिक में गड़बड़ी हो सकती है.

उदाहरण के लिए, user_engagement इवेंट से यह मेज़र किया जाता है कि कोई उपयोगकर्ता किसी पेज पर कितना समय बिताता है. वर्चुअल पेज व्यू के बिना, यूज़र ऐक्टिविटी के कुल समय को शुरुआती पेज लोड के लिए एट्रिब्यूट किया जाता है. इससे, अलग-अलग स्क्रीन पर बिताए गए समय का विश्लेषण करना नामुमकिन हो जाता है.

वर्चुअल पेज व्यू मेज़रमेंट को सही तरीके से लागू करने पर:

• user_engagement इवेंट तब भेजा जाता है, जब उपयोगकर्ता एक वर्चुअल पेज से दूसरे पेज पर जाता है.
• पिछले वर्चुअल पेज के लिए यूज़र ऐक्टिविटी के समय का हिसाब लगाया जाता है और उसे user_engagement इवेंट के साथ भेजा जाता है. आम तौर पर, ऐसा नए वर्चुअल पेज के लिए page_view इवेंट के प्रोसेस होने से ठीक पहले किया जाता है.
• क्लिक या स्क्रोल जैसे अन्य इवेंट, उस वर्चुअल पेज के page_location से जुड़े होते हैं जिसे उपयोगकर्ता फ़िलहाल देख रहा है.

इससे आपको अपने एसपीए में अलग-अलग स्क्रीन या सेक्शन के लिए, उपयोगकर्ता की दिलचस्पी और अन्य मेट्रिक का विश्लेषण करने में मदद मिलती है. इससे उपयोगकर्ता की गतिविधि को ज़्यादा सटीक तरीके से समझा जा सकता है.