قد يؤدّي تثبيت تطبيق الويب التقدّمي (PWA) إلى تسهيل عثور المستخدمين على المحتوى واستخدامه. حتى مع الترويج للمتصفّح، لا يدرك بعض المستخدمين أنّه يمكنهم تثبيت تطبيق الويب التقدّمي (PWA)، لذلك قد يكون من المفيد توفير تجربة داخل التطبيق يمكنك استخدامها للترويج لتطبيق الويب التقدّمي (PWA) وتفعيله.
![لقطة شاشة لزرّ التثبيت البسيط في تطبيق الويب التقدّمي (PWA).](https://web.dev/static/articles/promote-install/image/screenshot-simple-instal-3b0b6b042e079.png?authuser=6&hl=ar)
هذه المقالة ليست شاملة بأي حال من الأحوال، ولكنها توفر نقطة بداية لطرق مختلفة للترويج لتثبيت تطبيق الويب التقدّمي (PWA). وبغض النظر عن النمط أو الأنماط التي تستخدمها، تؤدّي جميعها إلى الرمز نفسه الذي يؤدي إلى بدء عملية التثبيت، وهو موثّق في مقالة كيفية توفير تجربة التثبيت داخل التطبيق.
أفضل الممارسات
هناك بعض أفضل الممارسات التي تنطبق بغض النظر عن الأنماط الترويجية التي تستخدمها على موقعك.
- احرص على أن تكون العروض الترويجية خارج مسار رحلات المستخدم. على سبيل المثال، في صفحة تسجيل الدخول إلى تطبيق الويب التقدّمي (PWA)، ضَع عبارة الحث على اتّخاذ إجراء أسفل نموذج تسجيل الدخول وزر الإرسال. يؤدي الاستخدام المربك للأنماط الترويجية إلى تقليل إمكانية استخدام تطبيق الويب التقدّمي (PWA) ويؤثر سلبًا في مقاييس التفاعل.
- يجب تضمين إمكانية رفض العرض الترويجي أو رفضه. تذكّر تفضيل المستخدم في حال إجراء ذلك وعدم إعادة الطلب إلا إذا كان هناك تغيير في علاقة المستخدم بالمحتوى، مثل ما يحدث عند تسجيل الدخول أو إكمال عملية شراء.
- يمكنك دمج التقنيات في أجزاء مختلفة من تطبيق الويب التقدّمي (PWA)، ولكن احرص على عدم إرباك المستخدمين أو إزعاجهم من خلال الترويج للتثبيت.
- يجب عدم عرض العرض الترويجي إلا بعد انتهاء
فعالية
beforeinstallprompt
.
الترويج التلقائي للمتصفّح
عند استيفاء معايير معيّنة، توجّه معظم المتصفّحات تلقائيًا للمستخدم إلى أنّ تطبيق الويب التقدّمي الخاص بك قابل للتثبيت. على سبيل المثال، يعرض Chrome لسطح المكتب زر التثبيت في المربع متعدد الاستخدامات.
![لقطة شاشة للمربّع المتعدد الاستخدامات مع مؤشر تثبيت مرئي](https://web.dev/static/articles/promote-install/image/screenshot-omnibox-a-vi-4d92411b4427d.png?authuser=6&hl=ar)
![لقطة شاشة لعملية التثبيت الترويجية المقدَّمة من المتصفّح.](https://web.dev/static/articles/promote-install/image/screenshot-browser-provi-bd3e42c38ef14.png?authuser=6&hl=ar)
يعرض Chrome لنظام Android شريط معلومات مصغّرًا للمستخدم، ويمكن منع ذلك عن طريق استدعاء preventDefault()
في حدث beforeinstallprompt
.
إذا لم يتم استدعاء الدالة preventDefault()
، سيظهر إعلان البانر في المرة الأولى التي يزور فيها
أحد المستخدمين موقعك الإلكتروني ويستوفي معايير قابلية التثبيت على نظام التشغيل Android،
سيظهر مرة أخرى بعد 90 يومًا تقريبًا.
الأنماط الترويجية لواجهة المستخدم
يمكن استخدام الأنماط الترويجية لواجهة المستخدم في جميع أنواع تطبيقات الويب التقدّمية (PWA) تقريبًا، وتظهر في مواضع مثل التنقّل في الموقع الإلكتروني وإعلانات البانر. كما هو الحال مع أي نوع آخر من الأنماط الترويجية، من المهم أن تكون على دراية بسياق المستخدم لتقليل الانقطاع في رحلة المستخدم.
تحقق المواقع التي تأخذ بعناية وقت تشغيل واجهة المستخدم للعرض الترويجي عددًا أكبر من عمليات التثبيت وتتجنب التداخل مع تجارب المستخدمين غير المهتمين بالتثبيت.
زر التثبيت البسيط
أبسط تجربة مستخدم ممكنة هي تضمين زر "تثبيت" أو "الحصول على التطبيق" في مكان مناسب في محتوى الويب الخاص بك. وتأكد من أن الزر لا يحجب الوظائف المهمة الأخرى وأن يكون بعيدًا عن رحلة المستخدم عبر التطبيق.
![زر التثبيت المخصّص.](https://web.dev/static/articles/promote-install/image/custom-install-button-c31a48092e91c.png?authuser=6&hl=ar)
رأس ثابت
هذا زر تثبيت هو جزء من رأس موقعك الإلكتروني. غالبًا ما يتضمن محتوى
الرأس الآخر العلامة التجارية للموقع مثل الشعار وقائمة الهامبرغر. قد تكون العناوين position:fixed
أو لا تستند إلى وظائف موقعك الإلكتروني واحتياجات المستخدمين.
![زر التثبيت المخصّص في العنوان](https://web.dev/static/articles/promote-install/image/custom-install-button-he-ae67d1ee86ff3.png?authuser=6&hl=ar)
إنّ الترويج لتثبيت تطبيق الويب التقدّمي (PWA) من عنوان موقعك الإلكتروني هو طريقة رائعة لتسهيل عودة العملاء الأكثر ولاءً إلى تجربتك بسهولة. تعد وحدات البكسل في عنوان تطبيق الويب التقدّمي (PWA) قيّمة، لذا تأكّد من أنّ حجم عبارة الحث على اتخاذ إجراء للتثبيت مناسب، وأن تكون ذات أهمية أكبر من محتوى العنوان المحتمل الآخر، وأن تكون غير متداخلة.
![زر التثبيت المخصّص في العنوان](https://web.dev/static/articles/promote-install/image/custom-install-button-he-37ffcc16ba69b.png?authuser=6&hl=ar)
تأكد من إجراء ما يلي:
- لا تعرض زر التثبيت ما لم يتم تنشيط
beforeinstallprompt
. - يمكنك تقييم قيمة حالة الاستخدام المثبَّتة للمستخدمين. يمكنك استخدام الاستهداف الانتقائي لتقديم عرضك الترويجي فقط للمستخدمين الذين من المرجّح أن يستفيدوا منه.
- استخدِم مساحة العنوان القيّمة بكفاءة. فكِّر في الأمور الأخرى التي قد يكون مفيدًا لتقديمها للمستخدم في العنوان وقيِّم أولوية الترويج للتثبيت مقارنةً بالخيارات الأخرى.
قائمة التنقل
![زر التثبيت المخصّص في قائمة التنقّل](https://web.dev/static/articles/promote-install/image/custom-install-button-na-58019edc6068c.png?authuser=6&hl=ar)
وتُعد قائمة التنقل مكانًا رائعًا للترويج لتثبيت تطبيقك نظرًا لأن المستخدمين الذين يفتحون القائمة يشيرون إلى تفاعلهم مع تجربتك.
تأكد من إجراء ما يلي:
- تجنَّب إيقاف محتوى التنقّل المهم. ضع العرض الترويجي لتثبيت PWA أسفل عناصر القائمة الأخرى.
- قدِّم عرضًا تقديميًا ترويجيًا قصيرًا وملائمًا حول سبب استفادة المستخدم من تثبيت تطبيق الويب التقدّمي (PWA).
الصفحة المقصودة
الغرض من الصفحة المقصودة هو الترويج لمنتجاتك وخدماتك، لذا فهي مكان ملائم للتوسع فيه عند الترويج لمزايا تثبيت تطبيق الويب التقدّمي (PWA).
![طلب تثبيت مخصّص على الصفحة المقصودة.](https://web.dev/static/articles/promote-install/image/custom-install-prompt-a-5843b12d5bc42.png?authuser=6&hl=ar)
عليك أولاً شرح عرض القيمة لموقعك الإلكتروني، ثم إعلام الزوّار بما سيحصلون عليه من خلال عملية التثبيت.
تأكد من إجراء ما يلي:
- اجذب الميزات الأكثر أهمية لزوّار موقعك الإلكتروني، وركِّز على الكلمات الرئيسية التي يُحتمل أن تكون قد عرّفتهم على صفحتك المقصودة.
- اجعل الترويج للتثبيت والعبارة التي تحث المستخدم على اتخاذ إجراء ملفتة للنظر، ولكن فقط بعد توضيح عرض القيمة الذي تقدمه. هذه هي صفحتك المقصودة، في النهاية.
- يمكنك إضافة عرض ترويجي للتثبيت في الجزء الذي يقضي فيه المستخدمون معظم وقتهم في تطبيقك.
تثبيت بانر
واجه معظم المستخدمين إعلانات بانر خاصة بالتثبيت في تجارب الأجهزة الجوّالة، وكانوا على دراية بالتفاعلات التي يوفّرها إعلان البانر. يجب استخدام إعلانات البانر بحرص لأنها يمكن أن تسبب إزعاجًا للمستخدم.
![بانر مخصّص للتثبيت في أعلى الصفحة](https://web.dev/static/articles/promote-install/image/custom-install-banner-to-3aa411a9214c1.png?authuser=6&hl=ar)
تأكد من إجراء ما يلي:
- انتظر حتى يُظهِر المستخدم اهتمامه بموقعك قبل عرض بانر. إذا رفض المستخدم إعلان البانر، لا تعرضه مرة أخرى إلا إذا بدأ المستخدم حدث إحالة ناجحة يشير إلى مستوى أعلى من التفاعل مع المحتوى، مثل عملية شراء على موقع للتجارة الإلكترونية أو الاشتراك في حساب.
- قدِّم شرحًا موجزًا لقيمة تثبيت تطبيق الويب التقدّمي (PWA) في البانر. على سبيل المثال، يمكنك التمييز بين تثبيت تطبيق ويب تقدّمي (PWA) وتطبيق iOS/Android من خلال الإشارة إلى أنّه لا يستخدم أي مساحة تخزين تقريبًا على جهاز المستخدم أو أنّه سيتم تثبيته على الفور بدون إعادة توجيه المتجر.
واجهة مستخدم مؤقتة
إنّ واجهة المستخدم المؤقتة، مثل نمط تصميم Snackbar، ترسِل إشعارًا إلى المستخدم وتسمح له بإكمال أحد الإجراءات بسهولة، وهي في هذه الحالة تثبيت التطبيق. وعند استخدام هذه الأنواع من أنماط واجهة المستخدم بشكل صحيح، فإنها لا تؤدي إلى مقاطعة تدفق المستخدم، وعادةً ما يتم إغلاقها تلقائيًا إذا تجاهلها المستخدم.
![إعلان بانر مخصّص للتثبيت كشريط الإعلام المنبثق](https://web.dev/static/articles/promote-install/image/custom-install-banner-sn-fc0c5df5e9391.png?authuser=6&hl=ar)
اعرض شريط الإعلام المنبثق بعد بضع تفاعلات مع تطبيقك. وإذا ظهر عند تحميل الصفحة أو خارج السياق، فقد يتم إغفاله بسهولة أو قد يؤدي إلى حِمل الإدراك. عندما يحدث هذا، سيقوم المستخدمون ببساطة برفض كل ما يرونه. تذكَّر أنّ المستخدمين الجدد على موقعك الإلكتروني قد لا يكونون مستعدين لتثبيت تطبيق الويب التقدّمي (PWA). وبالتالي، من الأفضل الانتظار حتى تصلك إشارات اهتمام قوية من المستخدم قبل استخدام هذا النمط، على سبيل المثال، الزيارات المتكرّرة أو تسجيل دخول المستخدم أو حدث إحالة ناجحة مشابه.
![إعلان بانر مخصّص للتثبيت كشريط الإعلام المنبثق](https://web.dev/static/articles/promote-install/image/custom-install-banner-sn-b294fb32a9249.png?authuser=6&hl=ar)
تأكد من إجراء ما يلي:
- اعرض شريط الإعلام المنبثق لمدة تتراوح بين 4 و7 ثوانٍ لمنح المستخدمين الوقت الكافي لرؤيته والتفاعل معه، وبدون أن تقف عائقًا أمام طريقه.
- تجنَّب عرضه فوق واجهة مستخدم مؤقتة أخرى، مثل إعلانات البانر وما إلى ذلك.
- انتظر حتى تصلك إشارات اهتمام قوية من المستخدم قبل استخدام هذا النمط، على سبيل المثال، الزيارات المتكررة أو تسجيل دخول المستخدم أو حدث إحالة ناجحة مشابه.
بعد التحويل
بعد إجراء إحالة ناجحة للمستخدِم مباشرةً، على سبيل المثال بعد إجراء عملية شراء على موقع للتجارة الإلكترونية، تُتاح فرصة ممتازة للترويج لتثبيت تطبيق الويب التقدّمي (PWA). يتفاعل المستخدم بشكل واضح مع المحتوى الذي تعرضه، وغالبًا ما تشير الإحالة الناجحة إلى أنّ المستخدم سيتفاعل مع خدماتك مرة أخرى.
![عرض ترويجي للتثبيت بعد الإحالة الناجحة](https://web.dev/static/articles/promote-install/image/an-install-promotion-con-effd5a7b38e75.png?authuser=6&hl=ar)
رحلة الحجز أو الدفع
اعرض عرضًا ترويجيًا للتثبيت أثناء رحلة متسلسلة أو بعدها، مثل تدفقات الحجز أو الدفع. أما إذا كنت تعرض الإعلان الترويجي بعد أن يكمل المستخدم الرحلة، فيمكنك في كثير من الأحيان جعله أكثر بروزًا بعد اكتمال الرحلة.
![عرض ترويجي للتثبيت بعد تجربة المستخدم](https://web.dev/static/articles/promote-install/image/an-install-promotion-a-u-2e0b33d2ff618.png?authuser=6&hl=ar)
تأكد من إجراء ما يلي:
- أدرِج عبارة ملائمة تحث المستخدم على اتخاذ إجراء. من هم المستخدمون الذين سيستفيدون من تثبيت تطبيقك ولماذا؟ ما مدى صلة الرحلة التي يخوضونها حاليًا؟
- إذا كانت علامتك التجارية تقدّم عروضًا فريدة لمستخدمي التطبيقات المثبّتة، عليك ذِكرها.
- أبق الترويج بعيدًا عن الخطوات التالية في رحلتك أو يمكنك التأثير سلبًا على معدلات إكمال الرحلة. في مثال التجارة الإلكترونية أعلاه، لاحِظ كيف أن العبارة الرئيسية التي تحث المستخدم على اتخاذ إجراء إلى الدفع أعلى من الإعلان الترويجي لتثبيت التطبيق.
خطوات الاشتراك أو تسجيل الدخول أو الخروج
هذا العرض الترويجي هو حالة خاصة من نمط الرحلة الترويجي حيث يمكن أن تكون بطاقة العرض الترويجي أكثر بروزًا.
![زر تثبيت مخصَّص في صفحة الاشتراك](https://web.dev/static/articles/promote-install/image/a-custom-install-button-401ffb4e23752.png?authuser=6&hl=ar)
عادةً لا تتم مشاهدة هذه الصفحات إلا من خلال المستخدمين المتفاعلين، حيث سبق أن تم تحديد عرض قيمة تطبيق الويب التقدّمي (PWA). لا يوجد أيضًا في كثير من الأحيان الكثير من المحتوى المفيد الآخر لوضعه على هذه الصفحات. نتيجة لذلك، من الأقل إرباك إجراء عبارة حث على اتخاذ إجراء أكبر طالما أن ذلك ليس عائقًا.
تأكد من إجراء ما يلي:
- تجنَّب إيقاف تجربة المستخدم داخل نموذج الاشتراك. إذا كانت عملية متعددة الخطوات، فقد ترغب في الانتظار حتى يكمل المستخدم الرحلة.
- الترويج للميزات الأكثر صلة بالمستخدم الذي اشترك
- يمكنك إضافة عرض ترويجي آخر للتثبيت داخل المناطق التي تم تسجيل الدخول فيها إلى تطبيقك.
الأنماط الترويجية المضمّنة
إنّ الأساليب الترويجية المضمّنة تجمع بين العروض الترويجية ومحتوى الموقع الإلكتروني. وغالبًا ما يكون هذا أكثر دقة من الترويج في واجهة المستخدم، والذي ينطوي على مفاضلات. تريد أن يبرز إعلانك الترويجي بدرجة كافية بحيث يلاحظه المستخدمون المهتمون، لكن ليس لدرجة أن يهبط من جودة تجربة المستخدم التي تقدمها.
إعلان ضمن الخلاصة
يظهر إعلان ترويجي للتثبيت ضمن الخلاصة بين المقالات الإخبارية أو قوائم بطاقات المعلومات الأخرى في تطبيق الويب التقدّمي (PWA).
![إعلان ترويجي للتثبيت ضمن خلاصة محتوى](https://web.dev/static/articles/promote-install/image/an-install-promotion-with-06735d525d2b5.png?authuser=6&hl=ar)
هدفك هو تعريف المستخدمين بكيفية الوصول إلى المحتوى الذي يستمتعون به بشكل أكثر راحة. ركز على ترويج الميزات والوظائف التي ستكون مفيدة للمستخدمين.
تأكد من إجراء ما يلي:
- قلِّل معدّل تكرار العروض الترويجية لتجنّب إزعاج المستخدمين.
- منح المستخدمين إمكانية رفض الإعلانات الترويجية.
- تذكّر خيار المستخدم في الرفض.