אחרי שהמשתמש יתקין את ה-PWA, האפליקציה:
- יופיע סמל במרכז האפליקציות, במסך הבית, בתפריט ההתחלה או בלוח ההפעלה.
- מופיעות כתוצאה מכך כשמשתמש מחפש את האפליקציה במכשיר שלו.
- להכיל חלון נפרד במערכת ההפעלה.
- תמיכה ביכולות ספציפיות.
קריטריונים להתקנה
לכל דפדפן יש קריטריון שמסמן מתי אתר או אפליקציית אינטרנט הם Progressive Web App, ואפשר להתקין אותם לחוויה עצמאית. המטא-נתונים של ה-PWA מוגדרים באמצעות קובץ מבוסס JSON שנקרא 'מניפסט של אפליקציית אינטרנט'. נרחיב על כך בהרחבה במודול הבא.
כדרישה מינימלית להתקנה, רוב הדפדפנים שתומכים בו משתמשים בקובץ המניפסט של אפליקציות האינטרנט, ובמאפיינים מסוימים כמו שם האפליקציה והגדרות של ממשק ההתקנה. יוצא הדופן במקרה הזה הוא Safari ל-macOS, שלא תומך ביכולת ההתקנה.
הדרישות לאישור התקנה שונות בדפדפנים השונים. המאמר הזה מפרט את הקריטריונים ל-Google Chrome וכולל קישורים לדרישות לגבי דפדפנים אחרים.
מאחר שהבדיקה ש-PWA עומדת בדרישות יכולת ההתקנה עשויה להימשך כמה שניות, יכול להיות שאפשרות ההתקנה לא תהיה זמינה מיד לאחר קבלת תגובה לגבי כתובות URL.
התקנה במחשב
נכון לעכשיו, התקנת PWA למחשב נתמכת ב-Google Chrome וב-Microsoft Edge ב-Linux, ב-Windows, ב-macOS ובמכשירי Chromebook. בדפדפנים האלה יוצג תג התקנה (סמל) בסרגל כתובות ה-URL (ראו בתמונה שלמטה), כדי לציין שניתן להתקין את האתר הנוכחי.
כשמשתמש יוצר אינטראקציה עם אתר, הוא עשוי לראות חלון קופץ, כמו הדף שלמטה, שמזמין את המשתמשים להתקין את האתר כאפליקציה.
התפריט הנפתח של הדפדפן כולל גם את האפשרות "התקנה
במערכות הפעלה למחשב יש תמיכה רק במצבי עצמאיים ובמצב מינימלי.
אפליקציות PWA שהותקנו במחשבים:
- יופיע סמל בתפריט 'התחלה' או במסך 'התחלה' במחשבי Windows, במגש האפליקציות או בשולחן העבודה בממשקי GUI של Linux, בלוח ההפעלה של macOS או במרכז האפליקציות של Chromebook.
- יופיע סמל במעבר בין אפליקציות ובתחנות עגינה כשהאפליקציה פעילה, הייתה בשימוש לאחרונה או שנפתחת ברקע.
- תוכלו להופיע בחיפוש האפליקציות. לדוגמה, 'חיפוש ב-Windows' או 'Spotlight' ב-macOS.
- הם יכולים להגדיר מספר תגים בסמלים שלהם כדי לציין התראות חדשות. הפעולה הזו מתבצעת באמצעות Badging API.
- אתם יכולים להגדיר תפריט הקשר לסמל באמצעות קיצורי דרך של אפליקציות.
- לא ניתן להתקין פעמיים באותו דפדפן.
אחרי שמתקינים אפליקציה במחשב, המשתמשים יכולים לעבור אל about:apps, ללחוץ לחיצה ימנית על PWA ולבחור באפשרות 'הפעלת האפליקציה בכניסה לחשבון' אם הם רוצים שהאפליקציה תיפתח באופן אוטומטי בהפעלה.
התקנת iOS ו-iPadOS
לא מופיעה בקשה בדפדפן להתקנת ה-PWA ב-iOS וב-iPadOS. בפלטפורמות האלה, אפליקציות PWA נקראות גם אפליקציות אינטרנט במסך הבית. את האפליקציות האלה צריך להוסיף באופן ידני למסך הבית באמצעות תפריט שזמין רק ב-Safari. מומלץ להוסיף את התג apple-touch-icon ל-HTML.
כדי להגדיר את הסמל, צריך לכלול את הנתיב אל הסמל לקטע <head> של ה-HTML, באופן הבא:
<link rel="apple-touch-icon" href="/icons/ios.png">
המידע הזה ישמש את Safari כדי ליצור את קיצור הדרך. אם לא סיפקת סמל ספציפי למכשירי Apple, הסמל במסך הבית יהיה צילום מסך של ה-PWA כשהמשתמש התקין אותה.
חשוב להבין שהתקנת PWA זמינה רק אם המשתמש מעיין באתר דרך Safari. בדפדפנים אחרים שזמינים ב-App Store, כמו Google Chrome, Firefox, Opera או Microsoft Edge, אי אפשר להתקין PWA במסך הבית.
השלבים להוספת אפליקציות למסך הבית הם:
- פותחים את תפריט השיתוף שזמין בחלק התחתון או בחלק העליון של הדפדפן.
- לוחצים על הוספה למסך הבית.
- אישור שם האפליקציה. השם ניתן לעריכה על ידי המשתמש.
- לוחצים על הוספה. ב-iOS וב-iPadOS, סימניות לאתרים ואפליקציות PWA נראות באותו מסך במסך הבית.
ב-iOS וב-iPadOS, אפשר להשתמש רק במצב התצוגה הנפרד. לכן, אם אתם משתמשים במצב ממשק משתמש מינימלי, הוא יחזור לקיצור הדרך בדפדפן. אם משתמשים במסך מלא, הוא יחזור לתצוגה עצמאית.
אפליקציות PWA שהותקנו ב-iOS וב-iPadOS:
- להופיע במסך הבית, בחיפוש של Spotlight, בהצעות של Siri ובחיפוש בספריית האפליקציות.
- לא להופיע בתיקיות הקטגוריות של גלריית האפליקציות.
- אין תמיכה ביכולות כמו תגים וקיצורי דרך של אפליקציות.
אגב, Safari משתמש בטכנולוגיה מקורית שנקראת Web Clips (קליפים של אינטרנט) כדי ליצור את סמלי ה-PWA במערכת ההפעלה. אלה רק קובצי XML בפורמט רשימת הנכסים של Apple שמאוחסנים במערכת הקבצים.
התקנה ב-Android
ב-Android, ההנחיות להתקנת PWA משתנות בהתאם למכשיר ולדפדפן. המשתמשים עשויים לראות:
- הבדלים בניסוח של האפשרות בתפריט להתקנה, כמו התקנה או הוספה למסך הבית.
- תיבות דו-שיח מפורטות להתקנה.
בתמונה הבאה אתם יכולים לראות שתי גרסאות שונות של תיבת דו-שיח להתקנה, מיני-סרגל מידע פשוט (בצד שמאל) ותיבת דו-שיח מפורטת להתקנה (בצד ימין).
בהתאם למכשיר ולדפדפן, אפליקציית ה-PWA תותקן כ-WebAPK, כקיצור דרך או כ-QuickApp.
WebAPKs
WebAPK היא חבילת Android (APK) שנוצרה על ידי ספק מהימן של המכשיר של המשתמש, בדרך כלל בענן, בשרת הנפקה של WebAPK. השיטה הזו משמשת את Google Chrome במכשירים שבהם מותקנים שירותי Google Mobile Services (GMS) ובדפדפן האינטרנט של Samsung, אך רק במכשירים מתוצרת Samsung, כמו טלפון או טאבלט מדגמי Galaxy. ביחד, הם רוב משתמשי Android.
כשמשתמש מתקין PWA מ-Google Chrome ונעשה שימוש ב-WebAPK, שרת ההנפקה 'mints' (חבילות) וחותם על APK עבור ה-PWA. התהליך הזה לוקח זמן, אבל כשה-APK מוכן, הדפדפן מתקין את האפליקציה במצב שקט במכשיר המשתמש. ספקים מהימנים (Play Services או Samsung) חתמו על ה-APK, ולכן הטלפון מתקין אותו בלי להשבית את האבטחה, כמו כל אפליקציה שמגיעה מהחנות. אין צורך בהתקנה ממקור לא ידוע.
אפליקציות PWA שהותקנו דרך WebAPK:
- יופיע סמל במרכז האפליקציות ובמסך הבית.
- מופיע ב'הגדרות', 'אפליקציות'.
- יכולות להיות כמה יכולות, כמו הוספת תגים, קיצורי דרך של אפליקציות ותיעוד קישורים בתוך מערכת ההפעלה.
- אפשרות לעדכן את הסמל ואת המטא-נתונים של האפליקציה.
- לא ניתן להתקין פעמיים.
קיצורי דרך
חבילות APK מספקות את החוויה הטובה ביותר למשתמשי Android, אבל לא תמיד אפשר ליצור אותן. אם הם לא מצליחים, הדפדפנים חוזרים ליצירת קיצור דרך לאתר. מאחר שב-Firefox, Microsoft Edge, Opera, Brave ו-Samsung Internet (במכשירים שאינם של Samsung) אין שרתי הטמעה מהימנים, הם ייצרו קיצורי דרך. גם Google Chrome אם שירות הכרייה לא זמין או שה-PWA לא עומדת בדרישות ההתקנה.
אפליקציות PWA שהותקנו עם קיצורי דרך:
- יוצג סמל עם תג של דפדפן במסך הבית (ראו הדוגמאות הבאות).
- לא מופיע סמל במרכז האפליקציות או בהגדרות, אפליקציות.
- אי אפשר להשתמש ביכולות שמצריכות התקנה.
- אי אפשר לעדכן את הסמלים ואת המטא-נתונים של האפליקציה שלהם.
- ניתן להתקין אותם פעמים רבות, גם באמצעות אותו דפדפן. במקרה כזה, כל הקבצים יפנו לאותו מופע וישתמשו באותו נפח אחסון.
QuickApps
חלק מהיצרנים, כולל Huawei ו-ZTE, מציעים פלטפורמה שנקראת QuickApps ליצירת אפליקציות אינטרנט פשוטות, דומות לאפליקציות PWA, אבל באמצעות סטאק תוכנות אחר. בדפדפנים מסוימים במכשירים האלה, כמו הדפדפן של Huawei, אפשר להתקין אפליקציות PWA שנארזות בתור QuickApp, גם אם אתם לא משתמשים במקבץ של QuickApp.
אם אפליקציית ה-PWA שלכם תותקן כאפליקציית QuickApp, המשתמשים יקבלו חוויה דומה לזו שהיו להם עם קיצורי דרך, אבל עם סמל עם סמל התיוג של QuickApps (תמונת ברק). האפליקציה תהיה זמינה להפעלה גם מ-QuickApp Center.
הצגת בקשה להתקנה
בדפדפנים המבוססים על Chromium במחשבים ובמכשירי Android, אפשר להפעיל את תיבת הדו-שיח להתקנה של הדפדפן מתוך ה-PWA. בפרק של הוראות ההתקנה מוסבר על הדפוסים לביצוע הפעולות האלה ואת אופן ההטמעה שלהם.
קטלוגים של אפליקציות וחנויות
אפשר לפרסם את האפליקציה מסוג PWA גם בקטלוגים של אפליקציות ובחנויות כדי להגדיל את פוטנציאל החשיפה ולאפשר למשתמשים למצוא אותה באותו מקום שבו הם מוצאים אפליקציות אחרות. רוב החנויות והקטלוגים של האפליקציות תומכים בטכנולוגיות שמאפשרות לפרסם חבילה שלא כוללת את אפליקציית האינטרנט כולה (כמו ה-HTML והנכסים). הטכנולוגיות האלה מאפשרות ליצור רק מרכז אפליקציות למנוע רינדור אינטרנט עצמאי שיטען את האפליקציה ויאפשר ל-Service Worker לשמור במטמון את הנכסים הדרושים.
החנויות והקטלוגים של האפליקציות שתומכים בפרסום PWA הם:
- חנות Google Play ל-Android ול-ChromeOS, באמצעות פעילות באינטרנט מהימנה.
- Apple App Store ל-iOS, ל-macOS ול-iPadOS באמצעות WKWebView ו-App-Bound Domains.
- Microsoft Store ל-Windows 10 ו-Windows 11, באמצעות חבילות APPX.
- Samsung Galaxy Store, באמצעות שרת הטבעה של Samsung WebAPK.
- Huawei AppGallery, באמצעות מאגר של QuickApp לאפליקציית ה-HTML.
למידע נוסף על פרסום אפליקציה מסוג PWA בחנויות ובקטלוגים של אפליקציות, אפשר להיעזר ב-בועת בועות ב-CLI ובPWA של PWA.