Skróty do aplikacji zapewniają szybki dostęp do kilku typowych działań, których użytkownicy często potrzebują.
Aby zwiększyć produktywność użytkowników i ułatwić ich ponowne zaangażowanie w kluczowe zadania, platforma internetowa obsługuje teraz skróty do aplikacji. Pozwalają programistom stron internetowych zapewnić szybki dostęp do kilku typowych działań, których użytkownicy często potrzebują.
Z tego artykułu dowiesz się, jak zdefiniować skróty do aplikacji. Poznasz także niektóre powiązane sprawdzone metody.
Skróty do aplikacji
Skróty do aplikacji pomagają użytkownikom szybko wykonywać typowe lub zalecane zadania w Twojej aplikacji internetowej. Łatwy dostęp do nich z dowolnego miejsca, w którym wyświetla się ikona aplikacji, zwiększy ich produktywność i zaangażowanie w aplikację.
Menu skrótów do aplikacji wyświetla się po kliknięciu prawym przyciskiem myszy ikony aplikacji na pasku zadań (Windows) lub Docku (macOS) na pulpicie użytkownika albo przez naciśnięcie i przytrzymanie ikony programu uruchamiającego aplikacji na Androidzie.
Menu skrótów do aplikacji jest widoczne tylko w przypadku progresywnych aplikacji internetowych, które są zainstalowane na komputerze lub urządzeniu mobilnym użytkownika. Aby dowiedzieć się więcej o wymaganiach związanych z możliwością instalacji, zapoznaj się z sekcją Instalacja w module „Poznaj PWA”.
Każdy skrót do aplikacji wyraża intencję użytkownika, z którego każda jest powiązana z adresem URL w zakresie Twojej aplikacji internetowej. Adres URL jest otwierany, gdy użytkownik aktywuje skrót do aplikacji. Oto przykłady skrótów aplikacji:
- Elementy nawigacyjne najwyższego poziomu (np. strona główna, oś czasu, ostatnie zamówienia)
- Wyszukiwarka
- Zadania związane z wprowadzaniem danych (np. pisanie e-maila lub tweeta, dodawanie potwierdzenia)
- Czynności (np. rozpoczynanie czatu z najpopularniejszymi kontaktami)
Zdefiniuj skróty do aplikacji w pliku manifestu aplikacji internetowej
Skróty do aplikacji są opcjonalnie zdefiniowane w manifeście aplikacji internetowej, czyli pliku JSON, który informuje przeglądarkę o aplikacji internetowej i jej działaniu po zainstalowaniu na komputerze lub urządzeniu mobilnym użytkownika. Dokładniej rzecz ujmując, są one deklarowane w tablicy shortcuts. Poniżej znajdziesz przykład potencjalnego pliku manifestu aplikacji internetowej.
{
"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" }]
}
]
}
Każdy element tablicy shortcuts jest słownikiem zawierającym co najmniej name i url. Pozostali członkowie są opcjonalnie.
name- Czytelna dla człowieka etykieta skrótu do aplikacji wyświetlana użytkownikowi.
short_name(opcjonalnie)- Czytelna dla człowieka etykieta używana w sytuacjach, gdy ilość miejsca jest ograniczona. Zalecamy jego podanie, choć jest to opcjonalne.
description(opcjonalnie)- Czytelny dla człowieka cel skrótu do aplikacji. Nie jest ono używane w czasie pisania, ale w przyszłości może być wykorzystywane przez technologie wspomagające osoby z niepełnosprawnością.
url- Adres URL otwiera się, gdy użytkownik aktywuje skrót do aplikacji. Ten URL musi należeć do zakresu pliku manifestu aplikacji internetowej. Jeśli jest to adres względny, podstawowym adresem URL jest adres URL pliku manifestu aplikacji internetowej.
icons(opcjonalnie)Tablica obiektów zasobów obrazu. Każdy obiekt musi zawierać właściwość
srcisizes. W przeciwieństwie do ikona manifestu aplikacji internetowej wartośćtypeobrazu jest opcjonalna. Pliki SVG nie są obsługiwane w momencie ich tworzenia. Użyj formatu PNG.Jeśli chcesz, aby ikony miały idealne piksele, podawaj je w przyrostach co 48 dp (tzn. ikony 36 x 36, 48 x 48, 72 x 72, 96 x 96, 144 x 144, 192 x 192 piksele). W przeciwnym razie zalecamy użycie pojedynczej ikony o wymiarach 192 x 192 piksele.
Jako wskaźnik jakości ikony muszą zajmować co najmniej połowę idealnego rozmiaru urządzenia z Androidem, czyli 48 dp. Na przykład wyświetlana na ekranie xxhdpi musi mieć rozmiar co najmniej 72 x 72 piksele. (wynik uzyskuje się ze wzoru do przeliczania jednostek dp na jednostki pikseli).
Testowanie skrótów do aplikacji
Aby sprawdzić, czy skróty do aplikacji są prawidłowo skonfigurowane, użyj panelu Plik manifestu w panelu Aplikacja Narzędzi deweloperskich.
Ten panel zawiera zrozumiałą dla człowieka wersję wielu właściwości pliku manifestu, w tym skrótów do aplikacji. Ułatwia to sprawdzenie, czy wszystkie ikony skrótów ładują się prawidłowo, jeśli są dostępne.
Skróty do aplikacji mogą nie być dostępne od razu dla wszystkich użytkowników, ponieważ progresywne aktualizacje aplikacji internetowych są ograniczone do raz dziennie. Dowiedz się więcej o tym, jak Chrome obsługuje aktualizacje pliku manifestu aplikacji internetowej.
Sprawdzone metody
Uporządkuj skróty do aplikacji według priorytetu
Skróty są wyświetlane w kolejności, w jakiej zostały zdefiniowane w pliku manifestu. Zachęcamy do uporządkowania skrótów do aplikacji według priorytetu, ponieważ limit liczby wyświetlanych skrótów do aplikacji zależy od platformy. Na przykład w Chrome i Edge w systemie Windows liczba skrótów aplikacji jest ograniczona do 10, a w Chrome na Androida – tylko 3. Przed wersją Chrome 92 na Androida 7 były dozwolone. Chrome 92 dodał skrót do ustawień witryny, udostępniając jeden z dostępnych boksów skrótów dla aplikacji.
Używaj różnych nazw skrótów do aplikacji
Nie należy polegać na ikonach do rozróżniania skrótów do aplikacji, ponieważ mogą one nie zawsze być widoczne. Na przykład macOS nie obsługuje ikon w menu skrótów stacji dokującej. Każdy skrót do aplikacji powinien mieć inną nazwę.
Pomiar wykorzystania skrótów do aplikacji
Dodawaj adnotacje do wpisów url do skrótów aplikacji, tak jak w przypadku elementu start_url do celów analitycznych (np. url:
"/my-shortcut?utm_source=homescreen").
Obsługiwane przeglądarki
Skróty do aplikacji są dostępne na platformach i wersjach wymienionych poniżej.
Obsługa Zaufanej aktywności internetowej
Bubblewrap, zalecane narzędzie do tworzenia aplikacji na Androida, które korzystają z zaufanej aktywności internetowej, odczytuje skróty do aplikacji z pliku manifestu aplikacji internetowej i automatycznie generuje odpowiednią konfigurację aplikacji na Androida. Pamiętaj, że ikony skrótów do aplikacji są wymagane i muszą mieć rozmiar co najmniej 96 x 96 pikseli w Bubblewrap.
PWABuilder, świetne narzędzie do łatwego przekształcania progresywnej aplikacji internetowej w zaufaną aktywność w internecie, obsługuje skróty do aplikacji, ale mają pewne zastrzeżenia.
Deweloperzy, którzy ręcznie integrują zaufaną aktywność w internecie z aplikacją na Androida, mogą wdrożyć te same skróty, korzystając ze skrótów do aplikacji na Androida.
Przykład
Zobacz przykładowe skróty do aplikacji i ich źródło.