पहले, ऐप्लिकेशन इंस्टॉल करने की सुविधा, सिर्फ़ प्लैटफ़ॉर्म के लिए बने ऐप्लिकेशन में ही उपलब्ध थी. आज, मॉडर्न वेब ऐप्लिकेशन इंस्टॉल करने का अनुभव देते हैं. ये किसी प्लैटफ़ॉर्म के लिए बने खास ऐप्लिकेशन के जैसा ही इंटिग्रेशन और भरोसेमंद होते हैं.
इसे अलग-अलग तरीकों से हासिल किया जा सकता है:
- ब्राउज़र से PWA इंस्टॉल करना.
- ऐप स्टोर से PWA इंस्टॉल करना.
अलग-अलग डिस्ट्रिब्यूशन चैनल होने से, ज़्यादा से ज़्यादा उपयोगकर्ताओं तक पहुंचा जा सकता है, लेकिन अपने पीडब्ल्यूए को इंस्टॉल करने का प्रमोशन करने के लिए सही रणनीति चुनना चुनौती भरा हो सकता है.
इस गाइड में, इंस्टॉल करने के अलग-अलग विकल्पों को एक साथ इस्तेमाल करने के सबसे सही तरीकों के बारे में बताया गया है. इनकी मदद से, इंस्टॉल किए जाने की दर बढ़ाई जा सकती है. साथ ही, प्लैटफ़ॉर्म के मुकाबले ज़्यादा खरीदारों को नुकसान पहुंचने से बचाया जा सकता है. इंस्टॉल किए जाने वाले ऑफ़र में, ब्राउज़र और App Store, दोनों से इंस्टॉल किए गए PWA शामिल हैं. साथ ही, इनमें प्लैटफ़ॉर्म के हिसाब से बने ऐप्लिकेशन भी शामिल हैं.
अपने वेब ऐप्लिकेशन को इंस्टॉल करने लायक क्यों बनाएं?
इंस्टॉल किए गए प्रोग्रेसिव वेब ऐप्लिकेशन, ब्राउज़र टैब के बजाय स्टैंडअलोन विंडो पर चलते हैं. इन्हें उपयोगकर्ता की होम स्क्रीन, डॉक, टास्कबार या शेल्फ़ से लॉन्च किया जा सकता है. उन्हें किसी डिवाइस पर खोजा जा सकता है और ऐप्लिकेशन स्विचर की मदद से उनके बीच स्विच किया जा सकता है. ऐसा करने से, उन्हें उस डिवाइस के हिस्से जैसा महसूस होता है जिस पर वे इंस्टॉल किए गए हैं.
हालांकि, इंस्टॉल किए जा सकने वाले वेब ऐप्लिकेशन और प्लैटफ़ॉर्म के हिसाब से बने ऐप्लिकेशन, दोनों होने से उपयोगकर्ताओं को परेशानी हो सकती है. कुछ उपयोगकर्ताओं के लिए, प्लैटफ़ॉर्म के हिसाब से बनाए गए ऐप्लिकेशन सबसे अच्छे विकल्प हो सकते हैं. हालांकि, इन ऐप्लिकेशन की कुछ कमियां भी हो सकती हैं:
- स्टोरेज की सीमाएं: नया ऐप्लिकेशन इंस्टॉल करने का मतलब हो सकता है कि ज़रूरी कॉन्टेंट हटाकर, अन्य लोगों को मिटाना या जगह खाली करनी हो. खास तौर पर, इससे उन लोगों को नुकसान होता है जो कम सुविधाओं वाले डिवाइस इस्तेमाल करते हैं.
- उपलब्ध बैंडविड्थ: किसी ऐप्लिकेशन को डाउनलोड करने की प्रोसेस काफ़ी महंगी और धीमी हो सकती है. यह प्रक्रिया धीमे कनेक्शन और महंगे डेटा प्लान वाले उपयोगकर्ताओं के लिए और भी ज़्यादा काम की हो सकती है.
- समस्या: किसी ऐप्लिकेशन को डाउनलोड करने के लिए, वेबसाइट से बाहर निकलकर स्टोर में जाने से, अतिरिक्त समस्याओं का सामना करना पड़ता है. साथ ही, उपयोगकर्ता की ऐसी कार्रवाई में देरी होती है जिसे सीधे वेब पर पूरा किया जा सकता है.
- अपडेट साइकल: प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन में बदलाव करने के लिए, ऐप्लिकेशन की समीक्षा की प्रक्रिया पूरी करनी पड़ सकती है. इससे बदलावों और एक्सपेरिमेंट की रफ़्तार धीमी हो सकती है. उदाहरण के लिए, A/B टेस्ट.
कुछ मामलों में, अलग-अलग प्लैटफ़ॉर्म के हिसाब से आपके ऐप्लिकेशन को डाउनलोड न करने वाले उपयोगकर्ताओं का प्रतिशत ज़्यादा हो सकता है. उदाहरण के लिए: ऐसे लोग जिन्हें लगता है कि वे ऐप्लिकेशन का अक्सर इस्तेमाल नहीं करेंगे या जो कई मेगाबाइट स्टोरेज या डेटा खर्च करने को सही न बता पा रहे हों. इस सेगमेंट का साइज़ कई तरीकों से तय किया जा सकता है. उदाहरण के लिए, Analytics सेटअप का इस्तेमाल करके, "सिर्फ़ मोबाइल वेब" का प्रतिशत ट्रैक किया जा सकता है उपयोगकर्ता.
अगर इस सेगमेंट का साइज़ सोच-समझकर बनाया जा सकता है, तो यह इस बात का अच्छा संकेत है कि आपको अपने ऐप्लिकेशन को इंस्टॉल करने के अन्य तरीके उपलब्ध कराने होंगे.
ब्राउज़र की मदद से, PWA को इंस्टॉल करने का प्रमोशन करना
अगर आपके पास अच्छी क्वालिटी का PWA है, तो आपको प्लैटफ़ॉर्म के हिसाब से बनाए गए ऐप्लिकेशन पर उसे इंस्टॉल करने का प्रमोशन करना चाहिए. उदाहरण के लिए, अगर प्लैटफ़ॉर्म के हिसाब से काम करने वाले किसी ऐप्लिकेशन में, आपके पीडब्ल्यूए की सुविधाएं मौजूद नहीं हैं या उसे काफ़ी समय से अपडेट नहीं किया गया है. अगर किसी प्लैटफ़ॉर्म के लिए बने ऐप्लिकेशन को ChromeOS जैसी बड़ी स्क्रीन के लिए ऑप्टिमाइज़ नहीं किया गया है, तो आपके लिए अपने पीडब्ल्यूए को इंस्टॉल करने का प्रमोशन करना भी फ़ायदेमंद हो सकता है.
कुछ ऐप्लिकेशन के लिए, प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन को इंस्टॉल करना, कारोबार के मॉडल का अहम हिस्सा होता है. इस मामले में, प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन को इंस्टॉल करने का प्रमोशन करना आपके कारोबार के लिए फ़ायदेमंद हो सकता है. हालांकि, कुछ उपयोगकर्ता वेब पर ज़्यादा आराम से रह सकते हैं. अगर उस सेगमेंट की पहचान की जा सकती है, तो पीडब्ल्यूए का अनुरोध सिर्फ़ उन्हें दिखाया जा सकता है. इसे "पीडब्ल्यूए कहते हैं फ़ॉलबैक".
मुख्य तौर पर, इंस्टॉल किए जा सकने वाले पीडब्ल्यूए का इस्तेमाल
जब पीडब्ल्यूए इंस्टॉल करने से जुड़ी ज़रूरी शर्तें पूरी कर लेता है, तब ज़्यादातर ब्राउज़र यह बताते हैं कि पीडब्ल्यूए को इंस्टॉल किया जा सकता है. उदाहरण के लिए, डेस्कटॉप Chrome पता बार में इंस्टॉल किया जा सकने वाला एक आइकॉन दिखाता है और मोबाइल पर एक मिनी-इंफ़ोबार दिखाता है:
हालांकि, यह कुछ अनुभवों के लिए काफ़ी हो सकता है, लेकिन अगर आपका लक्ष्य अपने पीडब्ल्यूए को इंस्टॉल करना है, तो हमारा सुझाव है कि आप BeforeInstallPromptEvent
को ध्यान से पढ़ें. साथ ही, अपने पीडब्ल्यूए को इंस्टॉल करने का प्रमोशन करने के लिए पैटर्न अपनाएं.
अपने PWA को प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन इंस्टॉल करने की दर को नुकसान पहुंचने से रोकें
कुछ मामलों में, आपके पास अपने पीडब्ल्यूए पर प्लैटफ़ॉर्म के हिसाब से बने ऐप्लिकेशन को इंस्टॉल करने का प्रमोशन करने का विकल्प है. हालांकि, हमारा सुझाव है कि आप उपयोगकर्ताओं को ऐसा तरीका उपलब्ध कराएं जिससे वे आपके पीडब्ल्यूए इंस्टॉल कर सकें. इस फ़ॉलबैक विकल्प की मदद से, उन उपयोगकर्ताओं के लिए आपके प्लैटफ़ॉर्म के हिसाब से खास ऐप्लिकेशन को इंस्टॉल करना या उन्हें इंस्टॉल करना ज़रूरी होता है जो आपके ऐप्लिकेशन से मिलता-जुलता है.
इस रणनीति को लागू करने का पहला कदम यह है कि एक अनुमान तय करें. इससे उपयोगकर्ता को अपने पीडब्ल्यूए के लिए, इंस्टॉल करने से जुड़ा प्रमोशन दिखाने में मदद मिलेगी.
उदाहरण के लिए: PWA उपयोगकर्ता वह है जिसने प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन इंस्टॉल करने का अनुरोध देखा है, लेकिन प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन इंस्टॉल नहीं किया है. वे कम से कम पांच बार साइट पर वापस आए हैं या ऐप्लिकेशन के बैनर पर क्लिक करने के बाद, उन्होंने वेबसाइट का इस्तेमाल करना जारी रखा.
फिर, अनुमान को नीचे दिए गए तरीके से लागू किया जा सकता है:
- प्लैटफ़ॉर्म के हिसाब से, ऐप्लिकेशन इंस्टॉल करने का बढ़ावा देने वाला बैनर दिखाएं.
- अगर कोई उपयोगकर्ता बैनर को खारिज करता है, तो उस जानकारी वाली कुकी सेट करें (जैसे,
document.cookie = "app-install-banner=dismissed"
). - साइट पर उपयोगकर्ताओं की विज़िट की संख्या ट्रैक करने के लिए दूसरी कुकी का इस्तेमाल करें (जैसे,
document.cookie = "user-visits=1"
). - किसी उपयोगकर्ता को "PWA उपयोगकर्ता" माना जाता है या नहीं, यह तय करने के लिए
isPWAUser()
जैसा एक ऐसा फ़ंक्शन लिखें जोgetInstalledRelatedApps()
API के साथ, कुकी में पहले से सेव की गई जानकारी का इस्तेमाल करता हो. - जब उपयोगकर्ता काम की कार्रवाई करे, तो
isPWAUser()
को कॉल करें. अगर फ़ंक्शन 'सही' दिखाता है और PWA इंस्टॉल करने का अनुरोध पहले सेव किया गया था, तो आपके पास PWA इंस्टॉल बटन दिखाने का विकल्प है.
ऐप स्टोर की मदद से, PWA को इंस्टॉल करने का प्रमोशन करना
ऐप स्टोर के लिए ऐप्लिकेशन, अलग-अलग टेक्नोलॉजी का इस्तेमाल करके बनाए जा सकते हैं. इनमें पीडब्ल्यूए की तकनीकें भी शामिल हैं. पीडब्ल्यूए को नेटिव एनवायरमेंट में ब्लेंड करने में, उन टेक्नोलॉजी की खास जानकारी देखी जा सकती है जिनका इस्तेमाल उस काम के लिए किया जा सकता है.
इस सेक्शन में, हम स्टोर में मौजूद ऐप्लिकेशन को दो ग्रुप में बांटेंगे:
- प्लैटफ़ॉर्म के हिसाब से ऐप्लिकेशन: ये ऐप्लिकेशन, ज़्यादातर प्लैटफ़ॉर्म के हिसाब से बने कोड से बनाए जाते हैं. इनका साइज़, प्लैटफ़ॉर्म के हिसाब से तय होता है. हालांकि, आम तौर पर यह Android पर 10 एमबी और iOS पर 30 एमबी से ज़्यादा होता है. अगर आपके पास पीडब्ल्यूए की सुविधा नहीं है या किसी प्लैटफ़ॉर्म के लिए बने ऐप्लिकेशन में ज़्यादा सुविधाएं उपलब्ध हैं, तो आपको उस ऐप्लिकेशन का प्रमोशन करना चाहिए.
- लाइटवेट ऐप्लिकेशन: इन ऐप्लिकेशन को किसी प्लैटफ़ॉर्म के लिए खास कोड की मदद से भी बनाया जा सकता है. हालांकि, आम तौर पर इन्हें वेब टेक्नोलॉजी की मदद से बनाया जाता है, जो प्लैटफ़ॉर्म के हिसाब से खास रैपर में पैकेज होता है. स्टोर पर भी पूरे पीडब्ल्यूए अपलोड किए जा सकते हैं. (इस लेख में, इसकी चर्चा बाद में की गई है.) कुछ कंपनियां इन्हें "लाइट" के तौर पर उपलब्ध कराने का विकल्प चुनती हैं का इस्तेमाल कर रहे हैं. साथ ही कुछ अन्य संगठनों ने अपने फ़्लैगशिप (मुख्य) ऐप्लिकेशन के लिए भी इस तरीके का इस्तेमाल किया है.
कम स्टोरेज वाले ऐप्लिकेशन का प्रमोशन करना
Google Play की स्टडी के मुताबिक, हर छह एमबी और APK का साइज़ बढ़ाने पर, इंस्टॉल का कन्वर्ज़न रेट 1% कम हो जाता है. इसका मतलब है कि 10 एमबी के ऐप्लिकेशन के डाउनलोड पूरा होने की दर 100 एमबी वाले ऐप्लिकेशन के डाउनलोड से 30% ज़्यादा हो सकती है!
इसे ठीक करने के लिए, कुछ कंपनियां भरोसेमंद वेब गतिविधियों (टीडब्ल्यूए) का इस्तेमाल करके, अपने PWA का इस्तेमाल कर रही हैं, ताकि Play Store पर अपने ऐप्लिकेशन का लाइटवेट वर्शन उपलब्ध करा सकें. 'टीडब्ल्यूए' आपके PWA को कॉम्पोनेंट जैसे वेबव्यू में रैप करता है. इससे ऐप्लिकेशन का साइज़ आम तौर पर कुछ ही मेगाबाइट होता है.
भारत की सबसे बड़ी हॉस्पिटैलिटी कंपनियों में से एक Oyo ने अपने ऐप्लिकेशन का लाइट वर्शन बनाया और TWA का इस्तेमाल करके Play Store में उपलब्ध कराया. जब यह लेख लिखा गया था, तब Oyo ऐप्लिकेशन सिर्फ़ 850 केबी का था. यह उनके Android ऐप्लिकेशन का साइज़ 7% था. और एक बार इंस्टॉल हो जाने पर, उन्हें उनके Android ऐप्लिकेशन से पहचाना नहीं जा सकता:
ओयो ने फ़्लैगशिप और "लाइट", दोनों को रखा भी उपलब्ध होती है.
लाइटवेट वेब अनुभव देना
आम तौर पर, महंगे फ़ोन इस्तेमाल करने वाले लोगों की तुलना में, कम कीमत वाले डिवाइस इस्तेमाल करने वाले लोग ऐप्लिकेशन के लाइटवेट वर्शन डाउनलोड करना पसंद करते हैं. इसलिए, अगर किसी व्यक्ति के डिवाइस की पहचान करना मुमकिन है, तो प्लैटफ़ॉर्म के लिए खास तौर पर भारी वर्शन वाले ऐप्लिकेशन के बड़े वर्शन के बजाय, लाइटवेट ऐप्लिकेशन इंस्टॉल बैनर को प्राथमिकता दी जा सकती है.
वेब पर, डिवाइस के सिग्नल पाए जा सकते हैं और उन्हें डिवाइस की कैटगरी (जैसे कि "हाई", "मिड" या "कम") के साथ मैप किया जा सकता है. आपको JavaScript API या क्लाइंट हिंट का इस्तेमाल करके, अलग-अलग तरीकों से यह जानकारी मिल सकती है.
JavaScript का इस्तेमाल करना
navigator.hardwareConcurrency, navigator.deviceMemory, और navigator.connection जैसी JavaScript प्रॉपर्टी का इस्तेमाल करके, डिवाइस के सीपीयू, मेमोरी, और नेटवर्क की स्थिति की जानकारी हासिल की जा सकती है. उदाहरण के लिए:
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';`
क्लाइंट हिंट का इस्तेमाल करना
क्लाइंट हिंट की मदद से, एचटीटीपी अनुरोध के हेडर में डिवाइस के सिग्नल का अनुमान भी लगाया जा सकता है. यहां पर क्लाइंट संकेतों के साथ डिवाइस मेमोरी के पिछले कोड को लागू करने का तरीका बताया गया है:
सबसे पहले, उस ब्राउज़र को बताएं जिसे आपको पहले पक्ष के किसी भी अनुरोध के लिए एचटीटीपी रिस्पॉन्स के हेडर में डिवाइस के मेमोरी संकेत पाने हैं:
HTTP/1.1 200 OK
Content-Type: text/html
Accept-CH: Device-Memory
इसके बाद, आपको एचटीटीपी अनुरोधों के अनुरोध हेडर में Device-Memory
की जानकारी मिलेगी:
GET /main.js HTTP/1.1
Device-Memory: 0.5
उपयोगकर्ता के डिवाइस की कैटगरी में कुकी सेव करने के लिए, अपने बैकएंड में इस जानकारी का इस्तेमाल किया जा सकता है:
app.get('/route', (req, res) => {
// Determine device category
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';
// Set cookie
res.setCookie('Device-Category', deviceCategory);
…
});
आखिर में, इस जानकारी को डिवाइस की कैटगरी के हिसाब से मैप करने के लिए अपना लॉजिक बनाएं और हर मामले के लिए, ऐप्लिकेशन इंस्टॉल करने का अनुरोध दिखाएं:
if (isDeviceMidOrLowEnd()) {
// show "Lite app" install banner or PWA A2HS prompt
} else {
// show "Core app" install banner
}
नतीजा
उपयोगकर्ता की होम स्क्रीन पर आइकन की क्षमता होना, एप्लिकेशन की सबसे आकर्षक सुविधाओं में से एक है. पहले ऐसा सिर्फ़ ऐप स्टोर से इंस्टॉल किए गए ऐप्लिकेशन के लिए किया जा सकता था. इसलिए, कंपनियां यह सोच सकती हैं कि उपयोगकर्ताओं को ऐप्लिकेशन स्टोर से इंस्टॉल करने का बढ़ावा देने के लिए बैनर ही काफ़ी होगा. फ़िलहाल, उपयोगकर्ताओं को ऐप्लिकेशन इंस्टॉल करने की अनुमति देने के लिए कई विकल्प हैं. इनमें, स्टोर में ऐप्लिकेशन को आसानी से इस्तेमाल करने का अनुभव देना शामिल है. इसके अलावा, लोगों को सीधे वेबसाइट से ऐसा करने के लिए कहकर, होम स्क्रीन पर पीडब्ल्यूए जोड़ने की सुविधा भी दी जा सकती है.