آیا وب‌اپلیکیشن‌های پیش رونده (PWAs) آینده طراحی وب هستند؟

گردآوری و تالیف : علیرضا معمارزاده
تاریخ انتشار : 30 آبان 1398
دسته بندی ها : طراحی وب

در جهانی که دوسوم جمعیت آن از طریق دستگاه‌های موبایل باهم در ارتباط هستند، یک اعلام حضور قوی در محیط موبایل، بهترین راه برای کسانی است که می‌خواهند دیده شوند. 

آیا وب‌اپلیکیشن‌های پیش رونده (PWAs) آینده طراحی وب هستند؟

سؤال اصلی این است که چگونه می‌توان برای کاربران دسکتاپ و موبایل مشابه هم هدف‌گذاری کرد درحالیکه آن هدف مانند یک وب پاسخگو باشد و نیازی هم به توسعه و پشتیبانی جداگانه برای هردو سیستم‌عامل موبایل (iOS و Android) نداشته باشد.

در سال‌های اخیر، بسیاری از توسعه‌دهندگان قانع شده‌اند که، وب‌اپلیکیشن‌های پیش رونده (PWAs) بهترین پاسخ برای این سؤال هستند و در این مقاله هم بررسی می‌کنیم که آیا آنها واقعاً آینده طراحی وب هستند؟

وب‌اپلیکیشن‌های پیش رونده چیست؟

عبارت «وب‌اپلیکیشن‌های پیش رونده» در سال 2015 مطرح شد، که درواقع در قرن پیش زمانی که توسعه وب مطرح شد، پایه‌گذاری شده بود؛ اما هنوز هم‌مقداری ابهام در مورد آناتومی آنها وجود دارد. 

به‌طور خاص PWAs وبسایت‌هایی شبیه برنامه هستند که از فناوری‌های وب برای ترکیب بهترین بخش‌های وب و محیط native استفاده می‌کنند. ‌

آنها شامل سه جزء کلیدی زیر هستند:

  • وبسایت: ازنظر مرکزی، تمام PWAها وب‌سایت‌هایی کم‌وبیش معمولی هستند که با HTML، CSS و JavaScript نوشته می‌شوند. 

ازآنجایی‌که PWAها کاملاً به JavaScript برای تعامل با وبسایت وابسته هستند، نیازی به نصب هیچ محیط پیشرفته‌ای برای ساخت آنها نیست و تمام مرورگرهای وب مدرن در حال حاضر از آنها پشتیبانی می‌کنند.

  • فهرست وب: PWAها به همراه یک فایل JSON می‌آیند که به مرورگر وب و دستگاه اعلام می‌کند که آنها مربوط به PWA هستند و یک وبسایت معمولی نیستند. 

فایل JSON شامل اسم PWA، آیکون‌های آن، تعاریف و اطلاعاتی درباره اینکه برای خوب کارکردن به چه دسترسی‌هایی از دستگاه نیاز دارد و سایر موارد است.

  • بخش سرویس‌دهی: جهت فراهم کردن پایه فنی برای کارآمد بودن، به‌صورت سنتی تنها با خدمات برنامه‌های موبایل همراه شده است مثل: اعلام پیغام‌های هشداردهنده، امکان کارکرد آفلاین و هم‌زمانی پیش‌زمینه‌ای دوره‌ای. PWAها از اسکریپت جاوااسکریپت استفاده می‌کنند که در پیش زمینه به‌ صورت مستقل از خود وبسایت اجرا می‌شود.

«PWAها یک تکامل طبیعی از چگونگی توزیع و استفاده از نرم‌افزار است.» عبارتی از توسعه‌دهندگان وب Google و Microsoft در مقاله وب‌اپلیکیشن‌های پیش رونده: آینده وب موبایل. «چون آنها بر پایه فناوری‌های وب هستند، مستقل از هر سیستم عملگر یا محیط پیشرفته‌ای می‌باشند.»

آیا وب‌اپلیکیشن‌های پیش رونده (PWAs) آینده طراحی وب هستند؟

آیا PWA آینده طراحی وب رسپانسیو است؟

تقریباً برای دو دهه (اولین مستندات مربوط به طراحی وبسایت رسپانسیو، توسط Audi در سال 2002 منتشر شد)، توسعه‌دهندگان وب به روش طراحی وب رسپانسیو که با این ویژگی وفادار ماندند: قابلیت نمایش خوب وبسایت‌ها در دستگاه‌هایی با صفحات کوچک و بزرگ مشابه بدون نیاز به پشتیبانی یک نسخه خاص موبایل از وبسایت مشابه.

مشکلی که در رابطه با طراحی وب پاسخگو وجود دارد، این است که نمی‌تواند پاسخگوی انتظارات کاربران مختلف با دستگاه‌های دارای سایز متفاوت پنجره یا صفحه باشد؛ که به همین دلیل بسیاری از طراحان وب می‌پرسند: «آیا PWA آینده طراحی وب رسپانسیو است؟»

به‌طور خاص، طراحی وب رسپانسیو وقتی‌که روی هر دستگاهی نشان داده می‌شود از روش‌های ارتقای پیشرفته برای ارائه ویژگی‌های native استفاده نمی‌کند. وب‌اپلیکیشن‌های پیش رونده این مشکل را با استفاده از بخش سرویس‌دهی با ایجاد یک مخزن کامل از ملاحظات طراحی اساسی حل می‌کنند، علاوه بر پاسخگویی تمام توسعه‌دهندگان و طراحان باید موارد زیر را در ذهنشان نگهدارند:

  • آماده بودن برای تغییر: جنبه پیشرفته بودن PWAها به این معنی است که روی بازدیدهای جایگزین (یا حتی در لحظه) کارآمدی بیشتری وجود دارد و کاربران باید به‌صورت مناسب در جریان تمام تغییرات به‌وسیله پیغام‌های هشداری و سایر ابزارها قرار بگیرند.
  • اعلان پیغام‌های هشداردهنده: یک ویژگی کلیدی PWAها، اعلان پیغام‌های هشداردهنده است. توانایی اعلان پیغام‌های هشداری برای افزایش درگیری کاربران به‌خوبی در اینجا مستند شده است، اما اگر به‌درستی مدیریت نشود، می‌تواند کاربران را از مسیر منحرف کند.
  • حالتهای مختلف: PWAها باید باحالت‌های مختلفی در ذهن طراحی شوند و در حالت آفلاین هم به‌خوبی حالت آنلاین کار کنند. سایر حالت‌ها شامل مشکلات شبکه، بارگذاری محتوا یا بارگذاری تنها بخشی از محتوا است.
  • عملکرد قابل‌درک: به‌طور خاص در بازارهای درحال‌توسعه مثل هند که بیشتر مردم به وب از طریق دستگاه‌های low-end دسترسی ندارند، استفاده از بارگذاری صفحات اسکلتی و انیمیشن‌های گذرا که به کاربران اجازه می‌دهد بدانند که درحال‌توسعه اپلیکیشن هستند، مهم است و باعث بهبود عملکردهای قابل‌درک می‌شود.
  • دسترسی: واضح است که PWAها باید از راهنمای دسترسی به محتوای سایت پیروی کنند 2.0 (WCAG) که بیان می‌کند چگونه محتوای وب برای کسانی که توانایی ندارند، قابل‌دسترسی می‌شود.

آیا وب‌اپلیکیشن‌های پیش رونده (PWAs) آینده طراحی وب هستند؟

منافع بسیار

بیشتر شرکت‌های اصلی شامل Twitter و Alibaba در حال حاضر پاسخ این سؤال را می‌دانند: «آیا PWA آینده طراحی وب است؟» آنها از PWAها در استراتژی‌های دیجیتالی خودشان استفاده می‌کنند و سود بسیاری از طراحی وب کسب می‌کنند.

وب‌اپلیکیشن‌های پیش رونده مربوط به Twitter Lite باعث شده است که رسانه‌های اجتماعی بزرگ به افزایش 65درصدی در صفحات هر بخش، 75درصد افزایش در توئیت‌های ارسال‌شده و کاهش 20 درصدی در نرخ دفع کاربر برسند ازطریق ارائه سریع‌تر، اعتمادپذیری بیشتر و داشتن تجربیات جذابتر با وب موبایل.

به گفته Nicolas Gallagher که مهندس برجسته Twitter Lite است، «Twitter Lite در حال‌ حاضر سریعترین و قابل‌اعتمادترین روش استفاده از Twitter است.» «برنامه وب شبیه عملکرد برنامه‌های native ما است اما نیاز به 3درصد فضای کمتر در مقایسه با Twitter برای Android دارد.»

AliExpress، سرویس خرده‌فروشی آنلاین Alibaba گزارش کرده است که بعد از انتشار PWA آن، زمان صرف شده در هر بخش به میزان متوسط 74درصد از تمام مرورگرها افزایش‌یافته است به همراه کاربرانی که صفحات هر بخش را دو بار نگاه می‌کنند. 

اتفاق مشابهی هم‌، زمانی که Alibaba یک PWA برای پلتفرم تجاری خود به نام B2B منتشر کرد، رخ داد که نشان می‌دهد سود حاصل از PWAها به‌وسیله بازار عمودی محدود نمی‌شود.

نتیجه‌گیری

اینطور به نظر می‌رسد که وب‌اپلیکیشن‌های پیش رونده آینده طراحی وب هستند که توسعه‌دهندگان وب را قادر می‌سازند، تجربه کاربری ایجاد کنند که منجر به دسترسی به وبی با عملکرد برنامه‌های native می‌شود. مثل هر فناوری جدید دیگری، آن‌ها ملاحظات طراحی پایه‌ای خودشان را دارند اما منافع زیادشان آنها را به یک ابزار باارزش تبدیل کرده است.

همچنین ما در سایت راکت دوره‌ی جامع و کاملی راجع به وب‌اپلیکیشن‌های پیش رونده آماده کرده‌ایم. برای اطلاعات بیشتر این لینک را مشاهده کنید. 

منبع

مقالات پیشنهادی