Uygulama kısayolları, kullanıcıların sık ihtiyaç duyduğu bazı yaygın işlemlere hızlı bir şekilde erişebilmenizi sağlar.
Web platformu, kullanıcıların üretkenliğini artırmak ve önemli görevlerle yeniden etkileşimi kolaylaştırmak için artık uygulama kısayollarını destekliyor. Web geliştiricilerinin, kullanıcıların sık ihtiyaç duyduğu bazı yaygın işlemlere hızlı erişim sağlamasına olanak tanır.
Bu makalede, uygulama kısayollarını nasıl tanımlayacağınız açıklanmaktadır. Ayrıca, bu konularla ilgili en iyi uygulamalardan bazılarını da öğreneceksiniz.
Uygulama kısayolları hakkında
Uygulama kısayolları, kullanıcıların web uygulamanızdaki yaygın veya önerilen görevleri hızlı bir şekilde başlatmasına yardımcı olur. Uygulama simgesinin gösterildiği her yerden bu görevlere kolayca erişmek, kullanıcıların üretkenliğini artırmanın yanı sıra web uygulamasıyla etkileşimlerini de artırır.
Uygulama kısayolları menüsü, kullanıcının masaüstündeki görev çubuğunda (Windows) veya panelinde (macOS) uygulama simgesini sağ tıklayarak ya da Android'de uygulamanın başlatıcı simgesine dokunup basılı tutarak çağrılır.
Uygulama kısayolları menüsü yalnızca kullanıcının masaüstü veya mobil cihazına yüklenmiş Progresif Web Uygulamaları için gösterilir. Yüklenebilirlik koşulları hakkında bilgi edinmek için "PWA'yı öğrenin" modülümüzde Yükleme bölümüne göz atın.
Her uygulama kısayolu, bir kullanıcı amacını ifade eder. Bu amaçlar, web uygulamanızın kapsamındaki bir URL ile ilişkilendirilir. Kullanıcı uygulama kısayolunu etkinleştirdiğinde URL açılır. Uygulama kısayollarına örnek olarak aşağıdakiler verilebilir:
- Üst düzey gezinme öğeleri (ör. ana sayfa, zaman çizelgesi, son siparişler)
- Arama
- Veri girişi görevleri (ör. e-posta veya tweet oluşturma, makbuz ekleme)
- Etkinlikler (ör. en popüler kişilerle sohbet başlatma)
Web uygulaması manifestinde uygulama kısayollarını tanımlama
Uygulama kısayolları isteğe bağlı olarak web uygulaması manifest'inde tanımlanır. Bu JSON dosyası, tarayıcıya web uygulamanız ve kullanıcının masaüstüne veya mobil cihazına yüklendiğinde nasıl davranması gerektiği hakkında bilgi verir. Daha ayrıntılı olarak belirtmek gerekirse, bu değerler shortcuts
dizi üyesinde tanımlanır. Aşağıda olası bir web uygulaması manifesti örneği verilmiştir.
{
"name": "Player FM",
"start_url": "https://player.fm?utm_source=homescreen",
…
"shortcuts": [
{
"name": "Open Play Later",
"short_name": "Play Later",
"description": "View the list of podcasts you saved for later",
"url": "/play-later?utm_source=homescreen",
"icons": [{ "src": "/icons/play-later.png", "sizes": "192x192" }]
},
{
"name": "View Subscriptions",
"short_name": "Subscriptions",
"description": "View the list of podcasts you listen to",
"url": "/subscriptions?utm_source=homescreen",
"icons": [{ "src": "/icons/subscriptions.png", "sizes": "192x192" }]
}
]
}
shortcuts
dizisinin her üyesi, en az bir name
ve bir url
içeren bir sözlüktür. Diğer üyeler isteğe bağlıdır.
name
- Kullanıcıya gösterilen uygulama kısayolunun okunabilir etiketi.
short_name
(isteğe bağlı)- Alan sınırlı olduğunda kullanılan, kullanıcılar tarafından okunabilen etiket. İsteğe bağlı olsa da bu bilgileri sağlamanız önerilir.
description
(isteğe bağlı)- Uygulama kısayolunun, kullanıcıların okuyabileceği amacı. Bu özellik şu anda kullanılmasa da gelecekte yardımcı teknolojilere dahil edilebilir.
url
- Kullanıcı uygulama kısayolunu etkinleştirdiğinde açılan URL. Bu URL, web uygulaması manifesti kapsamında olmalıdır. Göreli bir URL ise temel URL, web uygulaması manifestinin URL'si olur.
icons
(isteğe bağlı)Görüntü kaynağı nesneleri dizisi. Her nesne
src
ve birsizes
özelliği içermelidir. Web uygulaması manifest simgelerinin aksine, resmintype
isteğe bağlıdır. SVG dosyaları, bu makalenin yazıldığı sırada desteklenmiyor. Bunun yerine PNG kullanın.Piksel mükemmelliğinde simgeler istiyorsanız bunları 48 dp'lik artışlarla sağlayın (ör. 36x36, 48x48, 72x72, 96x96, 144x144, 192x192 piksel simgeler). Aksi takdirde, tek bir 192x192 piksel simge kullanmanız önerilir.
Kalite ölçütü olarak simgeler, Android'de cihazın ideal boyutunun en az yarısı (48 dp) olmalıdır. Örneğin, xxhdpi ekranda gösterilmesi için simgenin en az 72x72 piksel olması gerekir. (Bu, dp birimlerini piksel birimlerine dönüştürme formülünden türetilmiştir.)
Uygulama kısayollarınızı test etme
Uygulama kısayollarınızın doğru şekilde ayarlandığını doğrulamak için Geliştirici Araçları'nın Uygulama panelindeki Manifest bölmesini kullanın.
Bu bölmede, uygulama kısayolları da dahil olmak üzere manifest'inizin birçok özelliğinin kullanıcı tarafından okunabilir bir sürümü sağlanır. Bu, sağlanmışsa tüm kısayol simgelerinin düzgün şekilde yüklendiğini doğrulamanızı kolaylaştırır.
Progressive Web Uygulaması güncellemeleri günde bir kez sınırlandığından uygulama kısayolları tüm kullanıcılar tarafından hemen kullanılamayabilir. Chrome'un web uygulaması manifestindeki güncellemeleri nasıl işlediği hakkında daha fazla bilgi edinin.
En iyi uygulamalar
Uygulama kısayollarını önceliğe göre sıralayın
Kısayolların sırası, manifest dosyasında tanımladığınız sıraya göre belirlenir. Gösterilen uygulama kısayollarının sayısı platforma göre değiştiğinden uygulama kısayollarını önceliğe göre sıralamanızı öneririz. Örneğin, Windows'daki Chrome ve Edge, uygulama kısayollarının sayısını 10 ile sınırlarken Android'deki Chrome yalnızca 3 tane gösterir. Android 7 için Chrome 92'den önce 4'e izin veriliyordu. Chrome 92, uygulama için mevcut kısayol alanlarından birini kullanarak site ayarlarına bir kısayol ekledi.
Farklı uygulama kısayolu adları kullanın
Her zaman görünür olmayabileceğinden, uygulama kısayollarını ayırt etmek için simgelere güvenmemelisiniz. Örneğin, macOS, dock kısayolları menüsündeki simgeleri desteklemez. Her uygulama kısayolu için farklı adlar kullanın.
Uygulama kısayollarının kullanımını ölçme
Uygulama kısayolları url
girişlerini, analiz amacıyla start_url
ile yaptığınız gibi ek açıklamayla belirtmeniz gerekir (ör. url:
"/my-shortcut?utm_source=homescreen"
).
Tarayıcı desteği
Uygulama kısayolları, aşağıda listelenen platformlarda ve sürümlerde kullanılabilir.
Güvenilir Web Etkinliği desteği
Trusted Web Activity kullanan Android uygulamaları oluşturmak için önerilen araç olan Bubblewrap, web uygulaması manifestinden uygulama kısayollarını okur ve Android uygulaması için ilgili yapılandırmayı otomatik olarak oluşturur. Uygulama kısayollarının zorunludur ve Bubblewrap'ta en az 96x96 piksel olması gerektiğini unutmayın.
Bir progresif web uygulamasını kolayca Güvenilir Web Etkinliği'ne dönüştürmenizi sağlayan mükemmel bir araç olan PWABuilder, bazı uyarılarla birlikte uygulama kısayollarını destekler.
Güvenilir Web Etkinliği'ni Android uygulamalarına manuel olarak entegre eden geliştiriciler için aynı davranışları uygulamak amacıyla Android uygulama kısayolları kullanılabilir.
Örnek
Uygulama kısayolları örneğine ve kaynaklarına göz atın.