Uygulama yükleme işlemi geçmişte yalnızca platforma özel uygulamalar bağlamında mümkündü. Günümüzde modern web uygulamaları, platforma özel uygulamalarla aynı düzeyde entegrasyon ve güvenilirlik sunan yüklenebilir deneyimler sunuyor.
Bunu farklı şekillerde yapabilirsiniz:
- Tarayıcıdan PWA'yı yükleme
- PWA'yı uygulama mağazasından yüklemek.
Farklı dağıtım kanallarına sahip olmak çok sayıda kullanıcıya ulaşmanın etkili bir yoludur ancak PWA'nızın yüklemesini tanıtmak için doğru stratejiyi seçmek zor olabilir.
Bu kılavuzda, yükleme oranlarını artırmak ve platform rekabeti ile kendi gelirini olumsuz etkilemeyi önlemek için farklı yükleme seçeneklerini birleştirmeyle ilgili en iyi uygulamalar incelenmektedir. Hem tarayıcıdan hem de App Store'dan yüklenen PWA'ların yanı sıra platforma özel uygulamalar da bu kapsamdadır.
Web uygulamanızı neden yüklenebilir hale getirmelisiniz?
Yüklü Progresif Web Uygulamaları, tarayıcı sekmesi yerine bağımsız bir pencerede çalışır. Bu uygulamalar kullanıcının ana ekranından, dock'undan, görev çubuğundan veya rafından başlatılabilir. Uygulamalar, cihazda aranabilir ve uygulama değiştirici ile aralarında geçiş yapılabilir. Böylece, yüklü oldukları cihazın bir parçası gibi hissedilebilirler.
Ancak hem yüklenebilir bir web uygulamasına hem de platforma özel bir uygulamaya sahip olmak kullanıcılar için kafa karıştırıcı olabilir. Bazı kullanıcılar için platforma özel uygulamalar en iyi seçenek olsa da bazıları için bazı dezavantajlar sunabilir:
- Depolama alanı kısıtlamaları: Yeni bir uygulama yüklemek, diğer kullanıcıları silmek veya değerli içerikleri kaldırarak yer açmak anlamına gelebilir. Bu, özellikle düşük segment cihaz kullanıcıları için dezavantajlıdır.
- Mevcut bant genişliği: Uygulama indirme işlemi, özellikle yavaş bağlantılar ve pahalı veri planları kullanan kullanıcılar için maliyetli ve yavaş bir süreç olabilir.
- Sorun: Web sitesinden ayrılıp uygulamayı indirmek için mağazaya gitmek daha fazla zorluk yaratır ve kullanıcının doğrudan web'de gerçekleştirebileceği işlemleri geciktirir.
- Güncelleme döngüsü: Platforma özgü uygulamalarda değişiklik yapmak için bir uygulama inceleme sürecinden geçmesi gerekebilir. Bu da değişiklikleri ve denemeleri (örneğin, A/B testlerini) yavaşlatabilir.
Bazı durumlarda, platforma özel uygulamanızı indirmeyen kullanıcıların yüzdesi yüksek olabilir. Örneğin, uygulamayı çok sık kullanmayacağını düşünen veya birkaç megabayt depolama alanı ya da veri harcamayı haklı bulamayan kullanıcılar bu gruba girer. Bu segmentin boyutunu birkaç şekilde belirleyebilirsiniz. Örneğin, "yalnızca mobil web" kullanıcılarının yüzdesini izlemek için bir analiz kurulumu kullanabilirsiniz.
Bu segmentin boyutunun kayda değer olması, deneyimlerinizi yüklemek için alternatif yollar sağlamanız gerektiğinin iyi bir göstergesidir.
PWA'nızın tarayıcı üzerinden yüklenmesini teşvik etme
Yüksek kaliteli bir PWA'nız varsa platforma özel uygulamanız yerine PWA'nızın yüklenmesini tanıtmak daha iyi olabilir. Örneğin, platforma özel uygulamada PWA'nız tarafından sunulan işlevler eksikse veya uygulama bir süredir güncellenmemişse. Platforma özgü uygulama ChromeOS gibi daha büyük ekranlar için optimize edilmemişse PWA'nızın yüklenmesini teşvik etmeniz de yararlı olabilir.
Bazı uygulamalar için platforma özel uygulama yüklemelerini artırmak iş modelinin önemli bir parçasıdır. Bu durumda, platforma özel uygulamanızın yüklenmesini tanıtmak mantıklı bir iş kararıdır. Ancak bazı kullanıcılar web'de kalmayı tercih edebilir. Bu segment tanımlanabiliyorsa PWA istemi yalnızca bu segmente gösterilebilir ("Yedek olarak PWA" olarak adlandırdığımız şey).
Birincil yüklenebilir deneyim olarak PWA
PWA, yüklenebilirlik ölçütlerini karşıladığında çoğu tarayıcı, PWA'nın yüklenebilir olduğuna dair bir gösterge gösterir. Örneğin, masaüstü Chrome'da adres çubuğunda yüklenebilecek bir simge, mobil cihazlarda ise mini bilgi çubuğu gösterilir:
Bu, bazı deneyimler için yeterli olabilir ancak amacınız PWA'nızın yükleme sayısını artırmaksa BeforeInstallPromptEvent'u dinlemenizi ve PWA'nızın yüklemesini tanıtma kalıplarını uygulamanızı önemle tavsiye ederiz.
PWA'nızın platforma özel uygulama yükleme oranınızı düşürmesini engelleme
Bazı durumlarda, platforma özel uygulamanızın yüklenmesini PWA'nızdan daha fazla öne çıkarmayı tercih edebilirsiniz. Ancak bu durumda bile, kullanıcıların PWA'nızı yüklemesine olanak tanıyan bir mekanizma sunmanızı öneririz. Bu yedek seçenek, platforma özel uygulamanızı yükleyemeyen veya yüklemek istemeyen kullanıcıların benzer bir yüklü deneyim yaşamasını sağlar.
Bu stratejiyi uygulamanın ilk adımı, kullanıcıya PWA'nız için yükleme promosyonunu ne zaman göstereceğinize dair bir sezgisel kural tanımlamaktır.
Örneğin: PWA kullanıcısı, platforma özel uygulama yükleme istemini gören ancak platforma özel uygulamayı yüklememiş olan bir kullanıcıdır. Kullanıcı, siteye en az beş kez geri dönmüş veya uygulama banner'ını tıklamış ancak bunun yerine web sitesini kullanmaya devam etmiştir.
Daha sonra, buluşsal yöntem aşağıdaki şekilde uygulanabilir:
- Platforma özel uygulama yükleme banner'ını gösterin.
- Kullanıcı banner'ı kapatırsa bu bilgileri içeren bir çerez ayarlayın (ör.
document.cookie = "app-install-banner=dismissed"). - Siteye yapılan kullanıcı ziyaretlerinin sayısını izlemek için başka bir çerez kullanın (ör.
document.cookie = "user-visits=1"). - Bir kullanıcının "PWA kullanıcısı" olarak kabul edilip edilmeyeceğini belirlemek için daha önce çerezlerde depolanan bilgileri
getInstalledRelatedApps()API ile birlikte kullananisPWAUser()gibi bir işlev yazın. - Kullanıcı anlamlı bir işlem yaptığında
isPWAUser()işlevini çağırın. İşlev doğru değerini döndürüyorsa ve PWA yükleme istemi daha önce kaydedilmişse PWA yükleme düğmesini gösterebilirsiniz.
Uygulama mağazası üzerinden PWA'nızın yüklenmesini teşvik etme
Uygulama mağazaları için uygulamalar, PWA teknikleri dahil olmak üzere farklı teknolojilerle geliştirilebilir. PWA'yı yerel ortamlara entegre etme başlıklı makalede, bu amaçla kullanılabilecek teknolojilerin bir özetini bulabilirsiniz.
Bu bölümde, mağazadaki uygulamaları iki gruba ayıracağız:
- Platforma özel uygulamalar: Bu uygulamalar çoğunlukla platforma özel kodla oluşturulur. Boyutları platforma göre değişir, ancak Android'de genellikle 10 MB'ın, iOS'te ise 30 MB'ın üzerindedir. PWA'nız yoksa veya platforma özgü uygulama daha kapsamlı bir özellik grubu sunuyorsa platforma özel uygulamanızı tanıtmak isteyebilirsiniz.
- Hafif uygulamalar: Bu uygulamalar, platforma özel kodla da geliştirilebilir. Ancak genellikle web teknolojisiyle derlenir ve platforma özel bir sarmalayıcı içinde paketlenir. Mağazalara tam PWA'lar da yüklenebilir. (Bu konu bu makalenin sonraki bölümlerinde ele alınmıştır.) Bazı şirketler bunları "basit" deneyimler olarak sunmayı tercih ederken diğerleri bu yaklaşımı ana (temel) uygulamaları için de kullanmıştır.
Hafif Uygulamaları Tanıtma
Bir Google Play araştırmasına göre, bir APK'nın boyutuna getirilen her 6 MB'lık artışta yükleme dönüşüm oranı %1 azalıyor. Bu, 10 MB boyutunda bir uygulamanın indirme tamamlanma oranının 100 MB boyutunda bir uygulamadan yaklaşık %30 daha yüksek olabileceği anlamına gelir.
Bazı şirketler bu sorunu gidermek için Güvenilir Web Etkinlikleri'ni (TWA) kullanarak uygulamalarının Play Store'da hafif bir sürümünü sunmak üzere PWA'larından yararlanıyor. TWA'lar, PWA'nızı web görünümü benzeri bir bileşene sarar ve ortaya çıkan uygulama boyutu genellikle yalnızca birkaç megabayttır.
Hindistan'ın en büyük konaklama şirketlerinden biri olan Oyo, uygulamanın basit sürümünü geliştirdi ve TWA aracılığıyla Play Store'da kullanıma sundu. Bu makalenin yazıldığı sırada Oyo uygulaması yalnızca 850 KB (Android uygulamasının boyutu yalnızca% 7) idi. Yüklendikten sonra bu uygulamanın Android uygulamasından hiçbir şekilde ayırt edilememesi:
Oyo, hem ana hem de "basit" uygulama sürümlerini mağazada tutarak kullanıcılarına seçim imkanı sundu.
Hafif bir web deneyimi sunma
Sezgisel olarak, eski teknolojiye sahip cihaz kullanıcıları, ileri teknoloji telefon kullanıcılarına kıyasla uygulamaların hafif sürümlerini indirmeye daha eğilimli olabilir. Bu nedenle, bir kullanıcının cihazını tanımlamak mümkünse ağır platforma özgü uygulama sürümüne göre basit uygulama yükleme banner'ına öncelik verebilirsiniz.
Web'de cihaz sinyalleri elde edilebilir ve bunlar yaklaşık olarak cihaz kategorileriyle eşlenebilir (ör. "yüksek", "orta" veya "düşük"). Bu bilgileri, JavaScript API'lerini veya istemci ipuçlarını kullanarak farklı yollarla elde edebilirsiniz.
JavaScript'i kullanma
navigator.hardwareConcurrency, navigator.deviceMemory ve navigator.connection gibi JavaScript özelliklerini kullanarak sırasıyla cihazın CPU, bellek ve ağ durumu hakkında bilgi edinebilirsiniz. Örneğin:
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';`
İstemci ipuçlarını kullanma
Cihaz sinyalleri, istemci ipuçları aracılığıyla HTTP istek başlıklarında da çıkarılabilir. Önceki kodu, istemci ipuçlarıyla cihaz belleği için nasıl uygulayabileceğiniz aşağıda açıklanmıştır:
İlk olarak tarayıcıya, herhangi bir birinci taraf isteği için HTTP yanıtının başlığında cihaz bellek ipuçları almak istediğinizi söyleyin:
HTTP/1.1 200 OK
Content-Type: text/html
Accept-CH: Device-Memory
Ardından, HTTP isteklerinin istek başlığında Device-Memory bilgilerini almaya başlarsınız:
GET /main.js HTTP/1.1
Device-Memory: 0.5
Bu bilgileri, kullanıcının cihazının kategorisini içeren bir çerez depolamak için arka uçlarınızda kullanabilirsiniz:
app.get('/route', (req, res) => {
// Determine device category
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';
// Set cookie
res.setCookie('Device-Category', deviceCategory);
…
});
Son olarak, bu bilgileri cihaz kategorileriyle eşlemek için kendi mantığınızı oluşturun ve her durumda ilgili uygulama yükleme istemini gösterin:
if (isDeviceMidOrLowEnd()) {
// show "Lite app" install banner or PWA A2HS prompt
} else {
// show "Core app" install banner
}
Sonuç
Kullanıcının ana ekranında simge bulundurma yeteneği, uygulamaların en ilgi çekici özelliklerinden biridir. Geçmişte bu yalnızca uygulama mağazalarından yüklenen uygulamalar için mümkün olduğundan, şirketler bir uygulama mağazası yükleme banner'ı göstermenin kullanıcıları deneyimlerini yüklemeye ikna etmek için yeterli olacağını düşünebilir. Şu anda kullanıcıların uygulama yüklemesine izin vermek için daha fazla seçenek mevcuttur. Örneğin, mağazalarda hafif uygulama deneyimleri sunabilir ve kullanıcıları doğrudan web sitesinden uygulama yüklemeye yönlendirerek ana ekrana PWA eklemelerine izin verebilirsiniz.