Chrome Dev Summit - خلاصه تلفن همراه

اجلاس Chrome Dev Summit چند هفته پیش به پایان رسید، و در اینجا اولین گزارش از یک سری گزارش از این رویداد است. تاکید زیادی بر توسعه موبایل و بین دستگاه‌ها وجود داشت، بنابراین ما با آن شروع می‌کنیم!

بهترین الگوهای UX برای برنامه های وب تلفن همراه توسط Paul Kinlan

پس از تجزیه و تحلیل دوستی تلفن همراه 1000 سایت برتر، برخی از زمینه های مشکل را پیدا کردیم: 53٪ هنوز فقط یک تجربه فقط دسکتاپ را ارائه می دهند، 82٪ سایت ها مشکلاتی با تعامل در دستگاه تلفن همراه دارند و 64٪ سایت ها دارای متن هستند. کاربران در خواندن مشکل خواهند داشت.

بازدیدهای سریع برای بهبود چشمگیر تجربه وب تلفن همراه شما

  • همیشه یک viewport تعریف کنید
  • محتوا را در داخل درگاه نمایش قرار دهید
  • اندازه فونت را در سطح قابل خواندن نگه دارید
  • استفاده از فونت های وب را محدود کنید
  • اندازه و فاصله مناسب روی اهداف ضربه بزنید
  • از انواع معنایی برای عناصر ورودی استفاده کنید

PageSpeed ​​Insights به تازگی تجزیه و تحلیل UX را برای تعیین میزان سازگاری سایت شما با موبایل راه اندازی کرده است. این به شما کمک می کند تا مشکلات رایج UX موبایل سایت خود را پیدا کنید . آن را امتحان کنید!

اسلایدها: بهترین الگوهای UX برای برنامه های وب تلفن همراه

دسترسی چند دستگاه توسط آلیس باکسال

کاربران از دستگاه‌های متعددی با طیف وسیعی از نیازهای دسترسی مختلف به سایت‌ها و خدمات شما دسترسی خواهند داشت. با استفاده از عناصر معنایی صحیح و نقش‌های صحیح ARIA به مرورگر و فناوری کمکی درک بهتری از صفحه خود کمک می‌کنید.

اسلایدها: قابلیت دسترسی چند دستگاهی

راه های کلیدی برای درک و رسیدگی به مسائل a11y

  • مطمئن شوید که یک تجربه کاربری خوب فقط با صفحه کلید دارید
  • معنای رابط کاربری خود را با انتخاب صحیح عنصر و ARIA بیان کنید
  • برای آزمایش از ChromeVox در دسک‌تاپ و TalkBack در Android استفاده کنید.
  • افزونه Accessibility Developer Tools Chrome را امتحان کنید
  • مخاطبان متنوع تری در حال آنلاین شدن هستند که نیاز به دسترسی به سایت های شما را بیشتر می کند

ساخت برنامه های تلفن همراه با استفاده از Chrome WebView توسط Matt Guant

همه ما مشکلاتی را که توسعه دهندگان در ساختمان قبلی برای WebView داشتند، می دانیم: ویژگی های محدود HTML5، بدون ابزار اشکال زدایی، بدون ابزار ساخت. با معرفی WebView مبتنی بر Chromium در Android 4.4 (KitKat) توسعه دهندگان اکنون طیف وسیعی از ابزارهای جدید را برای ساختن برنامه های بومی عالی با استفاده از WebView در اختیار دارند.

WebView از اشکال زدایی کامل از راه دور با همان ابزارهایی که برای Chrome استفاده می کنید پشتیبانی می کند. همچنین می توانید گردش کار توسعه وب مورد اعتماد خود را با Grunt بگیرید و آن را از طریق Gradle در ابزار پشته بومی خود ادغام کنید. با ادغام بیشتر دنیاها، یک ترفند هوشمندانه برای استفاده از ابزار توسعه کروم برای آزمایش کد بومی خود از جاوا اسکریپت وجود دارد.

اسلایدها: با استفاده از Chrome WebView برنامه‌های موبایل بسازید

راهکارهای موثر توسعه WebView

  • این ویژگی های جدید نیستند که مهم هستند، بلکه ابزارهایی هستند که اکنون می توانید برای سرعت بخشیدن به گردش کار خود استفاده کنید
  • سعی نکنید از رابط کاربری بومی تقلید کنید. اما مطمئن شوید که برخی از این موارد را که محتوای وب است حذف کنید.
  • در صورت لزوم از پیاده سازی های بومی ویژگی ها استفاده کنید. به عنوان مثال، از DownloadManager به جای XHR برای فایل های بزرگ استفاده کنید.

بهینه سازی گردش کار خود برای دنیای بین دستگاهی توسط مت گانت

اگر بخواهیم برای دسکتاپ، موبایل، تبلت، ابزارهای پوشیدنی و سایر فاکتورهای شکلی توسعه دهیم، چگونه می‌توانید گردش کار خود را بهینه کنید تا زندگی‌تان استرس کمتری داشته باشد؟ با LiveReload، Grunt، Yeoman، و Mini Mobile Device Lab جدیداً رونمایی شده، یک رویکرد چند دستگاهی محکم برای تکرار سریع وجود دارد. در نهایت، اگر سخت افزار فیزیکی را که می خواهید آزمایش کنید ندارید، برخی از ارائه دهندگان آن را از طریق ابر در دسترس قرار می دهند.

اسلایدها: بهینه سازی گردش کار خود برای دنیای بین دستگاهی

امتیاز کلیدی

  • تعداد دستگاه هایی که قرار است به آنها رسیدگی کنیم فقط افزایش می یابد
  • با Grunt و Yeoman گردش کار خود را به درستی دریافت کنید
  • با استفاده از Mini Mobile Device Lab ، مرورگر متقابل و تست متقابل دستگاه را ساده کنید
  • با انتخاب شبیه‌سازی خود با استفاده از شبیه‌سازی Chrome DevTools، شبیه‌سازهای سهام، شبیه‌سازهای مبتنی بر ابر مانند Saucelab ، مرورگرها و appexperience و شبیه‌ساز شخص ثالث Genymotion هوشمند باشید.
  • آزمایش تلفن همراه به معنای چیزی بیش از آزمایش اتصال وای فای شما، استفاده از پروکسی برای شبیه سازی سرعت پایین تر شبکه است.

اتصال به شبکه: اختیاری توسط جیک آرچیبالد

ما از این صحبت چیزهای زیادی یاد گرفتیم: جیک هنگام ارائه کفش نمی پوشد. Business Kinlan کتاب جدیدی دارد که به زودی منتشر می شود. آفلاین توسط فروشندگان مرورگر جدی گرفته می شود و شما به زودی ابزارهایی را در دست خواهید داشت که به شما کمک می کند تجربیات عالی بسازید که در زمان آفلاین به خوبی کار کنند.

ServiceWorker به ما انعطاف‌پذیری لازم را می‌دهد تا اولین تجربه‌های آفلاین قانع‌کننده را به آسانی ایجاد کنیم و از دردسرهای AppCache متحمل نشویم. حتی می توانید با استفاده از Polyfill با API آزمایش کنید .

اسلایدها: اتصال به شبکه: اختیاری

ServiceWorker برای نجات

  • در نسل بعدی ارتقاء تدریجی، ما با شبکه به عنوان یک پیشرفت بالقوه برخورد می کنیم
  • ServiceWorker کنترل کامل، قابل اسکریپت و اشکال زدایی درخواست های شبکه را به شما می دهد
  • اگر تجربه آفلاینی دارید، قبل از نشان دادن آن منتظر نمانید تا شبکه از کار بیفتد، زیرا ممکن است چندین سال طول بکشد.