קיצורי הדרך של האפליקציות מאפשרים גישה מהירה לכמה פעולות נפוצות שהמשתמשים צריכים לבצע לעיתים קרובות.
כדי לשפר את הפרודוקטיביות של המשתמשים ולאפשר עידוד לאינטראקציה חוזרת באמצעות משימות מרכזיות, פלטפורמת האינטרנט תומכת עכשיו בקיצורי דרך של אפליקציות. הם מאפשרים למפתחי אינטרנט לספק גישה מהירה לכמה פעולות נפוצות שהמשתמשים צריכים לעיתים קרובות.
במאמר הזה נסביר איך להגדיר קיצורי דרך של אפליקציות. בנוסף, נלמד על כמה שיטות מומלצות שמשויכות אליהן.
מידע על קיצורי דרך של אפליקציות
קיצורי הדרך של האפליקציות עוזרים למשתמשים להתחיל במהירות משימות נפוצות או מומלצות באפליקציית האינטרנט. גישה קלה למשימות האלה מכל מקום שבו מוצג סמל האפליקציה תשפר את הפרודוקטיביות של המשתמשים ותגביר את המעורבות שלהם באפליקציית האינטרנט.
כדי להפעיל את תפריט קיצורי הדרך של האפליקציות, לוחצים לחיצה ימנית על סמל האפליקציה בשורת המשימות (Windows) או ב-Dock (macOS) במחשב של המשתמש, או לוחצים לחיצה ארוכה על סמל מרכז האפליקציות של האפליקציה ב-Android.
תפריט קיצורי הדרך של האפליקציות מוצג רק ל-Progressive Web Apps שמותקנות במחשב או בנייד של המשתמש. כדאי לעיין במאמר התקנה במודול 'מידע על PWA' כדי לקבל מידע על הדרישות בנוגע להתקנה.
כל קיצור דרך של אפליקציה מבטא את כוונת המשתמש, וכל אחת מהן משויכת לכתובת URL במסגרת ההיקף של אפליקציית האינטרנט. כתובת ה-URL נפתחת כשמשתמש מפעיל את קיצור הדרך לאפליקציה. דוגמאות לקיצורי דרך של אפליקציות:
- פריטי ניווט ברמה העליונה (למשל דף הבית, ציר זמן, הזמנות אחרונות)
- חיפוש
- משימות להזנת נתונים (למשל: כתיבת אימייל או ציוץ, הוספת קבלה)
- פעילויות (למשל, התחלת צ'אט עם אנשי הקשר הפופולריים ביותר)
הגדרת קיצורי דרך לאפליקציות בקובץ המניפסט של אפליקציית האינטרנט
קיצורי דרך של אפליקציות מוגדרים באופן אופציונלי במניפסט של אפליקציית אינטרנט – קובץ JSON שמספק לדפדפן על אפליקציית האינטרנט שלכם ועל ההתנהגות שלה כשהיא מותקנת במחשב או במכשיר הנייד של המשתמש. באופן ספציפי יותר, הם מוצהרים ברכיב המערך shortcuts. דוגמה למניפסט אפשרי של אפליקציית אינטרנט
{
"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 הוא מילון שמכיל לפחות name ו-url. חברים אחרים הם אופציונליים.
name- תווית קריאה אנושית לקיצור הדרך של האפליקציה כשהיא מוצגת למשתמש.
- ֶ
short_name(אופציונלי) - תווית שאנשים יכולים לקרוא כאשר השטח מוגבל. מומלץ לספק אותו, למרות שהוא אופציונלי.
- ֶ
description(אופציונלי) - המטרה של קיצור הדרך לאפליקציה, שקריאה לאנשים. לא משתמשים בה בזמן הכתיבה, אבל יכול להיות שבעתיד תיחשף אליה לטכנולוגיה מסייעת.
url- כתובת ה-URL נפתחת כשמשתמש מפעיל את קיצור הדרך של האפליקציה. כתובת ה-URL הזו חייבת להיכלל בהיקף המניפסט של אפליקציית האינטרנט. אם מדובר בכתובת URL יחסית, כתובת ה-URL הבסיסית תהיה כתובת ה-URL של המניפסט של אפליקציית האינטרנט.
- ֶ
icons(אופציונלי) מערך אובייקטים של משאבי תמונות. כל אובייקט צריך לכלול את המאפיין
srcואת המאפייןsizes. בניגוד לסמלי מניפסט של אפליקציות אינטרנט,typeשל התמונה הוא אופציונלי. אין תמיכה בקובצי SVG בזמן הכתיבה. במקום זאת, צריך להשתמש ב-PNG.אם רוצים שהסמלים יהיו מושלמים בפיקסלים, אפשר להוסיף אותם במרווחים של 48dp (לדוגמה: סמלים של 36x36, 48x48, 72x72, 96x96 , 144x144 או 192x192 פיקסלים). אחרת, מומלץ להשתמש בסמל יחיד של 192x192 פיקסלים.
כדי למדוד את האיכות, הסמלים צריכים להיות לפחות חצי מהגודל האידיאלי של המכשיר ב-Android, שהוא 48dp. לדוגמה, כדי שהסמל יוצג במסך xxhdpi, הסמל צריך להיות בגודל של 72 על 72 פיקסלים לפחות. (הנתון הזה נגזר מהנוסחה להמרה של יחידות dp ליחידות פיקסלים.)
בדיקת קיצורי הדרך של אפליקציות
כדי לוודא שקיצורי הדרך של האפליקציות מוגדרים כראוי, משתמשים בחלונית Manifest בחלונית Application ב-DevTools.
בחלונית הזו מופיעה גרסה קריאה לאנשים של רבים ממאפייני המניפסט, כולל קיצורי דרך של אפליקציות. קל לוודא שכל הסמלים של קיצורי הדרך נטענים כמו שצריך, אם יש כאלה.
יכול להיות שקיצורי הדרך של האפליקציות לא יהיו זמינים באופן מיידי לכל המשתמשים, כי עדכונים מסוג Progressive Web App מוגבלים לפעם אחת ביום. כך Chrome מטפל בעדכונים של קובץ המניפסט של אפליקציית האינטרנט
שיטות מומלצות
סדר את קיצורי הדרך של האפליקציות לפי עדיפות
קיצורי הדרך מוצגים לפי הסדר שבו הגדרתם אותם במניפסט. אנחנו ממליצים לסדר את קיצורי הדרך של האפליקציות לפי עדיפות כי המגבלה על מספר קיצורי הדרך של האפליקציות שמוצגות משתנה לפי הפלטפורמה. לדוגמה, Chrome ו-Edge ב-Windows מגבילים את מספר קיצורי הדרך של האפליקציות ל-10, ו-Chrome ל-Android מציג רק את 3. לפני Chrome 92 ל-Android 7, 4 היה אפשר להשתמש בו. ב-Chrome 92 הוסיף קיצור דרך להגדרות האתר, באמצעות אחד מהמקומות הזמינים לקיצורי דרך באפליקציה.
להשתמש בשמות ייחודיים של קיצורי דרך לאפליקציות
לא כדאי להסתמך על סמלים כדי להבדיל בין קיצורי הדרך של האפליקציות, כי יכול להיות שהם לא יוצגו תמיד. לדוגמה, ב-macOS אין תמיכה בסמלים בתפריט קיצורי הדרך של העגינה. כדאי להשתמש בשמות ייחודיים לכל קיצור דרך של אפליקציה.
מדידת השימוש בקיצורי דרך של אפליקציות
כדאי להוסיף הערות לרשומות url של קיצורי הדרך לאפליקציות, כמו שהייתם עושים עם start_url למטרות ניתוח נתונים (למשל, url:
"/my-shortcut?utm_source=homescreen").
תמיכת דפדפן
קיצורי דרך של אפליקציות זמינים בפלטפורמות ובגרסאות שמפורטות בהמשך.
תמיכה בנושא פעילות באינטרנט מהימנה
Arrowwrap, הכלי המומלץ לבניית אפליקציות ל-Android שמשתמשות בפעילות באינטרנט מהימנה, קורא קיצורי דרך של אפליקציות מהמניפסט של אפליקציית האינטרנט ויוצר באופן אוטומטי את ההגדרות האישיות המתאימות לאפליקציית Android. שימו לב שהסמלים לקיצורי הדרך של האפליקציות הם חובה וצריכים להיות בגודל 96 על 96 פיקסלים לפחות ב-Buawrap.
PWABuilder היא כלי נהדר שהופך בקלות Progressive Web App לפעילות מהימנה באינטרנט. הוא תומך בקיצורי דרך של אפליקציות עם כמה נקודות חשובות.
אם אתם מפתחים שמשלבים את התכונה 'פעילות אינטרנט מהימנה' באופן ידני באפליקציה ל-Android, תוכלו להשתמש בקיצורי דרך של אפליקציות ל-Android כדי להטמיע את אותן התנהגויות.
דוגמה
מומלץ לעיין בדוגמה לקיצורי דרך לאפליקציות ובמקור שלה.