वेब पर अपनी परफ़ॉर्मेंस को बेहतर बनाने के लिए, T-Mobile ने डेटा-ड्रिवन तरीके का इस्तेमाल किया. इससे, उपयोगकर्ताओं को साइट पर आने से जुड़ी समस्याओं में 20% की कमी आई और कार्ट से ऑर्डर में बदलने की दर में 32% की बढ़ोतरी हुई.

bookmark_border संग्रह की मदद से व्यवस्थित रहें अपनी प्राथमिकताओं के आधार पर, कॉन्टेंट को सेव करें और कैटगरी में बांटें.

Lucas Miré

David Lee

Tee Yeow

Bill Dinger

पब्लिश किया गया: 19 मार्च, 2025

T-Mobile, अमेरिका की एक प्रमुख टेलीकम्यूनिकेशन कंपनी है. यह कंपनी बड़े पैमाने पर नेटवर्क कवरेज और तेज़ 5G कनेक्टिविटी की सुविधा देती है.

असल उपयोगकर्ताओं के वेब विटल का विश्लेषण करके, T-Mobile को पता चला कि वेबसाइट की परफ़ॉर्मेंस की जानकारी को बेहतर बनाने से, उपयोगकर्ता अनुभव और कारोबार की मेट्रिक, दोनों पर काफ़ी असर पड़ सकता है.

अपनी डिजिटल मौजूदगी को बेहतर बनाने के लिए, T-Mobile ने अपनी वेबसाइट की वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को बेहतर बनाया. खास तौर पर, सबसे ज़्यादा कॉन्टेंट वाला पेंट (एलसीपी) को बेहतर बनाया. इससे उपयोगकर्ता अनुभव बेहतर हुआ और कारोबार की मुख्य मेट्रिक भी बेहतर हुईं.

डेटा की मदद से, वेब की परफ़ॉर्मेंस के बारे में जागरूकता बढ़ाना

वेब पर लोगों को बेहतर अनुभव देने की ज़रूरत को समझते हुए, T-Mobile की एसईओ और प्रॉडक्ट टीम ने अपनी वेबसाइट की परफ़ॉर्मेंस को बेहतर बनाने के लिए, एक साथ मिलकर काम शुरू किया. पहला कदम, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को हिस्सेदारों के साथ चर्चाओं में सबसे आगे लाना था. इससे यह पक्का किया जा सके कि इसे सबसे ज़्यादा प्राथमिकता दी जाए. कई कंपनियों की डेवलपमेंट टीमों को आम तौर पर इस समस्या का सामना करना पड़ता है.

इस समस्या को हल करने के लिए, T-Mobile ने डेटा-ड्रिवन रणनीति का इस्तेमाल किया. इस बात की पूरी जानकारी है कि Lighthouse का लैब डेटा और Chrome के लिए उपयोगकर्ता अनुभव से जुड़ी रिपोर्ट (CrUX) का डेटा, परफ़ॉर्मेंस के बारे में सिर्फ़ कुछ जानकारी दे सकता है. इसलिए, उन्होंने T-Mobile की वेब प्रॉपर्टी में वेब-विटल्स JavaScript लाइब्रेरी को शामिल किया, ताकि असली उपयोगकर्ताओं से सीधे तौर पर परफ़ॉर्मेंस डेटा कैप्चर किया जा सके और उसका विश्लेषण किया जा सके. इस डेटा को फ़ील्ड डेटा कहा जाता है.

फ़ील्ड से वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाले मेट्रिक का डेटा, अपने Analytics Suite के साथ इंटिग्रेट करके, T-Mobile ने कई अहम डेटा पॉइंट हासिल किए. इनमें ये शामिल हैं:

• उपयोगकर्ता अनुभव पर असर: जब पेजों को लोड होने में ज़्यादा समय लगता है, तो T-Mobile.com पर आने वाले लोग बाउंस होने की संभावना ज़्यादा होती है.
• कारोबार पर असर: जब पेजों को लोड होने में ज़्यादा समय लगता है, तो T-Mobile.com के कन्वर्ज़न रेट में गिरावट आती है.

डेटा से साफ़ तौर पर पता चलता था कि T-Mobile की वेबसाइट की परफ़ॉर्मेंस और उसके कारोबार की मेट्रिक का आपस में क्या संबंध है.

एलसीपी के 100 मिलीसेकंड के सेगमेंट में रेवेन्यू पर पड़ने वाले असर का अनुमान लगाकर, टीम ने लीडरशिप का ध्यान खींचा. साथ ही, वेबसाइट की परफ़ॉर्मेंस को बेहतर बनाने के लिए, अलग-अलग फ़ंक्शन की टीमों को शामिल करके एक टास्क फ़ोर्स बनाई. साफ़ तौर पर डेटा दिखाकर और अवसर को मेज़र करके, T-Mobile की एसईओ और प्रॉडक्ट टीम ने वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली मेट्रिक को बेहतर बनाने की अहमियत के बारे में असरदार तरीके से बताया.

ज़्यादा से ज़्यादा असर के लिए, वेब की परफ़ॉर्मेंस में सुधार करना

परफ़ॉर्मेंस से जुड़ी समस्याओं को पूरी तरह से हल करने के लिए, T-Mobile की टीम ने स्केलेबल होने के लक्ष्य को ध्यान में रखते हुए, तकनीकी सुधारों की एक सीरीज़ शुरू की. इन कोशिशों का मकसद, अहम कॉम्पोनेंट को ऑप्टिमाइज़ करना और टेक्नोलॉजी का फ़ायदा लेना था. इससे, यह पक्का किया जा सके कि उनके सभी डिजिटल प्लैटफ़ॉर्म पर परफ़ॉर्मेंस में लगातार बढ़ोतरी हो.

खरीदारों के अनुभव पर असर

साइट की परफ़ॉर्मेंस को बेहतर बनाने की कोशिशों की वजह से, सबसे बड़े कॉन्टेंटफ़ुल पेंट (एलसीपी) में कुल 42% की कमी आई:

इस बेहतर सुविधा से, उपयोगकर्ता अनुभव पर कई सकारात्मक असर पड़े. इनमें ये शामिल हैं:

कारोबार पर असर

पेज के लोड होने में कम समय लगने से, खरीदारी के फ़्लो को बेहतर बनाने में भी मदद मिली. इस दौरान, खरीदारी के इरादे से आने वाले संभावित ग्राहकों के कन्वर्ज़न रेट में 60% की बढ़ोतरी हुई.

परफ़ॉर्मेंस से जुड़े ऐसे अहम अपग्रेड जिनकी मदद से T-Mobile आगे बढ़ा

यहां मुख्य पहलों और उनके असर की पूरी जानकारी दी गई है:

• एपीआई को कैश मेमोरी में सेव करना और उसे फिर से बनाना

  प्रॉडक्ट और प्रमोशन एपीआई के साथ-साथ अन्य एपीआई को कैश मेमोरी में सेव किया गया और फिर से तैयार किया गया. इससे, रिस्पॉन्स मिलने में लगने वाले समय को कम करने और सर्वर लोड को कम करने में मदद मिली. कैश मेमोरी को ऑप्टिमाइज़ करने के लिए, कॉन्टेंट डिलीवरी नेटवर्क (सीडीएन) पर ऑफ़लोड करने से, इन सुधारों में काफ़ी मदद मिली.

• स्टैटिक ऐसेट को कैश मेमोरी में सेव करना

  लोड होने में लगने वाले समय को कम करने के लिए, स्टैटिक एसेट को कैश मेमोरी में सेव किया गया था. इनमें JavaScript, स्टाइलशीट, और क्लाइंट लाइब्रेरी शामिल हैं. सीडीएन कैश मेमोरी और ऑप्टिमाइज़ की गई कैश मेमोरी सेटिंग का इस्तेमाल करने से, डिलीवरी की स्पीड बेहतर हुई और सर्वर का लोड कम हुआ. इस ऑप्टिमाइज़ेशन की वजह से, साइट की परफ़ॉर्मेंस बेहतर हुई.

• इमेज कॉम्पोनेंट को ऑप्टिमाइज़ करना

  टीम ने इमेज के साइज़ को कम करके, इमेज के कॉम्पोनेंट को ऑप्टिमाइज़ किया. साथ ही, WebP जैसे आधुनिक इमेज फ़ॉर्मैट का इस्तेमाल किया और रिस्पॉन्सिव इमेज को लागू किया, ताकि सबसे छोटे फ़ाइल साइज़ में सबसे अच्छी क्वालिटी मिल सके.

• कॉम्पोनेंट को पहले से लोड करना और प्रीफ़ेच करना

  ज़रूरी रिसॉर्स को पहले से लोड और प्रीफ़ेच किया गया था, ताकि ज़रूरत पड़ने पर वे तुरंत उपलब्ध हों. इससे, उपयोगकर्ताओं को इंतज़ार करने का समय कम हो गया और पेज लोड होने में लगने वाला समय कम हो गया.

• ज़रूरी डोमेन से पहले से कनेक्ट होना और एंटी-फ़्लिकर स्क्रिप्ट में सुधार

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

• Adobe Experience Manager (AEM) प्लैटफ़ॉर्म पर माइग्रेट करना

  टीम ने अपने फ़्रंटएंड प्लैटफ़ॉर्म के नए वर्शन पर माइग्रेट किया, जिससे परफ़ॉर्मेंस बेहतर हुई और इंफ़्रास्ट्रक्चर में सुधार हुए.

• ऐंगलर कॉम्पोनेंट को AEM फ़ैक्ट्री कॉम्पोनेंट में माइग्रेट करना

  आर्किटेक्चर को बेहतर बनाने और परफ़ॉर्मेंस और रखरखाव को बेहतर बनाने के लिए, Angular कॉम्पोनेंट को Adobe Experience Manager (AEM) फ़ैक्ट्री कॉम्पोनेंट में माइग्रेट किया गया था.

• लैंडिंग पेज को ऑप्टिमाइज़ करने के मुख्य तरीके

  इन सुधारों में, इमेज कैरसेल को ऑप्टिमाइज़ करना, Adobe webSDK का इस्तेमाल करना, डाइनैमिक मीडिया के लिए कैश मेमोरी का समय बढ़ाना, पेलोड को कंप्रेस करना, और लोड होने में लगने वाले समय और उपयोगकर्ता अनुभव को बेहतर बनाने के लिए इमेज के डिज़ाइन अपडेट करना शामिल है.

• एपीआई में गड़बड़ी को कम करना

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

डेटा को सभी के लिए उपलब्ध कराने के मकसद से, वेब पर परफ़ॉर्मेंस को बेहतर बनाने के लिए काम करना

T-Mobile ने अपने पूरे संगठन में कई अहम कदम उठाए हैं, ताकि वे वेब की परफ़ॉर्मेंस को बेहतर बनाने के लिए प्रतिबद्ध रहें. इन पहलों को, परफ़ॉर्मेंस डेटा को सभी के लिए ऐक्सेस करने, हमारी टीम को शिक्षित करने और उससे जुड़ने, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली मेट्रिक को पहले से मॉनिटर करने, और सभी कोड रिलीज़ के लिए परफ़ॉर्मेंस स्टैंडर्ड लागू करने के लिए डिज़ाइन किया गया है. यहां दी गई रणनीतियों से पता चलता है कि वे डेटा को ऐक्सेस करने लायक बनाकर, लगातार सीखने-सिखाने की प्रक्रिया को बढ़ावा देकर, और बेहतर तरीके से मैनेज करने की सुविधाओं को लागू करके, वेब पर बेहतर परफ़ॉर्मेंस की संस्कृति को कैसे बढ़ावा दे रहे हैं.

• Core Web Vitals के डेटा को सभी के लिए उपलब्ध कराना

  T-Mobile ने Looker Studio के बेहतरीन डैशबोर्ड का इस्तेमाल करके, संगठन के सभी सदस्यों के लिए परफ़ॉर्मेंस डेटा को ऐक्सेस किया. इसके अलावा, वेबसाइट की परफ़ॉर्मेंस से जुड़ा विकी, टीम के सदस्यों को वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली रिपोर्ट को समझने और उसका इस्तेमाल करने में मदद करता है.

  

  बाईं से दाईं ओर, यह जानकारी दिखती है:

  • स्पीडोमीटर: चुनी गई तारीख की सीमा के दौरान कैप्चर किए गए सभी एलसीपी इवेंट का 75वां प्रतिशत.
  • लाइन ग्राफ़: चुनी गई तारीख की सीमा के दौरान, 75वें पर्सेंटाइल स्कोर का रोज़ का रुझान.
  • पाई चार्ट: चुनी गई तारीख की सीमा के दौरान, अच्छी, सुधार की ज़रूरत है, और खराब रेटिंग का प्रतिशत.
  • स्टैक किया गया लाइन ग्राफ़: चुनी गई सीमा के दौरान, 'अच्छा', 'सुधार की ज़रूरत है', और 'खराब' रेटिंग के बंटवारे का रोज़ का रुझान.

• जानकारी उपलब्ध कराना और जुड़ाव बढ़ाना

  प्रॉडक्ट और एसईओ मैनेजर, नियमित रूप से वेब परफ़ॉर्मेंस से जुड़े रोड शो और नॉलेज ट्रांसफ़र सेशन आयोजित करते हैं. इन पहलों से पूरी टीम को जानकारी मिलती है और वे इसमें दिलचस्पी लेती हैं. इससे वेब की परफ़ॉर्मेंस को बेहतर बनाने के लिए, टीम की प्रतिबद्धता बढ़ती है.

• Core Web Vitals के लिए सूचना देने वाला सिस्टम

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

• कोड रिलीज़ के लिए परफ़ॉर्मेंस से जुड़ी ज़रूरी शर्तें

  T-Mobile ने कोड रिलीज़ के लिए परफ़ॉर्मेंस से जुड़ी ज़रूरी शर्तें भी तय की हैं. पेजों को लॉन्च करने से पहले, Lighthouse में परफ़ॉर्मेंस के खास लेवल को पूरा करना ज़रूरी है. इससे यह पक्का होता है कि वेब की परफ़ॉर्मेंस के उच्च मानकों को बनाए रखा जा सके.

इन तरीकों को लागू करके, T-Mobile यह पक्का कर पाता है कि वेब की परफ़ॉर्मेंस को प्राथमिकता दी जाती रहे. साथ ही, वेब की परफ़ॉर्मेंस को लगातार बेहतर बनाने की कोशिश की जाती रहे.

आभार

T-Mobile की वेबसाइट की परफ़ॉर्मेंस और इस केस स्टडी पर काम करने वाले लोगों का धन्यवाद: केविन लाऊ, मॉनिक मिसराही, बिल डिंजर, लॉरा मैथिसन, सुरेश गुंडू, ड्यूक फ़ॉन्ग, अमीर मोहम्मदी, लिआंग येह, जेनिफर पैंके, जूलिया एडगर, एजाज़ मलिक, डेमन जोचम, विल फ़्रेली, जीन मैककेना, विनायक हेगड़े, और वारेन मैकनील.

इस केस स्टडी को T-Mobile और Google के उनके ग्राहक समाधान पार्टनर, इल्या मोटामेदी, डकोटा डेडी, और क्रिस्टीन ज़ानेडिस के साथ मिलकर तैयार किया गया था. इनकी अहम जानकारी और सहायता की वजह से, इस पहल को सफलता मिली.