Bir aşamalı web uygulaması oluşturma ve dağıtma

Aşamalı web uygulamanızı (PWA) yapılandırmak için Power Pages tasarım stüdyosunu kullanın. PWA özelliğini etkinleştirebilir veya devre dışı bırakabilirsiniz. PWA ayarlarını özelleştirebilir ve isterseniz ilgili cihaz mağazalarında yayımlamak üzere bir uygulama paketi oluşturmaya hazırlanabilirsiniz.

1. Şuraya git: Power Pages.

2. Sitenizi ve ardından Düzenle'yi seçin.

3. Tasarım stüdyosunda Kurulum çalışma alanını ve ardından Aşamalı web uygulaması'nı seçin.

   

4. PWA'yı etkinleştir'i seçin.

   

Uygulamanıza marka verin

Uygulama adını, başlangıç sayfasını, rengi ve daha fazlasını değiştirmek için özelleştirme seçeneklerini kullanarak kendi markalı PWA'nızı oluşturabilirsiniz.

1. Tasarım stüdyosunda Aşamalı Web Uygulaması'nı seçin.

2. Siteniz için aşağıdaki PWA ayarlarını güncelleştirin.

   Ayar	Description
   Title	Mobil cihazda ve uygulama mağazasında görüntülenecek portal PWA'sının adı.
   Description	Mobil cihazda ve uygulama mağazasında görüntülenecek PWA'nın açıklaması.
   Uygulamanın başlangıç sayfası	PWA aracılığıyla açıldığında sitenin başlangıç sayfası.
   Giriş ekranı arka planı	PWA yüklendiğinde giriş ekranının arka plan rengi.
   Uygulama simgesi	Mobil cihazda ve uygulama mağazasında görüntülenecek uygulamanın simgesi. Not: Maksimum yükleme boyutu 5 MB olan .jpg, .jpeg, .png biçimlerini destekler. Simgenin boyutu 512 x 512 piksel olmalıdır.

   Not

   Tarayıcınıza bağlı olarak, değişikliklerinizi yansıtması birkaç dakika sürebilir. PWA'yı özelleştirdikten sonra sitenizin önbelleğini temizlemek için Önizle'yi seçin.

Çevrimdışı davranışı tanımlama

PWA, kullanılan cihaz çevrimdışı olduğunda veya internet bağlantısı kesildiğinde çevrimdışı bir gezinti deneyimi desteği sunar. Sitenizde çevrimdışı olarak kullanılabilen (salt okunur) sayfaları ve çevrimdışı erişim için etkinleştirilmemiş diğer portal özellikleri için bir ileti sayfası seçebilirsiniz.

PWA portalı için çevrimdışı sayfaları yapılandırma

1. Tasarım stüdyosundaki Kurulum çalışma alanında, Aşamalı web uygulaması'nı seçin.

2. Diğer ayarlar altında Çevrimdışı sayfaları tanımlayın seçeneğini belirleyin.

   

3. Kullanıcıların çevrimdışı kullandıklarında PWA'ya erişimlerini etkinleştirmek istediğiniz sayfaları seçin.

   

Çevrimdışı ileti sayfası ayarlama

Cihaz çevrimdışı olduğunda, kullanıcılar çevrimdışı erişim için etkinleştirilmemiş sayfalara erişmeyi denerse çevrimdışı ileti sayfası olarak yapılandırdığınız sayfa görüntülenir.

1. Tasarım stüdyosunda Sayfalar çalışma alanını seçin.

2. Varsayılan çevrimdışı sayfa'yı seçin.

3. Sayfayı özelleştirin.

Çevrimdışı modda sitenizi sınama

Çevrimdışı sayfalar etkinleştirildikten sonra çevrimdışı modda bir mobil cihaz kullanabilir ve çevrimdışı erişim için etkin olan farklı sayfalara göz atabilirsiniz.

1. Mobil cihazınızda çevrimiçi modda bir web tarayıcısı kullanarak sitenize göz atın.

2. Giriş ekranına ekle veya benzer bir seçeneği belirleyin. Örneğin, Android cihazında bu seçenek + Şuraya ekle>Uygulama ekranı olabilir.

   

   Not

   Bu eylemle çevrimdışı göz atma için etkinleştirilen portal sayfaları indirilir. Bu işlem, ağ bant genişliğine ve çevrimdışı göz atma için seçilen sayfaların boyutuna bağlı olarak biraz zaman alabilir.

3. Mobil cihazınız için çevrimdışı modu etkinleştirin.

4. Portalınızı giriş ekranından açın. Üst kısımda çevrimdışı modda göz atma gerçekleştirdiğinizi anımsatan bir bildirim görürsünüz. Çevrimdışı göz atma için etkinleştirilmemiş sayfaları seçerseniz çevrimdışı iletisi görüntülenir.

   

Uygulamanızı dağıtma

Uygulamanızı bir tarayıcı kullanarak ya da bir uygulama mağazası aracılığıyla dağıtabilirsiniz.

Uygulamanızı tarayıcı kullanarak dağıtma

Portalınız PWA olarak etkinleştirildikten sonra kullanıcılarınız, cihazlarındaki giriş ekranına Power Pages sitesini bir uygulama olarak sabitleyebilir. Bu seçenek, tüm form faktörlerinin (mobil, masaüstü ve tablet) yanı sıra tüm platformlarda (Android, iOS, Chromebook ve Windows) desteklenir.

Aşağıdaki grafik, portalı bir PWA olarak yükleyen tarayıcıyı kullanarak giriş ekranlarına portal eklerken kullanıcıların deneyimlerini gösterir.

Android ve iOS, tarayıcı tabanlı yükleme için farklı bir yöntem sunar.

Uygulamanızı bir uygulama mağazası üzerinden dağıtma

Aşamalı web uygulamaları, Android, iOS ve Windows için uygulama mağazaları üzerinden de dağıtılabilir. Bu dağıtım bir uygulama paketi oluşturup uygulamayı ilgili uygulama mağazasına yayımlayarak yapılır. Uygulama paketlerini oluşturmak için çeşitli uygulama mağazaları için uygulama paketleri oluşturmak üzere bir platform sağlayan PWABuilder ile iş ortağıyız.

Bir uygulama paketi oluşturmak için Design Studio'da çalışma alanını Ayarla'ya gidin. Uygulama paketi altında, Uygulama paketi oluştur'u seçin.

Çeşitli uygulama mağazaları için uygulama paketi oluşturabileceğiniz PWA Oluşturucusu web sitesine yönlendirilirsiniz. PWA Oluşturucusu'nu kullanarak oluşturduğunuz paket şunları içerir:

• İlgili uygulama mağazasında kullanılacak PWA için uygulama paketi.

• Uygulamayı yayımlama hakkında adım adım belge.

Daha fazla bilgi için PWA kaynak merkezi bölümüne gidin.

iOS için, PWABuilder uygulama mağazası paketi oluşturmak için destek sağlar. Daha fazla bilgi için bkz: App Store için paket.

Windows için, Microsoft Store paketine bakın.

Android için dikkat edilmesi gereken diğer noktalar

Android platformu için Android sertifikasını Android sertifikasını güncelleştir seçeneğini kullanarak da güncelleştirebilirsiniz.

PWA'nızın sahipliğini kanıtlayan dijital varlık bağlantılarını (assetlinks.json) güncelleştirmek için başlığı ve SHA-256 sertifikası parmak izini güncelleştirin.

Ayrıca bkz.

Progresif web uygulamaları olarak sitelere genel bakış
Progresif Web Uygulamalarına (PWA'lar) Genel Bakış
Aşamalı web uygulamaları oluşturma ve dağıtma (video)