محمد لوناس

تطبيقات الويب التقدمية PWA هي تطبيقات حديثة، عالية الجودة تُبنَى باستخدام تقنيات الويب. تقدم تطبيقات الويب التقدمية إمكانيات مماثلة لتطبيقات iOS والأندرويد وسطح المكتب، فهي تطبيقات موثوقة حتى في الشبكات غير المستقرة، وتتميز بقابلية التثبيت مما يُسهل على المستخدمين العثور عليها واستعمالها. كان تثبيت التطبيق في الماضي ممكنًا فقط في التطبيقات المخصصة للنظام، أما اليوم فتقدم تطبيقات الويب التقدمية PWA تجرِبة قابلة للتثبيت توفر نفس المستوى من التكامل والموثوقية مثل التطبيقات المخصصة للنظام. يمكنك القيام بذلك بطرق عدة: تثبيت تطبيقات الويب التقدمية من المتصفح. تثبيت تطبيقات الويب التقدمية من متجر التطبيقات. يعد وجود مصادر مختلفة للنشر طريقة فعالة للوصول إلى أكبر عدد من المستخدمين، ولكن قد يكون من الصعب اختيار استراتيجية صحيحة للترويج بها. لماذا عليك أن تجعل تطبيق الويب الخاص بك قابلا للتثبيت؟ تعمل تطبيقات الويب المتقدمة المثبتة في نافذة قائمة بذاتها، وليس في تبويبة متصفح كباقي تطبيقات الويب، ويمكن تشغيلها من الشاشة الرئيسية وشريط المهام وغيرها، ومن الممكن البحث عنها على الجهاز والانتقال بينها وبين التطبيقات الأخرى، وهو ما يعطي تجرِبة شبيهة بتطبيقات النظام الأصلية. امتلاك تطبيق ويب تقدمي بالإضافة للتطبيق المخصص للنظام قد يكون أمرا مربكا للمستخدمين، قد يكون التطبيق المخصص للنظام خيارا أفضل لبعض المستخدمين، ويمكن أن يكون خيارا سيئا للبعض الآخر: حدود التخزين: قد يتطلب تثبيت تطبيق جديد حذف تطبيق آخر، أو تنظيف المساحة، عن طريق إزالة المحتوى القيم. وهذا أمر غير مفيد خاصة لمستخدمي الأجهزة الضعيفة. حدود البيانات: يمكن أن يكون تنزيل التطبيق عملية مكلفة وبطيئة بالنسبة للمستخدمين الذين يملكون اتصالات بطيئة وإنترنت باهظة الثمن. خطوات غير ضرورية: يؤدي الانتقال إلى المتجر وترك المتصفح لتنزيل التطبيق إلى حدوث احتكاك إضافي وتأخير للمستخدم بينما يمكن تنفيذ هذا الإجراء مباشرة على الويب. دورة التحديث: قد يتطلب تحديث التطبيقات الخاصة بالنظام مراجعات، وهذا سيؤدي إلى تأخير في التغييرات والتجارب أحيانا تكون نسبة المستخدمين الذين لم يقوموا بتنزيل التطبيق المخصص للنظام كبيرة، على سبيل المثال: أولئك الذين يفترضون أنهم لن يستخدموا التطبيق كثيرا، أو لا يعتقدون أن الأمر يستحق إنفاق عدة ميغابايتات من التخزين أو الإنترنت، يمكنك تحديد حجم هذه الشريحة بعدة طرق، على سبيل المثال بتحليل عدد مستخدمي تطبيق الويب. إن كانت نسبة هذه الشريحة كبيرة، فأنت بحاجة لتوفير طرق تثبيت بديلة. متطلبات جعل تطبيق الويب التقدمي قابلا للتثبيت لدى أغلب المستخدمين تجربة مع التطبيقات القابلة للتثبيت، تظهر التطبيقات المثبتة في نظام التشغيل مثل أندرويد ونظام iOS في الشاشة الرئيسية وفي مجلد التطبيقات في Mac OS X وقائمة البداية في ويندوز، وتظهر أيضا في التطبيقات المشغلة ويمكن التبديل بينها في قائمة التطبيقات النشطة، وتظهر أيضا في محرك بحث النظام ولائحة المشاركة في التطبيقات. تخبرك أغلب المتصفحات بأن تطبيق الويب التقدمي الخاص بك قابل للتثبيت عند استيفاء شروط التثبيت، كمثال قد يكون المؤشر عبارة عن زر تثبيت في شريط العناوين، أو عنصر تثبيت في قائمة. المتصفح يقترح تثبيت تطبيق الويب التقدم (حاسوب مكتبي) المتصفح يقترح تثبيت تطبيق الويب التقدم (هاتف) قد تقوم بعض المتصفحات بإطلاق الحدث beforeinstallprompt عند استيفاء الشروط قبل التثبيت، يسمح لك هذا بعرض واجهة خاصة لطلب تثبيت تطبيقك، هذا سيجعل المتصفح يعرض مؤشرً لطلب التثبيت من المستخدم. معايير تثبيت تطبيق الويب التقدمي يحتاج تطبيق الويب التقديمي الخاص بك إلى استيفاء الشروط التالية قبل إطلاق حدث beforeinstallprompt وعرض مؤشر طلب التثبيت من المستخدم: أن لا يكون التطبيق مثبتًا بالفعل. أن يكون المستخدم قد تفاعل وفقًأ لإرشادات محددة. مستضافًا باتصال آمن HTTPS. يحتوي التطبيق على ملف البيان web app manifest ضبطت فيه القيم التالية: خاصية short_name أو name خاصية icons تحتوي أيقونة بحجم 192px و 512px الخاصية start_url الخاصية display تتضمن إحدى هذه الخيارات fullscreen أو standalone أو minimal-ui الخاصية prefer_related_applications يجب أن تكون محددة أو معطلة باستعمال false تسجيل منجز خدمة service worker باسم fetch تمتلك متصفحات أخرى معايير مشابهة، وقد تمتلك اختلافات بسيطة، تحقق من المواقع التالية للحصول على التفاصيل أوضح: Edge. Firefox. Opera. Samsung Internet. UC Browser. اقتراح تثبيت تطبيق الويب التقدمي الخاص بك من خلال المتصفح إذا كان تطبيق الويب التقدمي الخاص بك عالي الجودة، ربما من الأفضل أن تقترح على المستخدم تثبيته عبر التطبيق المخصص للنظام، على سبيل المثال، إذا كان تطبيقك المخصص للنظام لا يملك ميزات متوفرة في تطبيق الويب التقدمي أو لم يتم تحديثه منذ مدّة. قد يكون من المفيد الترويج لتثبيت تطبيق الويب التقدمي الخاص بك أيضا إذا لم يكن التطبيق المخصص للنظام يدعم الشاشات الأكبر حجمًا بشكل جيد، مثل نظام التشغيل Chrome. يعد الدفع بعمليات تثبيت التطبيق التي تستهدف نظامًا محددًا جزءًا أساسيا من نموذج الأعمال، ويكون من المنطقي في هذه الحالة إظهار ترويج لتثبيت التطبيق على منصة معينة دونًا عن غيرها. وبما أن البقاء على الويب قد يشعر بعض المستخدمين براحة أكبر، لذا يفضل إيجاد طريقة لتحديد هذه الفئة من المستخدمين، وعندها يمكن الترويج لتطبيق الويب التقدمي لهم واستثنائهم من اقتراحات تثبيت التطبيق. الترويج لتثبيت تطبيق الويب التقدمي تعلمك أغلب المتصفحات عند استيفاء شروط التثبيت بأن تطبيق الويب التقدمي الخاص بك قابل للتثبيت، كمثال قد يكون المؤشر زر تثبيت في شريط العناوين، أو عنصر تثبيت في قائمة كما وضحنا في الصورة السابقة. يكون هذا كافيا في بعض الحالات، لكن إن كان هدفك هو الإشراف على عمليات تثبيت تطبيق الويب التقدمي الخاصة بك، فإننا نوصيك بشدة بانتظار الحدث BeforeInstallPromptEvent، واتباع الأنماط للترويج لتثبيت تطبيق الويب التقدمي الخاص بك. تأثير اقتراحات التثبيت سلبًا على معدل التثبيت قد ترغب بالترويج لتثبيت تطبيقك على نظام بعينه بدلًا من الاعتماد على تطبيق الويب، وهنا ننصحك في هذه الحالة أن توفر أيضًا طريقة سهلة للمستخدمين لتثبيت تطبيق الويب التقدمي في أي وقت يريده بدلًا من الاعتماد على اقتراح التثبيت فقط، فهذا سيتيح للمستخدمين الذين لا يستطيعون أو لا يريدون تثبيت تطبيق الويب من تثبيت التطبيق لاحقًا والحصول على التجربة نفسها التي يحصلون عليها من الاقتراح. تتمثل الخطوة الأولى في تنفيذ هذه الإستراتيجية في معرفة متى تظهر للمستخدم الترويج الخاص بتثبيت تطبيق الويب التقدمي، أي تحديدًا عرض اقتراح التثبيت في الوقت المناسب هو الحاكم، كمثال: بعد ذلك، يمكن تنفيذ ذلك بالطريقة التالية: عرض لافتة تثبيت التطبيق المخصص للنظام. إذا تجاهل المستخدم الإشعار، احفظ هذه المعلومة بتخزينها في ملف تعريف الارتباط (مثلا document.cookie = "app-install-banner=dismissed"‎). استخدام مِلَفّ تعريف ارتباط آخر لتتبع عدد زيارات المستخدم للموقع كمثال: document.cookie = "user-visits=1"‎. عرف دالة تستخدم المعلومات السابقة لتحديد إن كان المستخدم موجها لتطبيق الويب التقدمي كمثال: isPWAUser()‎ واستخدم ()getInstalledRelatedApps لمعرفة إن كان التطبيق مثبتا لتقرر إن كان المستخدم هو مستخدم تطبيق ويب تقدمي. الآن يمكنك فقط استدعاء الدالة isPWAUser()‎ واعتمادا على ذلك أظهر زر طلب تثبيت تطبيق الويب التقدمي. الترويج لتطبيق الويب التقدمي من متجر التطبيقات يمكن بناء التطبيقات المتوفرة على متجر التطبيقات بتقنيات مختلفة، من ضمنها تطبيقات الويب التقدمية، فسنعمل في هذا الجزء على تصنيف تطبيقات المتجر إلى مجموعتين: التطبيقات المخصصة للنظام: يمكن إنشاء هذه التطبيقات برمز خاص بالنظام، ويكون حجمها أكبر من 10 ميغابايت في الأندرويد وأكثر من 30 ميغابايت في iOS، قد ترغب في الترويج لتطبيقك المخصص للنظام إذا لم تملك تطبيق ويب تقدمي، أو إذا كان تطبيق النظام الأصلي لديك يقدم مجموعة ميزات أكثر تكاملا. تطبيقات خفيفة الحجم: يمكن إنشاء هذه التطبيقات برمز خاص بالنظام كذلك، ولكن يتم بناؤها عادة باستخدام تقنيات الويب، وتغليفها في تطبيق مخصص للنظام الأساسي، ويمكن رفع تطبيق الويب التقدمي كاملا إلى المتاجر أيضًا. تختار بعض الشركات تقديم هذه التجارب "الخفيفة"، وقد استخدمت عدة شركات أخرى هذا النهج لتطبيقاتها الرئيسية أيضًا. الترويج للتطبيقات الخفيفة حسب دراسة أعدها Google Play، فإنه لكل 6 ميغابايت تضاف في حجم ملف APK ، ينخفض معدل التثبيت بنسبة 1٪. يعني ذلك أن معدل اكتمال التنزيل لتطبيق 10 ميغابايت يمكن أن يكون أعلى تقريبا بنسبة 30٪ من تطبيق حجمه 100 ميغابايت. لحل هذا المشكل، تقدم بعض الشركات تطبيقات ويب متقدمة PWA الخاصة بها كحل لتوفير إصدار خفيف من تطبيقاتها على متجر Google Play وذلك باستخدام ما يسمى أنشطة الويب الموثوقة TWA. إذ تتيح أنشطة الويب الموثوقة القدرة على توفير تطبيق الويب التقدمي على جوجل بلاي، ولأنه مصمم باستخدام تقنيات الويب، فإن حجم التطبيق لا يتجاوز بضعة ميغابايتات. قامت شركة Oyo وهي إحدى أكبر شركات الحجز في الهند، ببناء إصدار خفيف من تطبيقها وجعلته متاحًا في متجر Google Play باستخدام أنشطة الويب الموثوقة TWA. يبلغ حجم التطبيق الخفيف 850 كيلوبايت فقط، أي ما يقارب 7٪ من حجم تطبيق Android المخصص للنظام. ويتميز بأنه عند تثبيته لا يمكن التمييز بينه وبين تطبيق Android للنظام الأصلي. تطبيق شركة Oyo باستعمال تقنية أنشطة الويب الموثوقة TWA احتفظت شركة Oyo بكلا التطبيقين تاركة القرار للمستخدم لاختيار ما يناسبه. توفير تطبيق ويب خفيف قد يميل مستخدمو الأجهزة الضعيفة إلى تنزيل إصدارات خفيفة الوزن من التطبيقات أكثر من مستخدمي الهواتف المتطورة. لذلك، إذا أمكن تحديد نوع جهاز المستخدم، فيمكن إعطاء الأولوية لإشعار تثبيت التطبيق خفيف الوزن على إصدار التطبيق الأثقل المخصص للنظام. يمكن الحصول على معلومات الجهاز ثم تقسيمها لفئات (على سبيل المثال أجهزة "قوية" أو "متوسطة" أو "ضعيفة"). يمكنك الحصول على هذه المعلومات بطرق مختلفة، إما باستخدام واجهات تطبيقات جافاسكربت البرمجية JavaScript APIs أو تلميحات العميل. باستعمال واجهات تطبيقات جافاسكربت البرمجية يمكنك الحصول على معلومات حول معالج الجهاز والذاكرة وحالة الشبكة باستعمال واجهات تطبيقات جافاسكربت البرمجية navigator.hardwareConcurrency و navigator.deviceMemory و navigator.connection. على سبيل المثال: const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full';` باستخدام تلميحات العميل يمكن أيضًا معرفة معلومات الجهاز في رأس طلبة http، من خلال تلميحات العميل. إليك كيفية تنفيذ الرمز السابق لمعرفة لذاكرة الجهاز باستخدام تلميحات العميل. أولاً، قم بإعلام المتصفح أنك تريد تلقي تلميحات عن ذاكرة الجهاز في ترويسة استجابة http: HTTP/1.1 200 OK Content-Type: text/html Accept-CH: Device-Memory ستبدأ بعدها بتلقي معلومات ذاكرة الجهاز في ترويسة طلبيات HTTP: GET /main.js HTTP/1.1 Device-Memory: 0.5 يمكنك استخدام هذه المعلومات في الخادم لتخزين ملف تعريف ارتباط يتضمن جهاز المستخدم: app.get('/route', (req, res) => { // تحدد فئة الجهاز const deviceCategory = req.get('Device-Memory') < 1 ? 'lite' : 'full'; // ضبط ملف تعريف الإرتباط res.setCookie('Device-Category', deviceCategory); … }); في الأخير أنشئ منطقك الخاص لإستعمال هذه المعلومات وتحديد تعاملك مع الجهاز مثل ظهار لافتة طلب تثبيت التطبيقات استنادا لكل حالة: if (isDeviceMidOrLowEnd()) { // ‫أظهر إشعار طلب تثبيت التطبيق الخفيف PWA } else { // أظهر إشعار طلب تثبيت التطبيق التطبيق الرئيسي } إن التغطية العميقة للتقنيات المتعلقة بجمع معلومات الجهاز وتصنيفها هي أمر خارج نطاق هذا المقال، وننصحك بالبحث أكثر للوصول إلى معلومات أكثر حول أفضل الممارسات حول هذا الموضوع. الختام إن وجود أيقونة التطبيق في الشاشة الرئيسية للمستخدم يعد من أكثر الميزات جاذبية. قد تعتقد الشركات أن عرض لافتة تروج تثبيت التطبيق من متجر التطبيقات سيكون كافيًا لإقناع المستخدمين بتثبيت تطبيقاتهم، وذلك نظرًا لأن هذا كان ممكنًا فقط للتطبيقات المثبتة من متجر تطبيقات النظام، توجد الآن خيارات عديدة لجعل المستخدم يثبت التطبيق، منها تقديم نسخة خفيفة على متجر التطبيقات، وجعل المستخدمين يضيفون تطبيقات الويب التقدمية للشاشة الرئيسية من خلال طلب ذلك مباشرة من موقع الويب. ترجمة -وبتصرف- للمقال How to define your install strategy‎ والمقال What does it take to be installable? لصاحبيه Demian Renzulli و Pete LePage. اقرأ أيضًا ميزات تطبيق الويب التقدمي PWA جدوى الاعتماد على تطبيقات الويب التقدمية PWA عوض تطبيقات الجوالات الأصيلة توفير تجربة تثبيت مخصصة داخل تطبيق الويب التقدمي PWA

صممت تطبيقات الويب التقدمية PWA -اختصارًا إلى Progressive Web Apps- باستخدام واجهات برمجة تطبيقات حديثة، لتقديم إمكانيات أفضل وموثوقية وقابلية للتثبيت وذلك للوصول إلى أي شخص في أي مكان على أي جهاز بكتابة شيفرة واحدة. ميزات تطبيقات الويب التقدمية الأساسية سنعرض في هذا المقال الأسباب التي تجعل تطبيق الويب التقدمي جيدًا على جميع الأجهزة ولجميع المستخدمين من عدة نواحي بغض النظر عن حجم أو نوع الجهاز. 1. سريعة أداة المواقع عالية الأداء تجذب المستخدمين وتحتفظ بهم بشكل أفضل من المواقع ضعيفة الأداء، إذ يلعب الأداء دورا هاما في نجاح أي تجربة عبر الإنترنت. يجب يركز الموقع على تحسين مقاييس الأداء المتعلقة بالمستخدم. للسرعة أهمية كبيرة في جذب المستخدمين لتطبيقك. إذ أنه في الحقيقة مع زيادة وقت تحميل الصفحة من ثانية واحدة إلى عشر ثوانٍ، يزداد احتمال ارتداد المستخدم إثر ذلك بنسبة 123٪. الأداء لا يتوقف مع تحميل الصفحة، فيجب ألا يتساءل المستخدمون أبدًا عما إذا كان تفاعلهم - مثلا عند النقر فوق زر ما - يحدث شيئا ما. يجب أن يشعر المستخدم بسلاسة أثناء التمرير وعرض الرسوم المتحركة. يؤثر الأداء على تجربتك بالكامل، بدءًا من كيفية إدراك المستخدمين لتطبيقك إلى أدائه الفعلي. رغم امتلاك جميع التطبيقات خصوصياتها، إلا أن عمليات تدقيق الأداء في Lighthouse تستند إلى نموذج الأداء المرتكز على المستخدم RAIL user-centric performance model، تسجيل نقاط عالية في عمليات التدقيق هذه يعني زيادة احتمالية تمتع المستخدمين بتجربة ممتعة. يمكنك أيضًا استخدام PageSpeed Insights أو تقرير تجربة مستخدم كروم Chrome User Experience Report للحصول على بيانات أداء واقعية لتطبيق الويب الخاص بك. 2. تعمل على جميع المتصفحات يمكن للمستخدمين اختيار أي متصفح للوصول إلى تطبيق الويب التقدمي الخاص بك قبل تثبيته، فتطبيقات الويب التقدمية هي تطبيقات ويب أساسا، هذا يعني أنها تحتاج إلى العمل عبر جميع المتصفحات. تتمثل إحدى الطرق الفعالة للقيام بذلك في تحديد الوظائف الأساسية، وإتاحة هذه الوظيفة باستخدام بتقنية بسيطة، ثم تحسين التجربة كلما أمكن، كما يقول Jeremy Keith في تصميم الويب المرن Resilient Web Design، في كثير من الحالات يعني هذا البدء باستخدام HTML فقط لتصميم الوظائف الأساسية، وتحسين تجربة المستخدم باستخدام CSS و JavaScript لإنشاء تجربة أكثر جاذبية للمستخدم. على سبيل المثال نأخذ إرسال النماذج form submission، إن أبسط طريقة لتنفيذ ذلك هي نموذج HTML الذي يرسل طلب POST. ثم يمكنك تحسين تجربة المستخدم باستعمال JavaScript لإجراء تحقق من صحة النموذج وإرسال النموذج عبر AJAX، تحسين التجربة للمستخدمين الذين يمكنهم دعمها. ضع في اعتبارك أن المستخدمين سيختبرون موقعك عبر أجهزة ومتصفحات مختلفة، إذا لا يمكنك ببساطة استهداف فئة معينة. يمكنك التحقق من الميزات المتاحة باستعمال التحقق من الميزات feature detection هذا سيمكنك من تقديم تجربة قابلة للاستخدام على نطاق واسع من المستخدمين، بما في ذلك أولئك الذين يستخدمون المتصفحات والأجهزة التي قد لا تكون موجودة حاليا. 3. تستجيب لجميع أحجام الشاشات يمكن للمستخدمين استعمال تطبيق الويب التقدمي PWA الخاص بك على أي شاشة ويتوفر المحتوى بجميع الأحجام. يمكن أن تأتي الأجهزة بأحجام مختلفة، ويمكن للمستخدمين استخدام تطبيقك بأحجام مختلفة على نفس الجهاز، لذلك من المهم جدا التأكد من أن المحتوى يتلاءم مع أحجام مختلفة وليس مع إطار العرض viewport فقط، ويجب أيضا أن تتأكد من أن محتوى موقعك وجميع ميزاته قابلة للاستخدام في جميع الأجهزة والأحجام. لا تتغير المهام التي يريد المستخدمون إكمالها والمحتوى الذي يريدون الوصول إليه مع تغير حجم الشاشة. ويمكن إعادة ترتيب المحتوى بأحجام ليناسب حجم العرض، ويجب أن يكون متوفرا، كما يقول Luke Wroblewski في كتابه Mobile First، البدء بشيء صغيرا وتطويره وليس العكس يمكنه في الواقع تحسين تصميم الموقع. تتطلب الأجهزة المحمولة من فرق التطوير التركيز فقط على البيانات والإجراءات الأكثر أهمية في التطبيق. لا توجد مساحة في شاشة 320x480 بكسل للعناصر الإضافية وغير الضرورية، لذا عليك أن تعطي الأولوية للعناصر المهمة. 4. يوفر صفحة يمكن الوصول إليها دون إنترنت عندما يكون المستخدمون غير متصلين، فإن الاحتفاظ بهم في تطبيق الويب التقدمي الخاص بك يوفر تجربة أكثر سلاسة من الصفحة الافتراضية للمتصفح التي تعرض حالة عدم الاتصال بإنترنت. يتوقع المستخدمون أن تعمل التطبيقات المثبتة بغض النظر عن وجود إنترنت. لا يعرض التطبيق المخصص بالنظام صفحة فارغة عندما يكون الجهازة مفصولا عن الإنترنت، كذلك الأمر بالنسبة لتطبيق الويب التقدمي إذ يجب ألا يعرض الصفحة الافتراضية للمتصفح في وضع عدم الاتصال بالإنترنت. إن توفير تجربة مخصصة في وضع عدم الاتصال، سواء حاول المستخدم الولوج لرابط لم يتم تخزينه أو حاول استخدام ميزة تتطلب اتصالا يساعد على جعل تجربة الويب الخاصة بك تشغر المستخدم بأنها جزء من الجهاز الذي يتم التشغيله عليه. يمكنك جعل تطبيق الويب التقدمي الخاص بك يعمل بدون اتصال وذلك بتخزين صفحة لا تتطلب اتصالا بالإنترنت مؤقتًا لاستخدامها لاحقًا أثناء حدث تثبيت منجز الخدمة، إذا انتقل المستخدم إلى وضع عدم الاتصال، فيمكنك حينها استخدام الصفحة التي خزنتها. ويمكنك متابعة offline page sample للاطلاع على مثال على ذلك أثناء العمل ومعرفة كيفية تنفيذه بنفسك. 5. قابل للتثبيت يميل المستخدمون الذين الذين ثبتوا التطبيق أو أضافوه إلى أجهزتهم إلى التفاعل مع هذه التطبيقات بشكل أكبر. تثبيت تطبيق الويب التقدمي يُشعِر المستخدم أن تطبيق الويب التقدمي الخاص بك مثل جميع التطبيقات المثبتة الأخرى. إذ يتم تشغيله من نفس المكان الذي تشغل منه المستخدمون تطبيقاتهم الأخرى. ويتم يتم تشغيله في نافذة تطبيق خاصة به منفصلة عن المتصفح ويظهر في قائمة المهام، مثله مثل التطبيقات الأخرى. السبب الذي يجعلك ترغب في أن يثبت المستخدمون تطبيق الويب التقدمي الخاص بك هو نفس السبب الذي يجعلك ترغب في تثبيت تطبيقك المخصص للنظام من متجر التطبيقات، فالمستخدمون الذين يثبتون تطبيق الويب التقدمي الخاص بك هم عادة الأكثر تفاعلاً، ومقايس تفاعلهم أفضل من المستخدمين العاديين، وغالبا ما يكون ذلك قريبا من مقاييس تفاعل المستخدمين على تطبيقك المخصص للنظام، تتضمن هذه المقاييس عددًا أكبر من الزيارات المتكررة، وقضاء وقت أطول على تطبيقك ومعدلات تحويل أعلى. ميزات تطبيقات الويب التقدمية المثالية تحتاج إلى ما هو أكثر من مجرد قائمة التحقق الأساسية لإنشاء تطبيق ويب تقدمي رائع ويكون أفضل تطبيق في فئته. يهدف وجود قائمة التحقق المثلى لتطبيق الويب التقدمي إلى جعله جزء من الجهاز الذي يعمل عليه بالاستفادة من ميزات الويب التي تجعله قويا. 1. يوفر إمكانية العمل دون إنترنت يمكن أن يعمل تطبيقك بنفس الطريقة التي يعمل بها أثناء وجود اتصال بالإنترنت عندما لا يكون الاتصال ضروريا. إضافة إلى توفير صفحة مخصصة لا تتطلب وصولا للإنترنت، يتوقع المستخدمون أن يكون تطبيق الويب التقدمي قابلا للاستخدام أثناء عدم الاتصال، مثلا: يجب في تطبيقات السفر وشركات الطيران أن تكون التفاصيل حول الرحلة وتذاكر الصعود إلى الطائرة متاحة بسهولة أثناء عدم الاتصال بالإنترنت. ويجب أن تسمح تطبيقات الموسيقى والفيديو والبودكاست بالتشغيل في وضع عدم الاتصال. ويجب أن تقوم تطبيقات التواصل الإجتماعي والأخبار بتخزين المحتوى الحديث مؤقتًا حتى يتمكن المستخدمون من قراءته أثناء عدم الاتصال بالإنترنت. ويتوقع المستخدمون أيضًا أن يظل دخولهم مسجلا في وضع عدم الاتصال، لذلك عليه أن تصمم مصادقة دون اتصال. يوفر تطبيق الويب التقدمي تجربة حقيقية شبيهة بالتطبيقات المخصصة للنظام أثناء وضع عدم الاتصال. بعد أن تقوم بتحديد الميزات التي يتوقع المستخدمون استعمالها دون اتصال بالإنترنت، ستحتاج إلى جعل المحتوى الخاص بك متاحًا وقابلًا للتكيف مع حالات عدم الاتصال بالإنترنت. يمكنك استخدام IndexedDB وهو نظام تخزين NoSQL في المتصفح مصمم لتخزين البيانات واستردادها دون اتصال، ويمكنك مزامنة الخلفية background sync للسماح للمستخدمين بعمل بعض الإجراءات أثناء عدم الاتصال بالإنترنت وتأجيل الاتصالات بالخادم حتى يتوفر الإتصال مرة أخرى. يمكنك أيضًا استخدام منجزات الخدمة لتخزين أنواع أخرى من المحتوى مثل الصور والفيديو والصوتيات استخدامها دون اتصال بالإنترنت، بالإضافة لذلك يمكنك استخدامها في الجلسات الآمنة طويلة الأمد للحفاظ على تسجيل دخول المستخدمين. من منظور تجربة المستخدم، يمكنك استخدام الواجهات أو الشاشات الهيكلية skeleton screens التي تمنح المستخدمين تصورًا حول المحتوى الذي يجري تحميله، ويمكن تخزين ذلك المحتوى وعرضه لاحقا بدون اتصال بالإنترنت. 2. إمكانية وصول كاملة يجتاز تطبيق الويب التقدمي متطلبات سهولة الوصول WCAG 2.0. يرغب معظم المستخدمين في مرحلة ما في الاستفادة من تطبيق الويب التقدمي الخاص بك، وإن بناء تطبيقك بطريقة تم تغطيتها بموجب متطلبات الوصول WCAG 2.0. يجعل المستخدمون قادرين على التفاعل مع تطبيق الويب التقدمي الخاص بك وفهمه على نطاق واسع وجعله قادرا على تلبية احتياجاتهم المؤقتة أو الدائمة. بجعل تطبيق الويب التقدمي الخاص بك قابلا للوصول، فإنك تضمن أنه يمكن استخدامه من طرف الجميع. يجب عليك إجراء اختبارات إمكانية الوصول يدويًا. ويمكن أن تساعدك أدوات مثل Accessibility في Lighthouse و axe، ويمكنك أتمتة بعض اختبارات إمكانية الوصول باستعمال Accessibility Insights. من المهم أيضًا استخدام العناصر ذات الدلالة المتعارف عليها بدلاً من صياغة عناصر جديدة بنفسك، على سبيل المثال: استخدام العناصر a و button يضمن ذلك أنه عندما تحتاج إلى إنشاء وظائف أكثر تقدمًا سيكون الوصول المتوقع من خلال هذه العناصر محققا (كمثال arrows أو tabs).. 3. يمكن الوصول إليه من خلال البحث يمكن الوصول لتطبيق الويب التقدمي PWA الخاص بك بسهولة من خلال البحث. إحدى أكبر مزايا الويب في القدرة على الوصول إلى المواقع والتطبيقات من خلال البحث. في الواقع يكون مصدر أكثر من نصف حركة مرور الموقع الإلكتروني من البحث الأساسي (محركات البحث). إن التأكد من وجود عناوين URL الأساسية للمحتوى وتكمن محركات البحث من فهرستها أمر بالغ الأهمية للمستخدمين ليتمكنوا من العثور على تطبيق الويب التقدمي الخاص بك. خاصة إن كان التقديم من جانب العميل client-side rendering. للقيام بذلك عليك بداية التأكد من أن جميع عناوين URL الخاصة بك تمتلك وصفا وتعريفا فريدا. يمكنك بعدها استخدام Google Search Console ومراجعات تحسين محرك البحث من Lighthouse لتصحيح وإصلاح مشكلات قابلية الاكتشاف لتطبيق الويب التقدمي الخاص بك. ويمكنك استخدام أدوات مشرفي المواقع الخاصة بمحركي بحث Bing أو Yandex، والنظر في تضمين البيانات المنظمة structured data عبر مخططات من Schema.org في تطبيق الويب التقدمي الخاص بك. 4. يعمل مع أي جهاز إدخال يمكن استخدام تطبيق الويب التقدمي PWA مع الفأرة أو لوحة المفاتيح أو القلم أو لوحة اللمس. تقدم الأجهزة إمكانيات مختلفة للاستخدام، ويجب أن يكون المستخدمون قادرين على التغيير بينها وبنفس القدر من سلاسة أثناء استعمالهم للتطبيق الخاص بك، يجب ألا تعتمد أساليب الإدخال على حجم الشاشة، مما يعني أن إطارات العرض الكبيرة تحتاج إلى دعم اللمس وأن إطارات العرض الصغيرة تحتاج إلى دعم لوحات المفاتيح والماوس، تأكد قدر ما تستطيع من أن التطبيق الخاص بك وجميع ميزاته تدعم استخدام أي طريقة إدخال قد يختارها المستخدم، يجب عليك أيضًا عند الحاجة تحسين تطبيقك للسماح بعناصر تحكم خاصة بالإدخال (مثل عنصر السحب-للتحديث pull-to-refresh). توفر واجهة برمجة تطبيقات Pointer Events API واجهة موحدة للتعامل مع مختلف الإدخالات، وهي مفيدة بشكل خاص لإضافة دعم القلم واللمس ولوحة المفاتيح، تأكد من أنك تستخدم العناصر الدلالية الصحيحة (الروابط anchors، الأزرار buttons، متحكمات النماذج form controls وما إلى ذلك) ولا تقم بنائها باستخدام كود أو عناصر HTML لا تمتلك دلالة معروف لدي المستخدم (وهذا يحسن إمكانية الوصول). تأكد عند تضمين الحدث "عند مرور الفأرة" من إمكانية تفعيلها عند النقر أيضًا. 5. طلب الأذونات عند طلب الإذن لاستخدام واجهات برمجة تطبيقات، استعمل السياق واطلب الإذن الذي تريده. تم تصميم الواجهات البرمجية التي تتطلب أذونات، مثل الإشعارات والموقع الجغرافي وبيانات الاعتماد، لتكون مزعجة للمستخدم عن قصد، لأنه غالبًا ما تكون هذه الإشعارات مرتبطة بوظائف غير مسموح تنفيذها إلا بموافقة المستخدم. يؤدي تفعيل رسالة طلب الأذونات من المستخدم دون سياق مناسب إلى تقليل احتمالية موافقة المستخدمين على تلك الأذونات وزيادة احتمالية عدم ثقتهم بالتطبيق مستقبلا. في حال كنت تحتاج الإذن، يجب عليك ان تشغل طلب الإذن فقط بعد تقديم سبب منطقي في سياق مناسب للمستخدم. 6. يوفر كود نظيف بأفضل الممارسات يمكن استخدام تطبيق الويب التقدمي PWA مع الفأرة أو لوحة المفاتيح أو القلم أو لوحة اللمس. هناك الكثير من الأمور التي عليك أخذها في الاعتبار عند بناء تطبيق ويب حديث، وإبقاء تطبيقك محدثا والكود الخاص به نضيفا يجعل تقديم ميزات جديدة تلبي الأهداف الموضحة في قائمة التحقق هذه أمرا أسهل. هناك عدة أمور عليك التحقق منها ليكون الكود الخاص بتطبيقك نظيفا، نذكر منها: تجنب استخدام المكتبات التي تملك ثغرات الأمنية المعروفة، التأكد من أنك لا تستخدم واجهات برمجية موقوفة Deprecated APIs، إزالة أنماط الويب المضادة من الكود الخاص بك (مثل document.write()‎ أو امتلاك القيمة non-passive لحدث التمرير)، وأيضا التأكد من أن تطبيق الويب التقدمي الخاص بك يستمر في العمل حتى إذا فشل تحميل التحليلات أو مكتبات الطرف الثالث الأخرى. ترجمة -وبتصرف- للمقال What makes a good Progressive Web App?‎ لصاحبيه Sam Richard وPete LePage. اقرأ أيضًا ما هي تطبيقات الويب التقدمية PWA؟ توفير تجربة تثبيت مخصصة داخل تطبيق الويب التقدمي PWA تشغيل تطبيقات الويب التقدمية PWA في وضع انقطاع الاتصال جدوى الاعتماد على تطبيقات الويب التقدمية PWA عوض تطبيقات الجوالات الأصيلة

تطبيقات الويب التقدمية أو PWA تكون على سلم أولويات العديد من الشركات بغرض تحديث مواقعها ودعم هذه التقنية لتحقيق توقعات المستخدمين، وكحال كل التقنيات والمفاهيم الجديدة يطرح أصحاب الأعمال أسئلة مهمة: ماذا يريد عملاؤنا؟ وإلى أي حد سيساهم هذا في نمو عملنا؟ وما الذي هو ممكن تقنيا باستعمال تطبيقات الويب التقدمية PWA أم نحتاج إلى تطبيق جوال أصلي خاص بمنصات الجوال؟ غالبا ما يشارك العديد من المسؤولين أصحاب المصطلحة في تشكيل الإستراتيجية الرقمية، كمدير الإنتاج وكُبراء مشرفي التسويق CMO وهم المشرفون الرئيسيون على تأثير الميزات على العمل، ويقوم الرئيس التنفيذي للتقنية CTO بتقييم جدوى وموثوقية التقنية، ويتحقق محللو تجرِبة المستخدم UX researchers من أن المِيزة تحقق تطلعات العملاء. تسعى هذه المقالة إلى الإجابة عن الأسئلة الثلاث السابقة وستبدأ بمعرفة احتياجات العميل ثم ترجمتها إلى ميزات في تطبيق الويب المتقدم PWA ثم التركيز على العمل، ثم معرفة تأثير كل مِيزة على العمل. تطبيقات الويب التقدمية تحقق تطلعات العملاء القاعدة التي تتبعها جوجل عند تصميم أي منتج هي "ركز على العميل وكل شيء آخر سيتبع ذلك"، أي فكر في المستخدم أولا: ما الذي يحتاجه العملاء؟ وكيف ستقدمه تطبيقات الويب التقدمية لهم؟ عند إجراء بحوث على المستخدم، نجد أنماطا مثيرة للإهتمام مع المصدر المستقى منه: يكره المستخدمون التأخير والانتظار على الهاتف: يمكن مقارنة مستوى القلق في هذه الحالة بمشاهدة فلم رعب. يستخدم 50% من المستخدمين موقع الشركة على المتصفح، لأنهم لا يحبون تنزيل التطبيقات. أحد أكثر الأسباب لحذف التطبيقات هو نفاذ التخزين (في حين تحجز تطبيقات الويب التقدمية أقل من 1 ميغابايت). مستخدمو الهواتف الذكية لديهم قابلية أكبر للشراء من المواقع التي تقدم توصيات ذات صلة ويقول 85% من المستخدمين أن إشعارات الهاتف مفيدة. استنادا إلى هذه البيانات نجد أن المستخدم يفضل التجربة الأسرع القابلة للتثبيت الموثوقة والجذابة! تستفيد تطبيقات الويب التقدمية من إمكانيات الويب الحديثة تقدم تطبيقات الويب التقدمية أفضل الممارسات، وواجهات ويب برمجية حديثة Web APIs، تهدف إلى تلبية احتياجات عملائك من خلال جعل موقعك سريعا، وقابلا للتثبيت، وموثوقًا، وجذابا. كمثال، استعمال منجزات الخدمة service workers للتخزين المؤقت والقيام بالتحميل المسبق للموارد يجعل موقعك سريعًا، ويعد جعل الموقع قابلا للتثبيت وسيلة سريعة للولوج للموقع من الواجهة الرئيسية، وواجهات برمجة الويب الجديد مثل إشعارات الويب تجعل جذب المستخدمين سهلا، مع إمكانية تخصيص المحتوى. فهم التأثير على العمل يمكن أن يكون للنجاح عدة تعريفات اعتمادًا على نشاطك مثل: قضاء المستخدمون وقتًا أطول في خدماتك انخفاض معدل ارتداد المستخدمين تحسين معدلات التحويل عودة عدد أكبر من المستخدمين تساهم أغلب مشاريع تطبيقات الويب التقدمية في رفع معدل تحويل المستخدمين للهاتف، ويمكنك معرفة المزيد عبر PWA case studies. اعتمادا على أهدافك، قد ترغب في إعطاء أولوية لبعض مميزات تطبيقات الويب التقدمية، وهو أمر جيد، إذ يمكنك اختبار الميزات وإطلاقها بشكل منفصل. دعنا نقيس تأثير كل مِيزة على العمل (السرعة، قابلية للتثبيت، الموثوقية، الجذب). تأثير سرعة الموقع على العمل أثبتت دراسة حديثة من موقع Deloitte Digital أن سرعة الموقع لها تأثير كبير على مقياس الأعمال. هناك الكثير مما يمكنك فعله لتحسين سرعة موقعك وبذلك تحسين تنقل المستخدمين، فإن كنت لا تدري من أين تبدأ، ترشدك الأداة Lighthouse إلى الأمور ذات الأولوية التي تتطلب إصلاح، واستمر في قراءة المزيد من مقالات حول PWA. عندما تريد تحسين سرعة موقعك، استعمل الأدوات المناسبة وخذ قياسات متكررة، كمثال: استعمل Lighthouse لقياس الأداء وضع أهدافا واضحة، مثل الحصول على قياس جيد في مقياس أساس حيوية الويب Core Web Vitals scores، وإظافة ميزانية الأداء إلى عملية البناء الخاصة بك، بفضل القياسات المتكررة ومنهجية قيمة السرعة value of speed، يمكنك عزل تأثير تغيرات السرعة وحساب قيمة المداخيل الإضافية التي حققها عملك. جعلت eBay السرعة هدف الشركة سنة 2019، استخدموا تقنية قيمة السرعة value of speed، لتحسين المسار الحرج، والتحميل المسبق، واستنتجوا أنه لكل تحسين في سرعة التحميل قدره 100 ملي ثانية، تزيد نسبة إضافة المنتجات للسلة بمقدار 0.5%. تأثير قابلية تثبيت الموقع على العمل لم قد ترغب في أن يثبت المستخدم تطبيق الويب التقدمي الخاص بك؟ الجواب: لجعل عودة المستخدم أسهل، لأن تطبيق الاندرويد سيتطلب على الأقل 3 خطوات: إعادة التوجيه لجوجل بلاي، تنزيل التطبيق، وإعادة فتح التطبيق. تثبيط تطبيقات الويب التقدمية يتطلب ضغطة زر واحدة، ولا تتطلب تحويل المستخدم عن المسار الحالي. بمجرد تثبيتها سيكون المستخدم قادرا على تشغيلها من الشاشة الرئيسة بضغطة زر واحدة، كما يمكنهم رؤيتها في قائمة التطبيقات المشغلة والانتقال بينها وبين التطبيقات الأخرى. إضافة لإمكانية الوصول إليها كأي تطبيق هاتف، لتطبيقات الويب التقدمية تجربة قائمة بذاتها مستقلة عن المتصفح، إذ تستفيد من خدمات الجهاز كالإنتقال بينها وبين التطبيقات الأخرى والإعدادات. من المحتمل أن تجد أن من ثبتوا تطبيق الويب المتقدم الخاص بك أكثر تفاعلا من الزوار العاديين، بزيارات متكررة أكثر، ووقت أطول في الموقع، ومعدل تحويل أعلى، تقريبا بنفس مستوى مستخدمي التطبيق الخاص الموجه للنظام. لجعل تطبيق الويب المتقدم الخاص بك قابل للتثبيت يجب أن يفي بالمتطلبات الأساسية، وبمجرد فعل ذلك سيكون متاحا للتثبيت. بمجرد أن تبدأ بالتسويق لتثبيت تطبيق الويب المتقدم الخاص بك، يجب عليه البدء بقياس عدد من نفذوا عملية بالتثبيت، وكيف يستخدمون تطبيقك. لزيادة عدد المستخدمين المثبتين لتطبيق الويب المتقدم الخاص بك، ربما تجرب عبارات تسويقية مختلفة كمثال فقط: "ثبت تطبيقنا في ثانية واحدة"، أو "أضف اختصارنا لمتابعة حالة طلبك" في أماكن مختلفة (أعلى الصفحة، في الخلاصة)، وجرب طرحها في خطوات مختلفة (في الصفحة الثانية للزائر، أو بعد الحجز). لمعرفة المكان الذي يغادر منه المستخدمون وكيفية تحسين الاحتفاظ بهم، يمكن قياس مسار التثبيت بأربع طرق: عدد المستخدمين المؤهلين لتلقي التثبيت عدد المستخدمين الذين ضغطوا على زر التثبيت عدد المستخدمين الذين وافقوا على التثبيت ثم رفضوه عدد المستخدمين الذين ثبتوا التطبيق بنجاح بإمكانك التسويق لتطبيقك بشكل عام أو اختباره على فئة صغيرة من المستخدمين، وبعد عدة أيام أو أسابيع يفترض أنك تملك بيانات كافية لمعرفة تأثير الحاصل على عملك. ما هو سلوك المستخدمين القادمين من الاختصار المثبت لتطبيقك، هل يتفاعلون بشكل أكبر، وهل يتحولون لموقعك أكثر؟ لإحصاء المستخدمين الذين ثبتوا تطبيق الويب التقدمي PWA الخاص بك، استخدم الحدث appinstalled واستخدم الجافاسكربت لمعرفة إن كان المستخدمون في وضع مستقل (يشير هذا إلى مستخدمي تطبيق PWA المثبت)، ثم استخدمها كمتغيرات أو أبعاد في تحليلاتك لسلوك الزوار. تعد دراسة الحالة الخاصة بـ Weekendesk مثيرة للاهتمام: إذ طرحوا على المستخدمين تثبيت تطبيق PWA في الصفحة ثانية للزيارة، لزيادة معدل التثبيت إلى الحد الأقصى، ولاحظوا أن العملاء الذين يعودون عبر الاختصار على الشاشة الرئيسية كانت فرصة حجزهم لإقامة لديهم أعلى بمرتين ونصف من باقي المستخدمين. التثبيت وسيلة ممتازة لزيادة عدد الزوار العائدين ورفع وفاء عملاءك، ويمكنك أيضا التفكير في تخصيص تجرِبة هؤلاء المستخدمين المدفوعين. حتى بامتلاكك لتطبيق مخصص للنظام الأساسي، يمكنك أن تجرب اقتراح تطبيق الويب التقدمي PWA الخاص بك للمستخدمين الذي رفضوا أو لم يتفاعلوا مع اقتراحك تثبيت تطبيقك الأساسي، بعض المستخدمين "الشبه متفاعلين" ربما لا يستوفون شروط تثبيت التطبيق الرئيسي، يمكن معالجة هذا الفوج من المستخدمين من خلال تثبيت تطبيق PWA لديهم إذ يعد بديلا أخف. تأثير موثوقية الموقع على العمل لعبة الديناصور في جوجل كروم، هي لعبة تُعرَض لما يكون الجهاز في وضع غير متصل بالإنترنت، تُعلَب أكثر من 270 مليون مرة في الشهر. هذا الرقم يثبت لك قلة موثوقية الإنترنت، خاصة في البلدان التي بها بيانات جوال غير موثوقة أو باهظة الثمن مثل الهند، والبرازيل، والمكسيك، وإندونيسيا. عندما يشغل المستخدم تطبيقا ما قام بتثبيته من متجر التطبيقات، يتوقع فتحه، بغض النظر عما إذا كان متصلا بالإنترنت أم لا. يجب ألا تكون تطبيقات الويب التقدمية مختلفة عن ذلك، على الأقل، يجب أن تقدم صفحة تظهر أن المستخدم غير متصل بالإنترنت، وأن التطبيق غير متاح، يمكنك اتخاذ بعض الإجراءات كوظائف في التطبيق في حال كان غير متصل، كمثال، يمكنك توفير وصول إلى التذاكر أو بطاقات الصعود إلى الطائرة، وقوائم الرغبات المحفوظة، ومعلومات الاتصال، والمقالات أو الوصفات التي شاهدها المستخدم مؤخرًا، وما إلى ذلك. بمجرد اعتمادك تجربة موثوقية المستخدم، ربما قد ترغب في قياسها؛ كم عدد المستخدمين غير المتصلين؟ ومن أي البلدان هم؟ وهل يبقون في الموقع حين يستعيدون الاتصال؟ يمكن قياس الاستخدام في حالة عدم الإتصال بتسجيل إشعارات الإحصاءات analytics pings عندما يتحول المستخدم بين وضع الاتصال وعدم الاتصال، هذا يعلمك عن عدد المستخدمين الذين استكملوا تصفح موقعك في أثناء عدم الاتصال بالإنترنت. توضح دراسة حالة Trivago كيفية تأثير ذلك على أهداف عملك: إذ بالنسبة للمستخدمين الذين انقطعت جلساتهم بسبب عدم اتصالهم بالإنترنت لفترة (تقريبًا ثلاثة بالمئة من المستخدمين)، فإن 67٪ ممن استعادوا اتصالهم بالإنترنت استمروا في تصفح الموقع. تأثير جاذبية الموقع للمستخدمين على العمل تسمح إشعارات الويب للمستخدمين بتلقي التحديثات في الوقت المناسب من المواقع التي يحبونها وتسمح لك بإعادة دمجهم بشكل فعال مع المحتوى المخصص ذي الصلة. رغم ذلك عليك التعامل بحذر، إذ أن مطالبة المستخدم بالاشتراك في الإشعارات في أول ولوج للتطبيق، قد ينظر له كشيء غير مرغوب، ويؤثر سلبا على تجربة المستخدمين، تأكد من اتباع أفضل الممارسات عند مطالبة المستخدمين بالاشتراك في إشعارات الويب الخاصة بك، كإبراز فائدتها أولا. تقنيا، تتم عملية إرسال إشعارات الويب في الخلفية بفضل منجز الخدمة service worker وغالبا ما يتم إرسالها باستخدام نظام مصمم لإرسال الإشعارات (Firebase مثلا)، ولهذه الميزة قيمة تجارية كبيرة لمستخدمي الأجهزة المحمولة Android وسطح المكتب، فهي تزيد الزيارات المتكررة وبذلك ترتفع المبيعات والتحويلات للموقع. لقياس فعالية حملات الإشعارات الخاصة بك، تحتاج إلى قياس مسار التحويل بالكامل: عدد المستخدمين المؤهلين لتلقي الإشعارات عدد المستخدمين الذين ينقرون فوق رسالة طلب التسجيل في الإشعارات المخصصة عدد المستخدمين الذين يمنحون إذن تقلي الإشعارات عدد المستخدمين الذين يتلقون الإشعارات عدد المستخدمين الذين يتفاعلون مع الإشعارات التحويل والتفاعل من المستخدمين القادمين من الإشعارات هناك الكثير من دراسات الحالة الرائعة حول إشعارات الويب، مثل Carrefour كارفور الذي ضاعف معدل التحويل بمقدار 4.5 عن طريق إعادة إشراك المستخدمين بسلة المشتريات التي تم التخلي عنها. الإطلاق التدريجي: إضافة ميزة تلو الأخرى تطبيقات الويب التقدمية هي مواقع حديثة تستفيد من حجم الوصول الهائل للويب، جنبا إلى جنب مع الميزات التي يحبها مستخدمو الأجهزة المحمولة والمكتبية في تطبيقاتهم، يستفيدون من مجموعة من أفضل الممارسات التقنية وواجهات برمجة تطبيقات الويب الحديثة Web APIs، والتي يمكن تنفيذها بشكل مستقل وفقًا لأولوياتك وخصوصيات عملك. لجعل تحديث موقعك لدعم تطبيقات الويب التقدمية PWA سريعًا، نشجعك على أن تكون مرنًا، بحيث تقوم بإطلاق الميزات بشكل متتابع ميزة تلو اخرى، ابحث مع المستخدمين عن الميزات التي ستجلب لهم أكبر قيم، ثم ناقشها مع المطورين والمصممين لديك، وأخيرا لا تنسى مقدار الدخل الإضافي الذي جلبه تحويل موقعك لتطبيق ويب تقدمي بدقة. ترجمة -وبتصرف- للمقال How Progressive Web Apps can drive business success?‎ لصاحبه Sébastien Fourault. اقرأ أيضًا ما هي تطبيقات الويب التقدمية PWA؟ نماذج اقتراحات تثبيت تطبيقات الويب التقدمية PWA تشغيل تطبيقات الويب التقدمية PWA في وضع انقطاع الاتصال

الويب منصة رائعة، إذ تُشغل على مستوى كل الأجهزة وأنظمة التشغيل، وتتميز بنموذج أمان يركز على المستخدم، يتم التحكم في تشغيله ومواصفاته من قبل مجتمع الويب وليس من قبل شركة أو كيان محدد، وهذا يجعله منصة مميزة لتطوير التطبيقات. ويمتلك الويب ميزة رائعة، وهي الروابط، إذ من الممكن البحث عن أي شيء ومشاركة ما وجدته مع أي شخص في أي مكان فقط برابط. تتميز مواقع الويب بكونها محدثة دائما، وسهولة الولوج إلى أي موقع، ويمكن أن تكون تجربتك على الموقع سريعة أو دائمة على حسب ما تحتاجه. تملك تطبيقات الويب وصولا كبيرا للمستخدمين، إذ يمكنها أن تصل إلى أي شخص في أي مكان وعلى أي جهاز بشيفرة مصدرية واحدة. تطبيقات الويب معروفة بكونها تطبيقات غنية وموثوقة، ومتواجدة في كل مكان، وتعمل بغض النظر عن اتصالك بالشبكة، وذات تجربة فريدة. ويمكنها قراءة وكتابة الملفات، والاتصال بأجهزة عبر USB والبلوتوث، وحتى التعامل مع البيانات المخزنة في جهازك، كجهات الإتصال والتقويم، ويمكنك حتى التقاط صور وتسجيل الأصوات وتشغيلها، كل هذا والمزيد من الخصائص تكسبها تجربة فريدة لتبدو وكأنها جزء من النظام نفسه. الوصول مقابل الإمكانيات لكل من تطبيقات الويب والتطبيقات الخاصة بالنظام وتطبيقات الويب التقدمية PWA إذا وازنت بين التطبيقات المبنية خصيصًا للنظام وتطبيقات الويب من ناحية الإمكانيات والوصول، فإن التطبيقات المخصصة للنظام بالتأكيد تملك إمكانيات أكبر، ولكن تطبيقات الويب لديها وصول أكبر، فماذا عن تطبيقات الويب التقدمية؟ بنيت تطبيقات الويب التقدمية PWA -اختصارًا إلى Progressive Web Apps- بحيث تستفيد من واجهة برمجيات الويب الحديثة لتقديم إمكانيات عالية وموثوقية كبيرة وقابلية للتثبيت لتصل للجميع في أي مكان وعلى أي جهاز. الركائز الأساسية لتطبيقات الويب التقدمية اعتمد تصميم تطبيقات الويب التقدمية على ثلاثة ركائز أساسية: الإمكانيات وقابلية التثبيت والموثوقية، هذه الركائز الثلاث تجعل تجربة تطبيق الويب التقدمي شبيهة بالتطبيقات المخصصة للنظام. الإمكانيات يقصد بالإمكانيات ما يستطيع الويب فعله، يُعد الويب حاليا قادرًا على القيام بأغلب المهام دون الإعتماد على أي إضافات خارجية، فمثلا، يمكنك إنشاء تطبيق دردشة فيديو باستخدام WebRTC وهي تقنية لدردشة الفيديو في الويب، ومعرفة الموقع، وإرسال إشعارات. ويمكنك جعل التطبيق قابلا للتثبيت، وجعل المحادثات داخل عالم افتراضي باستخدام WebGL و WebVR وأصبح بإمكان المطورين مع WebAssembly الولوج إلى بيئات مختلفة مثل C و C++‎ و Rust وجلب ميزات قوية للويب كانت حكرا على التطبيقات المخصصة للنظام، كمثال موقع Squoosh.app الذي يقدم إمكانية ضغط صور متقدمة، فحتى وقت قريب، كانت التطبيقات المخصصة للنظام فقط قادرة على القيام بعمليات تتطلب أداءً عالية كالمثال الذي ذكرناه. رغم أن بعض الإمكانيات لا تزال بعيدة عن متناول الويب، فإن واجهات برمجة التطبيقات WebAPI الجديدة والقادمة تتطلع لجعل ذلك ممكنا، وجعل الويب قادرًا على القيام بما هو أكثر كالوصول لنظام الملفات وعناصر التحكم في الوسائط وإشعارات التطبيق والدعم الكامل للحافظة. كل هذه الميزات يتم تصميمها بنموذج الأذونات، ما يجعل الويب بيئة آمنة. تطبيقات الويب الآن أقوى من أي وقت مضى، فصار الويب بفضل واجهة التطبيقات البرمجية الحديثة والقادمة وتكنولوجيا WebAssembly قادرًا على القيام بما كان يبدو مستحيلًا في وقت مضى، في حين لازال قادرًا على تقديم المزيد. الموثوقية يعطي تطبيق الويب التقدمي تجربة أكثر موثوقية سواء كان هناك اتصال بالإنترنت أم لا، حتى بدون إنترنت، يتوقع المستخدم شيئا ما من التطبيق. إلى جانب ضرورة عمل بعض وظائف التطبيق بدون إنترنت، فإن السرعة أمر بالغ الأهمية في ما يتعلق بموثوقية تطبيقك، إذ تتراوح أوقات تحميل الصفحة بين ثانية واحدة وعشر ثوانٍ، ويزداد اعتمادا على ذلك احتمال ارتداد المستخدم بنسبة 123٪. لا يتوقف الأداء بعد الحدث onload، عندما ينقر المستخدم مثلا فوق زر ما فإنه يتوقع حدوث شيء ما، ويجب أن يشعر المستخدم بسلاسة أثناء التمرير، إذ يؤثر الأداء على تجربة المستخدم كليا، من حيث كيفية نظر المستخدمين لتطبيقك وأدائه الفعلي. يجب أن تكون التطبيقات الموثوقة قابلة للاستخدام سواء بوجود اتصال بالإنترنت أو بدونه، حتى في حال عدم اتصال التطبيق بالإنترنت، يتوقع المستخدمون الولوج لأشياء كقائمة الرغبات أو التذاكر المحفوظة وغيرها من الأمور. عندما يكون طلب شيء ما من الخادم غير ممكن، يتوقع المستخدمون رسالة تخبرهم بالمشكلة بدل انهيار التطبيق وتوقف استجابته. يحب المستخدمون التطبيقات التي تستجيب بسرعة، والتي يمكنهم الاعتماد عليها. قابلية التثبيت تتميز تطبيقات الويب التقدمية بقابلية التثبيت وتُشغل في نافذة منفصلة بدلًا من تبويبة المتصفح، ويتم تشغيلها من اختصار في الشاشة الرئيسية أو شريط المهام أو حتى قائمة التطبيقات، ويمكن البحث عنها والانتقال بينها وبين التطبيقات الأخرى كأي تطبيق آخر، وكأنها جزء من التطبيقات العادية. يحصل تطبيق PWA على إمكانيات جديدة بعد التثبيت، إذ يمكنه تلقي بيانات من تطبيقات أخرى أو جعله تطبيقا افتراضيا لنوع ما من الملفات. تتغير طريقة تفكير المستخدمين حول تطبيق الويب عند تشغيله في نافذة منفصلة. تطبيقات الويب مقابل تطبيقات الويب التقدمية تطبيقات الويب التقدمية مجرد تطبيقات ويب في الأصل، لكن باستخدام منجزات خدمة service workers وبيان تطبيق الويب manifest. يصبح تطبيق الويب قابلا للتثبيت وموثوقًا، تدريجيا تضاف إمكانات جديدة للمتصفحات، وإن لم تكن الإمكانيات الجديدة متوفرة سيبقى بإمكان المستخدم الحصول على التجربة الأساسية لتطبيق الويب، وهذا يجعل تطبيق الويب التقدمي مرنًا للغاية. الأرقام لا تخفي نفسها! فحققت الشركات التي أطلقت تطبيقات الويب التقدمية نتائج باهرة. مثلا، شهد تويتر زيادة بنسبة 65٪ لمدة الجلسات، وزيادة بنسبة 75٪ في التغريدات، وانخفاضًا بنسبة 20٪ في معدل الارتداد، بحجم أقل 97٪ من التطبيق الرئيسي. بعد التحول إلى تطبيقات الويب التقدمية، شهد مؤشر نيكي Nikkei زيادة في عدد زيارات الأعضاء بمعدل 2.3 مرة، واشتراكات أكثر بنسبة 58٪، وزيادة في عدد المستخدمين النشطين كل يوم بنسبة 49٪. استبدلت هولو Hulu تجربة تطبيق سطح المكتب الخاصة بالنظام الأساسي بتطبيق ويب تقدمي وشهدت زيادة بنسبة 27٪ في عدد المستخدمين العائدين للتطبيق. توفر لك تطبيقات الويب التقدمية فرصة مميزة لتقديم تجربة ويب يحبها المستخدمون. بإمكانات أكثر، وموثوقية أكبر، بفضل أحدث ميزات الويب، وتتيح تطبيقات الويب التقدمية إمكانية تثبيت تطبيقك لدى أي شخص في أي مكان وعلى أي جهاز بكود واحد. ترجمة -وبتصرف- للمقال What are Progressive Web Apps?‎ لصاحبيه Sam Richard و Pete LePage. اقرأ أيضًا توفير تجربة تثبيت مخصصة داخل تطبيق الويب التقدمي PWA تشغيل تطبيقات الويب التقدمية PWA في وضع انقطاع الاتصال شرح ملف البيان manifest لتطبيق الويب التقدمي PWA