NDTV ने उपयोगकर्ता के अनुभव को बेहतर बनाया है. इसलिए, वेबसाइट की परफ़ॉर्मेंस की जानकारी को ऑप्टिमाइज़ करके, उपयोगकर्ताओं को अपने साथ जोड़े रखा जा सकता है.
NDTV, भारत के बड़े न्यूज़ स्टेशन और वेबसाइटों में से एक है. वेब विज़िट प्रोग्राम की मदद से, कंपनी ने अपनी सबसे अहम उपयोगकर्ता मेट्रिक में से एक, सबसे बड़े कॉन्टेंटफ़ुल पेंट (एलसीपी) में एक महीने में 55% की बढ़ोतरी हासिल की. इसकी वजह यह थी कि बाउंस दरों में 50% की कमी आई थी.
55%
एलसीपी में सुधार
50% है
बाउंस रेट में कमी
अवसर को हाइलाइट करना
हर महीने करीब 20 करोड़ यूनीक उपयोगकर्ता होते हैं. ऐसे में, NDTV के लिए उपयोगकर्ता अनुभव की क्वालिटी को ऑप्टिमाइज़ करना ज़रूरी था. उनके जुड़ाव की दर, इंडस्ट्री की औसत दर से ज़्यादा थी. साथ ही, यह उनके जैसे दूसरे लोगों की तुलना में सबसे ज़्यादा थी. इसके बावजूद, NDTV की टीम को इसमें सुधार की गुंजाइश थी. इसलिए, उन्होंने अपने जुड़ाव की दर को और बेहतर बनाने के लिए, अन्य प्रॉडक्ट में बदलाव के साथ-साथ WebVital में निवेश करने का फ़ैसला लिया.
इस्तेमाल किया गया
PageSpeed Insights, web.dev/measure, और WebPageTest जैसे टूल की मदद से NDTV की टीम ने साइट के संभावित सुधार के क्षेत्रों का विश्लेषण किया है. साफ़ तौर पर बताए गए ऑप्टिमाइज़ेशन के इन आइडिया ने, उन कामों को फिर से प्राथमिकता दी जिनसे सबसे ज़्यादा असर पड़ा. इससे वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी में सुधार करने के लिए, तुरंत नतीजे मिले. ऑप्टिमाइज़ेशन में ये शामिल हैं:
- तीसरे पक्ष के अनुरोधों में देरी करके, सबसे बड़े कॉन्टेंट ब्लॉक को प्राथमिकता देना. इसमें वेबसाइट में फ़ोल्ड के नीचे वाले विज्ञापन स्लॉट के लिए विज्ञापन कॉल और वेबसाइट में फ़ोल्ड के नीचे वाले सोशल नेटवर्क एम्बेड के लिए विज्ञापन कॉल शामिल हैं.
- स्टैटिक कॉन्टेंट की कैशिंग को कुछ मिनट से बढ़ाकर, 30 दिन करना.
-
फ़ॉन्ट के डाउनलोड होने के दौरान, टेक्स्ट को जल्दी दिखाने के लिए,
font-display
का इस्तेमाल किया जा रहा है. - TrueType फ़ॉन्ट (TTF) के बजाय आइकॉन के लिए वेक्टर ग्राफ़िक का इस्तेमाल करना.
- लेज़ी लोडिंग JavaScript और सीएसएस: पेज को कम से कम JS और सीएसएस के साथ लोड करना और इसके बाद, पेज स्क्रोल करने पर बाकी के JS और सीएसएस को लेज़ी लोड करना.
- क्रिटिकल ऐसेट डिलीवर करने वाले ऑरिजिन से प्री-कनेक्ट करना.
![ऑप्टिमाइज़ेशन की खास जानकारी: सबसे बड़ा कॉन्टेंटफ़ुल पेंट, कैश मेमोरी, सीएसएस, वेक्टर ग्राफ़िक, लेज़ी लोडेड JS और सीएसएस, पहले से कनेक्ट करना.](https://web.dev/static/case-studies/ndtv/image/a-summary-the-optimizati-b938d496646d5.png?authuser=19&hl=hi)
असर
वेबसाइट की परफ़ॉर्मेंस की जानकारी में, टीम को मेट्रिक के हिसाब से सिग्नल दिए गए हैं, ताकि उपयोगकर्ता अनुभव को बेहतर बनाने की प्रोसेस को तेज़ी से पूरा किया जा सके.
ऑप्टिमाइज़ेशन प्रोजेक्ट शुरू करने से पहले, NDTV की टीम ने अपने एलसीपी स्कोर के लिए 3.0 सेकंड का मानदंड तय किया. Chrome इस्तेमाल करने वालों के अनुभव की रिपोर्ट के फ़ील्ड डेटा के आधार पर, यह स्कोर उनके उपयोगकर्ताओं के 75वें पर्सेंटाइल के लिए है. ऑप्टिमाइज़ेशन प्रोजेक्ट के बाद, इसकी अवधि 1.6 सेकंड तक कम हो गई थी. उन्होंने अपने कुल लेआउट शिफ़्ट (सीएलएस) के स्कोर को भी कम करके 0.05 कर लिया. WebPage Test की अन्य मेट्रिक, जैसे कि "फ़र्स्ट बाइट टाइम" और "सीडीएन का असरदार इस्तेमाल"" का ग्रेड बेहतर करके A ग्रेड किया गया.
![0.05 सीएलएस स्कोर.](https://web.dev/static/case-studies/ndtv/image/005-cls-score-63ecddcee9427.png?authuser=19&hl=hi)
निवेश पर लाभ
ndtv.com की जटिलता और गहराई के बावजूद, साइट को पहले से ही अच्छा एफ़आईडी और सीएलएस स्कोर मिल रहा था. इसकी वजह यह है कि टीम लंबे समय से परफ़ॉर्मेंस और UX के सबसे सही तरीकों पर ध्यान दे रही है. उपयोगकर्ता अनुभव को और बेहतर बनाने के लिए, टीम ने एलसीपी पर ध्यान दिया. ऑप्टिमाइज़ेशन के काम शुरू करने के कुछ हफ़्तों के अंदर, टीम ने ज़रूरी शर्तों को पूरा कर लिया.
कारोबार के सभी नतीजे
- वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को ऑप्टिमाइज़ करने से, एलसीपी में 55% की बढ़ोतरी हुई.
- वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को ऑप्टिमाइज़ करने के बाद, प्रॉडक्ट की बाउंस दर में 50% की कमी आई है. साथ ही, प्रॉडक्ट में हुए अन्य बदलावों को भी ऑप्टिमाइज़ किया गया है.
- इससे उनकी वेबसाइट पर आने वाले लोगों की दिलचस्पी और कॉन्टेंट देखने के साथ-साथ, उसके रेवेन्यू में भी बढ़ोतरी हुई.
![एलसीपी में 55% की बढ़ोतरी हुई. बाउंस दर में 50% की कमी. इससे प्रॉडक्ट की दिलचस्पी और उसे मिलने वाले कॉन्टेंट को ज़्यादा देखने में मदद मिलती है.](https://web.dev/static/case-studies/ndtv/image/55-improvement-lcp-50-bbfb39b0c8352.png?authuser=19&hl=hi)
बेहतरीन उपयोगकर्ता अनुभव देने के लिए, NDTV ने लंबे समय से सबसे सही तरीके अपनाए हैं. अब हम वेबसाइट की परफ़ॉर्मेंस की जानकारी को प्रॉडक्ट डेवलपमेंट का एक अहम हिस्सा मानते हैं. साथ ही, यूज़र ऐक्टिविटी में होने वाली बढ़ोतरी से, इसका आरओआई बेहतर होता है.
कवलजीत सिंह बेदी, चीफ़ टेक्नोलॉजी ऐंड प्रॉडक्ट ऑफ़िसर, NDTV Group
भारत और दक्षिण पूर्व एशिया में सफलता की कहानियों के लिए स्केल ऑन वेब केस स्टडी पेज देखें.