בעבר, התקנת אפליקציות הייתה אפשרית רק בהקשר של אפליקציות ספציפיות לפלטפורמה. כיום, אפליקציות אינטרנט מודרניות מציעות חוויות התקנה שמספקות את אותה רמת שילוב ואמינות כמו אפליקציות ספציפיות לפלטפורמה.
ניתן לעשות זאת בכמה דרכים:
- התקנת ה-PWA מהדפדפן.
- התקנת ה-PWA מחנות האפליקציות.
ערוצי הפצה שונים הם דרך מצוינת להגיע למספר גדול של משתמשים, אבל בחירת האסטרטגיה המתאימה לקידום התקנת ה-PWA יכולה להיות מאתגרת.
במדריך הזה מתוארות שיטות מומלצות לשילוב בין אפשרויות התקנה שונות כדי להגדיל את קצבי ההתקנה ולמנוע תחרות על הפלטפורמה וקניבליזציה. חבילת ההתקנה הזו כוללת אפליקציות PWA שהותקנו גם מהדפדפן וגם מ-App Store, וגם מאפליקציות ספציפיות לפלטפורמה.
למה כדאי להתקין את אפליקציית האינטרנט?
אפליקציות מסוג Progressive Web App מותקנות פועלות בחלון נפרד במקום בכרטיסייה בדפדפן. אפשר להפעיל אותן ממסך הבית, ממגש האפליקציות, משורת המשימות או מהמדף של המשתמש. אפשר לחפש אותן במכשיר ולדלג ביניהן באמצעות מחליף האפליקציות, וכך לגרום להן להרגיש כמו חלק מהמכשיר שבו הן מותקנות.
עם זאת, השימוש באפליקציית אינטרנט שניתנת להתקנה וגם באפליקציה ספציפית לפלטפורמה יכול לבלבל את המשתמשים. יכול להיות שעדיף להשתמש באפליקציות ספציפיות לפלטפורמה של משתמשים מסוימים, אבל למשתמשים אחרים יכולות להיות חסרונות מסוימים:
- מגבלות אחסון: יכול להיות שהתקנה של אפליקציה חדשה תגרום למחיקה של אפליקציות אחרות או לפינוי מקום על ידי הסרת תוכן חשוב. האפשרות הזו פוגעת במיוחד למשתמשים במכשירים פשוטים.
- רוחב פס זמין: הורדת אפליקציה יכולה להיות תהליך יקר ואיטי, חשוב יותר למשתמשים שמחוברים לחיבורים איטיים ולתוכניות נתונים יקרות.
- העברת מידע לאפליקציה: יציאה מהאתר ומעבר לחנות כדי להוריד את האפליקציה יוצרת חיכוך נוסף ומעכבת פעולה של משתמש שניתן לבצע ישירות באינטרנט.
- מחזור עדכון: ביצוע שינויים באפליקציות ספציפיות לפלטפורמה מצריך מעבר של תהליך בדיקת אפליקציה, שעשוי להאט את השינויים והניסויים (לדוגמה, בדיקות A/B).
במקרים מסוימים, אחוז המשתמשים שלא יורידו את האפליקציה הספציפית לפלטפורמה שלך עשוי להיות גדול, למשל: משתמשים שחושבים שהם לא ישתמשו באפליקציה לעיתים קרובות, או שלא יכולים להצדיק הוצאה של כמה מגה-בייט של אחסון או נתונים. אפשר לקבוע את גודל הפלח הזה במספר דרכים, למשל על ידי שימוש בהגדרת ניתוח נתונים כדי לעקוב אחר האחוז של 'אינטרנט לנייד בלבד' משתמשים.
אם גודל הפלח הזה משמעותי, זו אינדיקציה טובה לכך שאתם צריכים לספק דרכים חלופיות להתקנה של חוויות השימוש שלכם.
קידום התקנת PWA באמצעות הדפדפן
אם יש לכם PWA באיכות גבוהה, יכול להיות שעדיף לקדם את ההתקנה שלה על פני האפליקציה הספציפית לפלטפורמה שלכם. לדוגמה, אם באפליקציה הספציפית לפלטפורמה חסרה פונקציונליות שה-PWA מציעה, או אם היא לא עודכנה במשך זמן מה. כדאי גם לקדם את ההתקנה של ה-PWA, אם האפליקציה הספציפית לפלטפורמה לא עברה אופטימיזציה למסכים גדולים יותר, כמו ב-ChromeOS.
בחלק מהאפליקציות, קידום התקנות של אפליקציות ספציפיות לפלטפורמה הוא חלק מרכזי מהמודל העסקי. במקרה כזה, הגיוני לקדם התקנה של אפליקציה ספציפית לפלטפורמה. אבל יש משתמשים שמעדיפים להישאר באינטרנט. אם אפשר לזהות את הפלח הזה, אפשר להציג את ההצעה לפעולה מסוג PWA רק לו (מה שאנחנו קוראים לו PWA כחלופה).
PWA כחוויית ההתקנה הראשית
ברגע שאפליקציית PWA עומדת בקריטריונים של יכולת ההתקנה, רוב הדפדפנים יציגו אינדיקציה לכך שאפשר להתקין את ה-PWA. לדוגמה, Chrome במחשב יציג סמל להתקנה בסרגל הכתובות, ובנייד הוא יוצג עם מיני-סרגל מידע:
אומנם זה יספיק לחלק מהחוויות, אבל אם המטרה שלכם היא לעודד התקנות של ה-PWA, מומלץ מאוד להאזין ל-BeforeInstallPromptEvent ולפעול בהתאם לדפוסים לקידום ההתקנה של ה-PWA.
איך למנוע מה-PWA להשפיע על שיעור ההתקנות של האפליקציה הספציפי לפלטפורמה
במקרים מסוימים תוכלו לקדם את ההתקנה של האפליקציה הספציפית לפלטפורמה שלכם דרך ה-PWA, אבל במקרה הזה עדיין מומלץ לספק מנגנון שמאפשר למשתמשים להתקין את ה-PWA. אפשרות הגיבוי הזו מאפשרת למשתמשים שלא יכולים או לא רוצים להתקין את האפליקציה הספציפית שלך לפלטפורמה, וכך ליהנות מחוויית התקנה דומה.
השלב הראשון ביישום האסטרטגיה הזו הוא להגדיר השיטה ההיוריסטית על המועד שבו מציגים למשתמש קידום התקנה של ה-PWA.
לדוגמה: משתמש PWA הוא משתמש שראה את הבקשה להתקנת האפליקציה הספציפית לפלטפורמה, ולא התקין את האפליקציה הספציפית לפלטפורמה. הם חזרו לאתר לפחות חמש פעמים, או לחצו על הבאנר של האפליקציה, אבל המשיכו להשתמש באתר במקום זאת.
לאחר מכן ניתן ליישם את היוריסטיקה באופן הבא:
- הצגת הבאנר להתקנת האפליקציה הספציפית לפלטפורמה.
- אם משתמש סוגר את הבאנר, צריך להגדיר קובץ cookie עם המידע הזה (למשל
document.cookie = "app-install-banner=dismissed"). - יש להשתמש בקובץ Cookie אחר כדי לעקוב אחר מספר הביקורים של משתמשים באתר (למשל,
document.cookie = "user-visits=1"). - צריך לכתוב פונקציה כמו
isPWAUser(), שמשתמשת במידע שהיה מאוחסן בקובצי Cookie יחד עם ה-API שלgetInstalledRelatedApps()כדי לקבוע אם משתמש נחשב ל'משתמש PWA'. - כשמשתמש מבצע פעולה משמעותית, צריך לקרוא ל-
isPWAUser(). אם הפונקציה מחזירה את הערך True ובקשת ההתקנה של PWA נשמרה בעבר, אפשר להציג את לחצן ההתקנה של PWA.
קידום התקנת PWA באמצעות חנות אפליקציות
אפשר ליצור אפליקציות לחנויות אפליקציות באמצעות טכנולוגיות שונות, כולל שיטות PWA. במאמר שילוב PWA לסביבות נייטיב אפשר למצוא סיכום של הטכנולוגיות שאפשר להשתמש בהן למטרה הזו.
בקטע הזה נסווג את האפליקציות בחנות בשתי קבוצות:
- אפליקציות ספציפיות לפלטפורמה: אפליקציות כאלה מבוססות בעיקר עם קוד ספציפי לפלטפורמה. הגודל שלהם תלוי בפלטפורמה, אבל בדרך כלל הוא גדול מ-10MB ב-Android ו-30MB ב-iOS. כדאי לקדם את האפליקציה הספציפית לפלטפורמה שלכם אם אין לכם PWA, או אם האפליקציה הספציפית לפלטפורמה מציגה קבוצת תכונות מלאה יותר.
- אפליקציות פשוטות: ניתן לפתח את האפליקציות האלה גם באמצעות קוד ספציפי לפלטפורמה, אבל בדרך כלל הן מתוכננות באמצעות טכנולוגיית אינטרנט, והן ארוזות ב-wrapper ספציפי לפלטפורמה. אפשר גם להעלות לחנויות PWA מלאות. (ההסבר על כך מתואר בהמשך במאמר הזה). יש חברות שבוחרים לספק אותן כגרסה "מצומצמת" ב-Google Workspace for Education, ואחרים השתמשו בגישה הזו גם ביישומי הדגל שלהם.
קידום אפליקציות קלות
לפי מחקר של Google Play, לכל הגדלה של 6MB לגודל APK, שיעור ההמרה של התקנה יורד ב-1%. המשמעות היא שקצב השלמת ההורדה של אפליקציה בגודל 10MB עשוי להיות גבוה ב-30% לעומת אפליקציה בגודל 100MB!
כדי לטפל בבעיה, חלק מהחברות משתמשות ב-PWA שלהן כדי לספק גרסה פשוטה יותר של האפליקציה שלהן בחנות Play באמצעות פעילויות מהימנות באינטרנט (TWA). אפליקציות TWA כוללות את ה-PWA כרכיב ברכיב WebView, וגודל האפליקציה שמתקבל הוא בדרך כלל רק כמה מגה-בייט.
Oyo, אחת מחברות האירוח הגדולות בהודו, פיתחה גרסת Lite של האפליקציה שלה, ויצרה אותה בחנות Play באמצעות TWA. כשהמאמר הזה נכתב, אפליקציית Oyo הייתה רק בגודל 850KB – רק 7% מגודל האפליקציה ל-Android. לאחר ההתקנה, לא ניתן יהיה להבחין בינה לבין האפליקציה ל-Android:
Oyo שמרה גם את ספינת הדגל וגם את ה-Lite גרסאות של אפליקציות בחנות, כך שהן יוכלו לבחור את המשתמשים.
מתן חוויית אינטרנט פשוטה
באופן אינטואיטיבי, משתמשים במכשירים פשוטים נוטים להוריד גרסאות קלות יותר של אפליקציות מאשר משתמשים בטלפונים מתקדמים. לכן, אם ניתן לזהות מכשיר של משתמש, כדאי לתת עדיפות לבאנר ההתקנה הפשוט על פני הגרסה הכבדה יותר של האפליקציה הספציפית לפלטפורמה.
באינטרנט, יש אפשרות לקבל אותות ממכשירים ולמפות אותם בקירוב לקטגוריות מכשירים (למשל 'גבוה', 'mid' או 'נמוך'). תוכלו לקבל את המידע הזה בדרכים שונות, באמצעות ממשקי API של JavaScript או בעזרת רמזים של לקוחות.
שימוש ב-JavaScript
באמצעות מאפייני JavaScript כמו navigator.hardwareConcurrency, navigator.deviceMemory ו-navigator.connection, אתם יכולים לקבל מידע על המעבד (CPU), הזיכרון וסטטוס הרשת של המכשיר, בהתאמה. לדוגמה:
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';`
שימוש ברמזים של לקוחות
אפשר להסיק אותות ממכשירים גם בכותרות של בקשות HTTP בעזרת רמזים של לקוחות. כך מטמיעים את הקוד הקודם לזיכרון המכשיר באמצעות רמזים ללקוחות:
קודם כל, צריך להגיד לדפדפן שאתם רוצים לקבל רמזים על הזיכרון של המכשיר בכותרת של תגובת ה-HTTP לגבי כל בקשה של צד ראשון:
HTTP/1.1 200 OK
Content-Type: text/html
Accept-CH: Device-Memory
לאחר מכן, תתחילו לקבל מידע על Device-Memory בכותרת הבקשה של בקשות HTTP:
GET /main.js HTTP/1.1
Device-Memory: 0.5
אפשר להשתמש במידע הזה בקצה העורפי כדי לאחסן קובץ cookie עם קטגוריית המכשיר של המשתמש:
app.get('/route', (req, res) => {
// Determine device category
const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';
// Set cookie
res.setCookie('Device-Category', deviceCategory);
…
});
לסיום, יוצרים לוגיקה משלכם למיפוי המידע הזה לקטגוריות מכשירים, ומציגים את הבקשה המתאימה להתקנת האפליקציה בכל מקרה:
if (isDeviceMidOrLowEnd()) {
// show "Lite app" install banner or PWA A2HS prompt
} else {
// show "Core app" install banner
}
סיכום
היכולת להציג סמל במסך הבית של המשתמש היא אחת מהתכונות המעניינות ביותר באפליקציות. בהתחשב בעובדה שבעבר היה זה אפשרי רק לאפליקציות שהותקנו מחנויות אפליקציות, חברות עשויות לחשוב שהצגת באנר התקנה של חנות האפליקציות תספיק כדי לשכנע משתמשים להתקין את האפליקציה שלהם. בשלב הזה יש עוד אפשרויות לאפשר למשתמשים להתקין אפליקציה, כולל הצעת חוויית שימוש מצומצמת של אפליקציות בחנויות, ומתן אפשרות למשתמשים להוסיף אפליקציות PWA למסך הבית באמצעות בקשה לבצע את הפעולה הזו ישירות מהאתר.