Kullanıcı PWA'nızı yükledikten sonra:
- Başlatıcıda, ana ekranda, başlat menüsünde veya başlatma alanında bir simge bulundurun.
- Kullanıcı, cihazında uygulamayı aradığında sonuç olarak görünür.
- İşletim sisteminde ayrı bir pencere olmalıdır.
- Belirli özellikler için destek sağlayın.
Yükleme ölçütleri
Her tarayıcının, bir web sitesinin ya da web uygulamasının Progresif Web Uygulaması olduğunu ve bağımsız bir deneyim için yüklenebileceğini belirten bir kriteri vardır. PWA'nızın meta verileri, Web Uygulaması Manifest olarak bilinen JSON tabanlı bir dosya tarafından ayarlanır. Bu dosyayı sonraki modülde ayrıntılı olarak ele alacağız.
Yüklenebilirlik için minimum koşul olarak Web Uygulaması Manifest dosyasını destekleyen çoğu tarayıcı, uygulamanın adı ve yüklü deneyimin yapılandırılması gibi belirli özellikleri kullanır. Yüklenebilirliği desteklemeyen macOS için Safari bu duruma bir istisnadır.
Yüklemeye izin verme gereksinimleri farklı tarayıcılar arasında farklılık gösterir. Bu makalede, Google Chrome ölçütleriyle ilgili ayrıntılar ve diğer tarayıcılar için gereksinimlerin bağlantıları bulunmaktadır.
PWA'nın yüklenebilirlik gereksinimlerini karşıladığı testi birkaç saniye sürebilir. Bu nedenle, URL'nin yanıtı alınır almaz yüklenebilir hale gelebilir.
Masaüstü kurulumu
Masaüstü PWA'nın yüklenmesi şu anda Linux, Windows, macOS ve Chromebook'larda Google Chrome ve Microsoft Edge tarafından desteklenmektedir. Bu tarayıcıların URL çubuğunda (aşağıdaki resme bakın) mevcut sitenin yüklenebilir olduğunu belirten bir yükleme rozeti (simge) gösterilir.
Kullanıcı bir siteyle etkileşimde bulunduğunda, kullanıcıları söz konusu siteyi uygulama olarak yüklemeye davet eden aşağıdaki gibi bir pop-up görebilir.
Tarayıcının açılır menüsünde bir "Yükle
Masaüstü işletim sistemlerinde yalnızca bağımsız ve minimum kullanıcı arayüzü görüntüleme modları desteklenir.
Masaüstü bilgisayarlara yüklenen PWA'lar:
- Windows PC'lerde Başlat menüsünde veya Başlat ekranında, Linux GUI'lerdeki yuvada veya masaüstünde, macOS başlatma alanında veya Chromebook'un uygulama başlatıcısında bir simge bulundurun.
- Uygulama etkin olduğunda, yakın zamanda kullanıldığında veya arka planda açıldığında uygulama değiştiricilerde ve yuvalarda bir simge bulundurun.
- Uygulama aramada görünebilirsiniz. Örneğin, Windows'da veya macOS'te Spotlight'ta arama yapabilirsiniz.
- Yeni bildirimleri belirtmek için simgelerinde bir rozet numarası ayarlayabilir. Bu işlem Badging API ile yapılır.
- Uygulama Kısayolları kullanarak simge için bir içerik menüsü ayarlayabilir.
- Aynı tarayıcı ile iki kez yüklenemez.
Masaüstüne bir uygulama yükledikten sonra kullanıcılar about:apps sayfasına gidebilir, PWA'yı sağ tıklayabilir ve "Oturum Açtığımda Uygulamayı Başlat"ı seçebilir. açılışta otomatik olarak açılmasını istiyorlar.
iOS ve iPadOS yüklemesi
iOS ve iPadOS'te PWA'nızı yüklemenizi isteyen bir tarayıcı istemi yoktur. PWA'lar bu platformlarda ana ekran web uygulamaları olarak da bilinir. Bu uygulamaların, yalnızca Safari'de kullanılabilen bir menü aracılığıyla manuel olarak ana ekrana eklenmesi gerekir. html'nize apple-touch-icon etiketini eklemeniz önerilir.
Simgeyi tanımlamak için, simgenizin HTML <head> bölümünüze giden yolunu şu şekilde ekleyin:
<link rel="apple-touch-icon" href="/icons/ios.png">
Safari, kısayolu oluşturmak için bu bilgileri kullanır. Apple cihazlar için belirli bir simge sağlamazsanız ana ekrandaki simge, kullanıcı tarafından yüklendiği PWA'nın ekran görüntüsü olur.
PWA kurulumunun yalnızca kullanıcı web sitenize Safari'den göz attığında yapılabileceğini unutmayın. App Store'da bulunan Google Chrome, Firefox, Opera veya Microsoft Edge gibi diğer tarayıcılar ana ekrana PWA yükleyemez.
Ana ekrana uygulama ekleme adımları şunlardır:
- Tarayıcının alt veya üst kısmında bulunan Paylaş menüsünü açın.
- Add to Home Screen'i (Ana Ekrana Ekle) tıklayın.
- Uygulamanın adını onaylayın; kullanıcı tarafından düzenlenebilir.
- Ekle'yi tıklayın. iOS ve iPadOS'te, web sitelerine ve PWA'lara ilişkin yer işaretleri ana ekranda aynı görünür.
iOS ve iPadOS'te yalnızca bağımsız görüntüleme modu desteklenir. Bu nedenle, minimal kullanıcı arayüzü modu kullanırsanız bu ayar bir tarayıcı kısayoluna döner; tam ekran kullanırsanız bağımsız çalışmaya dönecek.
iOS ve iPadOS'te yüklü PWA'lar:
- Ana ekranda, Gündem'in arama bölümünde, Siri Önerileri'nde ve Uygulama Kitaplığı aramasında görünür.
- Uygulama Galerisi'nin kategori klasörlerinde görünmez.
- Rozet ve uygulama kısayolları gibi özellikler için destek sunulmuyor.
Safari, işletim sisteminde PWA simgelerini oluşturmak için Web Klipleri olarak bilinen yerel bir teknolojiyi kullanır. Bunlar, dosya sisteminde depolanan Apple'ın Mülk Listesi biçimindeki XML dosyalarıdır.
Android kurulumu
Android'de PWA yükleme istemleri cihaza ve tarayıcıya göre farklılık gösterir. Kullanıcılar şunları görebilir:
- Yükleme için menü öğesinin anlatımındaki Yükle veya Ana Ekrana Ekle gibi farklılıklar.
- Ayrıntılı yükleme iletişim kutuları.
Aşağıdaki resimde, basit bir mini bilgi çubuğu (solda) ve bir ayrıntılı yükleme iletişim kutusu (sağda) olmak üzere bir yükleme iletişim kutusunun iki farklı sürümünü görebilirsiniz.
PWA'nız, cihaza ve tarayıcıya bağlı olarak WebAPK, kısayol veya QuickApp olarak yüklenir.
WebAPKs
WebAPK, kullanıcının cihazının güvenilir bir sağlayıcısı tarafından (genellikle bulutta) bir WebAPK para kazanma sunucusunda oluşturulan Android paketidir (APK). Bu yöntem Google Chrome tarafından Google Mobil Hizmetleri (GMS) yüklü cihazlarda ve Samsung İnternet tarayıcısı tarafından kullanılır, ancak yalnızca Galaxy telefon veya tablet gibi Samsung tarafından üretilmiş cihazlarda kullanılır. Bu uygulamalar birlikte Android kullanıcılarının çoğunluğunu oluşturuyor.
Bir kullanıcı Google Chrome'dan bir PWA yüklediğinde ve bir WebAPK kullanıldığında, para kazanma sunucusu (paketler) oluşturur ve PWA için bir APK imzalar. Bu işlem zaman alır ancak APK hazır olduğunda tarayıcı uygulamayı sessiz bir şekilde kullanıcının cihazına yükler. APK'yı güvenilir sağlayıcılar (Play Hizmetleri veya Samsung) imzaladığından telefon, mağazadan gelen diğer uygulamalarda olduğu gibi APK'yı güvenliği devre dışı bırakmadan yükler. Uygulamayı başka cihazdan yüklemeye gerek yoktur.
WebAPK aracılığıyla yüklenen PWA'lar:
- Uygulama başlatıcıda ve ana ekranda bir simge olmalıdır.
- Ayarlar, Uygulamalar'da görünür.
- Rozet, uygulama kısayolları ve işletim sistemi içinde yakalama bağlantıları gibi çeşitli özelliklere sahip olabilir.
- Simgeyi ve uygulamanın meta verilerini güncelleyebilir.
- İki kez yüklenemez.
Kısayollar
WebAPK'ları Android kullanıcıları için en iyi deneyimi sunsa da her zaman oluşturulamaz. Aksi takdirde, tarayıcılar web sitesi kısayolu oluşturmaya geri döner. Firefox, Microsoft Edge, Opera, Brave ve Samsung Internet (Samsung olmayan cihazlarda) güvendikleri minting sunucuları olmadığından, kısayollar oluştururlar. Para kazanma hizmeti kullanılamıyorsa veya PWA'nız yükleme gereksinimlerini karşılamıyorsa Google Chrome da bu işlevi kullanır.
Kısayollarla yüklenen PWA'lar:
- Ana ekranda tarayıcı rozetli bir simge bulundurun (aşağıdaki örneklere bakın).
- Başlatıcı'da veya Ayarlar, Uygulamalar'da simge yoksa.
- Yükleme gerektiren özellikler kullanılamaz.
- Simgelerini ve uygulama meta verilerini güncelleyemez.
- Aynı tarayıcı kullanılarak bile birçok kez yüklenebilir; Bu durumda tüm cihazlar aynı örneğe işaret eder ve aynı depolama alanını kullanır.
QuickApps
Huawei ve ZTE gibi bazı üreticiler, PWA'lara benzeyen ancak farklı bir teknoloji yığını kullanan hafif web uygulamaları oluşturmak için QuickApps olarak bilinen bir platform sunar. Bu cihazlardaki bazı tarayıcılar (ör. Huawei tarayıcı), QuickApp yığınını kullanmasanız bile QuickApp olarak paketlenen PWA'ları yükleyebilir.
PWA'nız QuickApp olarak yüklendiğinde kullanıcılar, kısayolları kullanarak sahip oldukları deneyime benzer bir deneyim yaşar, ancak QuickApps simgesiyle (şimşek resmi) bulunan bir rozetle karşılaşırlar. Uygulama, QuickApp Center'dan da başlatılabilir.
Yükleme isteniyor
Masaüstü ve Android cihazlardaki Chromium tabanlı tarayıcılarda, tarayıcının yükleme iletişim kutusu PWA'nızdan tetiklenebilir. Yükleme İstemi bölümünde, bu işlemin nasıl yapılacağı ile ilgili kalıplar ve bunların nasıl uygulanacağı açıklanmaktadır.
Uygulama katalogları ve mağazaları
PWA'nız ayrıca uygulama kataloglarında ve mağazalarda listelenerek erişimini artırır ve kullanıcıların diğer uygulamalarla aynı yerde bulmasını sağlar. Çoğu uygulama kataloğu ve mağazası, web uygulamasının (HTML'niz ve öğeleriniz gibi) tamamını içermeyen bir paket yayınlamanıza olanak tanıyan teknolojileri destekler. Bu teknolojiler, uygulamayı yükleyecek ve hizmet çalışanının gerekli öğeleri önbelleğe almasını sağlayacak bağımsız bir web oluşturma motoru için yalnızca bir başlatıcı oluşturmanıza olanak tanır.
PWA yayınlamayı destekleyen uygulama katalogları ve mağazaları şunlardır:
- Güvenilir Web Etkinliği kullanarak Android ve ChromeOS için Google Play Store.
- WKWebView ve uygulamaya bağlı alan adları kullanan iOS, macOS ve iPadOS için Apple App Store.
- APPX paketlerini kullanan Windows 10 ve 11 için Microsoft Store.
- Samsung WebAPK para kazanma sunucusunu kullanarak Samsung Galaxy Store.
- HTML uygulamanız için bir QuickApp kapsayıcısı kullanan Huawei AppGallery.
PWA'nın uygulama kataloglarında ve mağazalarda nasıl yayınlanacağı hakkında daha fazla bilgi edinmek istiyorsanız BubbleWrap KSA ve PWA Builder'a göz atın.