گزارش پیمایش 2021

گزارش پیمایش 2021 را به همراه کلماتی از تیم Chrome در مورد تأثیر این موضوع بر اولویت‌ها و برنامه‌های Chromium و وب دریافت کنید.

آدام آرگیل
سام داتون

در ماه آوریل، تیم Chrome یک نظرسنجی حرکتی و لمسی را بر اساس مهمترین مشکلات گزارش شده از گزارش DNA وب MDN 2019 منتشر کرد. گزارش نظرسنجی اسکرول 2021 آماده است و تیم Chrome مایل است برخی از افکار و اقداماتی را که از نتایج نظرسنجی به دست آورده‌ایم به اشتراک بگذارد. امیدواریم این نتایج به فروشندگان مرورگر و گروه‌های استاندارد کمک کند تا نحوه بهبود پیمایش وب را درک کنند.

گزارش نظرسنجی اسکرول 2021 را مشاهده کنید.

نتایج قابل توجه

این نظرسنجی به صورت ناشناس 880 مورد ارسالی را جمع آوری کرد که 366 مورد به هر سوال پاسخ دادند.

در حالی که شروع با اسکرول یک خط CSS است، مانند overflow-x: scroll; ، مساحت سطح APIهای اسکرول و گزینه‌ها بزرگ است و جاوا اسکریپت تا CSS را در بر می‌گیرد. نتایج زیر به برجسته کردن مشکلاتی که توسعه دهندگان وب با آن مواجه هستند کمک می کند.

رضایت کلی از پیمایش وب

سوال 27

45 درصد

به طور کلی تا حدودی یا به شدت ناراضی هستند
با پیمایش وب .

این سوال در نزدیکی پایان نظرسنجی به طور عمدی، پس از سوالات مربوط به 26 مورد استفاده از اسکرول و ویژگی ها قرار داده شد. از پاسخ، واضح است که جامعه وب با اسکرول مشکل دارد. تقریبا نیمی از پاسخ دهندگان سطحی از نارضایتی کلی را گزارش کردند.

ما معتقدیم که احساسات کلی در مورد کار با اسکرول نباید اینقدر کم باشد. این معیار باید تغییر کند. این یک سیگنال واضح است که باید کاری انجام شود.

مشکل در کار با اسکرول

سوال 2

43 درصد

گزارش شده تا حدودی یا
فوق العاده سخت
برای کار با اسکرول .

از تحقیقات ما، این مشکلات ناشی از موارد متعدد استفاده برای اسکرول است. هنگامی که ما در مورد پیمایش صحبت می کنیم، ممکن است شامل موارد زیر باشد: - تعیین موقعیت عناصر در مناطق قابل پیمایش - پیمایش بی نهایت - انیمیشن مرتبط با پیمایش - چرخ فلک ها - صفحه نمایش اسکرول - پیمایش چرخه ای - پیمایش مجازی

عدم وجود ویژگی‌های مرورگر، جاوا اسکریپت پیچیده و نیاز به پشتیبانی از حالت‌های ورودی از جمله لمس، صفحه‌کلید و گیم‌پد، همه این موارد را سخت‌تر می‌کند.

اهمیت تعاملات لمسی

سوال 3

51 درصد

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

با توجه به اینکه کاربران وب تلفن همراه همچنان در حال افزایش آمار بازدید هستند ، تعجب آور نبود که نیمی از پاسخ دهندگان گزارش دادند که لمس برای کار آنها در وب بسیار مهم است. این نشان می‌دهد که ویژگی‌های وب مانند Snap Scroll CSS و touch-action به توجه بیشتری نیاز دارند تا وب بتواند تعامل لمسی با کیفیت بالا را ارائه دهد.

مشکل در ناوبری کلید تب یا صفحه بازی

سوال 5 الف

44 درصد

گزارش تا حدودی یا بسیار دشوار است
برای انجام ناوبری گیم پد و تب .

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

یادگیری touch-action

سوال 9

50 درصد

گزارش یادگیری در مورد
«عمل لمسی: دستکاری».
از نظرسنجی

برخی از سؤالات نظرسنجی درباره استفاده از APIهای خاص با پاسخ احتمالی بله، خیر یا «امروز یاد گرفتم» پرسیده شد. یکی از بازخوردهای قابل توجه، تعداد افرادی بود که گزارش کردند از این نظرسنجی در مورد touch-action یاد گرفته‌اند، زیرا این یک ویژگی مهم در هنگام ساخت ژست‌های لمسی سفارشی است که نیاز به تعامل در اسکرول دارند.

پیمایش چرخه ای

سوال 27

58 %

گاهی اوقات، اغلب یا در مورد هر پروژه گزارش دهید
با استفاده از پیمایش چرخه ای

این ویدئو پیمایش ثانیه های چرخه ای را نشان می دهد،
بعد از 60 ثانیه دوباره از 0 شروع می شود.

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

آیا مناطق قابل پیمایش مهم هستند؟

سوال 2

55 درصد

خیلی یا
فوق العاده مهم

16 درصد

اصلا گزارش نمیده
یا کمی مهم است

پاسخ دهندگان به شدت در مورد اهمیت مناطق قابل پیمایش احساس می کردند، و سیگنال دیگری در مورد مبارزات مورد نیاز برای ارائه پیمایش با کیفیت بالا می دهد.

چرخ فلک ها

سوال 20

87 %

از چرخ و فلک استفاده کرده اند .

24 درصد

گزارش کنید که هستند
آسان برای مدیریت

تقریباً هر پاسخ دهنده در کار وب خود چرخ و فلک ارائه می کند، در حالی که تنها 25٪ مدیریت آنها را آسان می دانند. چرخ فلک های خارج از قفسه در طول تحقیقات ما بسیار محبوب بودند، اما این آمار ما را شگفت زده کرد، زیرا به نظر نمی رسد خیلی حل شده باشد.

اسکرول بی نهایت

سوال 22

65 درصد

گاهی اوقات از آن استفاده کنید
به هر پروژه

60 درصد

تا حدودی یا
فوق العاده سخت .

دو سوم از پاسخ دهندگان در کار وب خود بی نهایت اسکرول را ارائه می دهند و به همان اندازه انجام آن دشوار است. نمونه دیگری از کاربرد زیاد همراه با سختی بالا، که به ما نشان می دهد منطقه ای نیاز به توجه دارد.

در حالی که content-visibility و contain-intrinsic-size می توان برای کاهش هزینه های رندر برای مناطق قابل پیمایش طولانی ترکیب کرد، به نظر نمی رسد که به "بارگذاری بیشتر" اسکرول UX بی نهایت کمک کند.

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

سوال 24

47 درصد

گاهی اوقات از آن استفاده کنید
به هر پروژه

56 درصد

گزارش تا حدودی یا
فوق العاده سخت

تقریباً نیمی از پاسخ‌دهندگان از انیمیشن‌های پیمایش‌شده استفاده می‌کنند و نیمی از پاسخ‌دهندگان این کار را دشوار می‌دانند و بار دیگر استفاده زیاد را با مشکل مرتبط می‌دانند.

با اسکرول داخلی رقابت کنید

سوال 26

32 درصد

همیشه یا
بیشتر اوقات

50 درصد

گاهی اوقات

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

فقط نیمی از پاسخ دهندگان احساس کردند که فقط گاهی اوقات ممکن است با تجربه پیمایش داخلی مطابقت داشته باشند.

ایجاد رضایت کلی تعاملات پیمایشی در وب

سوال 27

نمودار دایره ای که 5 بخش را نشان می دهد: 6.3٪ بسیار ناراضی، 2.7٪ بسیار راضی، 23.4٪ تا حدودی راضی، 28.8٪ نه راضی و نه ناراضی، 38.7٪ تا حدودی ناراضی.

نظر سنجی

نتایج نظرسنجی به چهار دسته تقسیم می‌شوند: سازگاری ، آموزش ، APIها و ویژگی‌ها .

سازگاری

تیم Chrome هدف خود را کاهش تعداد مشکلات سازگاری وب، از جمله سازگاری اسکرول اعلام کرده است.

سه موضوع سازگاری اول که باید روی آنها تمرکز کرد: 1. سازگاری اسکرول افقی. 1. مرورگر متقابل overscroll-behavior . 1. حذف پیشوندها از -webkit-scrollbar و پیروی از استاندارد.

آموزش و پرورش

نتایج نظرسنجی نشان داد که نیاز به آموزش بیشتر در مورد touch-action و ویژگی‌های منطقی است. این مرورگر در خط مقدم طرح‌بندی بین‌المللی قرار دارد و ظاهراً مورد استفاده قرار نگرفته یا اشتباه درک شده است.

مناطقی که باید روی آنها تمرکز کرد: 1. touch-action 1. ویژگی های منطقی

API ها

استفاده از اسکرول اسنپ در حال افزایش است و توسعه دهندگان پاسخ داده اند که می خواهند از ویژگی ها به صورت متقابل با کتابخانه ها و افزونه های محبوب استفاده کنند. کاهش این شکاف بین کتابخانه‌های CSS و افزونه‌ها به رضایت توسعه‌دهنده اسنپ اسکرول و تجربه کاربر کمک می‌کند.

ما کار API را بر روی scroll-snap متمرکز خواهیم کرد: 1. در دسترس بودن و سازگاری API در بین مرورگرها. 1. کار را بر روی APIهای CSS جدید مانند scroll-start شروع کنید. 1. کار را روی رویدادهای جدید JS مانند snapChanged() شروع کنید.

ویژگی ها

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

ویژگی هایی که توسعه دهندگان برای ساختن آن تلاش می کنند عبارتند از: 1. چرخ فلک ها 1. پیمایش مجازی 1. اسکرول بی نهایت

منابع

تصویر کوچک: عکس تیلور ویلکاکس در Unsplash .