گزارش نظرسنجی پیمایش ۲۰۲۱ به همراه نظرات تیم کروم در مورد چگونگی تأثیر این موضوع بر اولویتها و برنامههای کرومیوم و وب را دریافت کنید.
در ماه آوریل، تیم کروم یک نظرسنجی در مورد اسکرول و عملکرد لمسی بر اساس مشکلات گزارششدهی برتر از گزارش DNA وب MDN در سال ۲۰۱۹ منتشر کرد. گزارش نظرسنجی اسکرول در سال ۲۰۲۱ آماده است و تیم کروم مایل است برخی از نظرات و موارد عملی را که از نتایج نظرسنجی جمعآوری کردهایم، به اشتراک بگذارد. امیدواریم این نتایج به فروشندگان مرورگر و گروههای استاندارد کمک کند تا نحوهی بهبود اسکرول وب را درک کنند.
گزارش نظرسنجی اسکرول ۲۰۲۱ را مشاهده کنید.
نتایج قابل توجه
این نظرسنجی به صورت ناشناس ۸۸۰ پاسخ جمعآوری کرد که ۳۶۶ نفر به هر سوال پاسخ دادند.
در حالی که شروع اسکرول کردن با یک خط کد CSS مانند overflow-x: scroll; انجام میشود، اما سطح APIها و گزینههای اسکرول بزرگ است و از جاوا اسکریپت تا CSS را در بر میگیرد. نتایج زیر به برجسته کردن مشکلاتی که توسعهدهندگان وب با آن مواجه هستند کمک میکند.
رضایت کلی از پیمایش وب
سوال ۲۷
۴۵ ٪
در کل تا حدودی یا بسیار ناراضی هستند
با پیمایش وب .
این سوال عمداً در انتهای نظرسنجی و پس از سوالات مربوط به ۲۶ مورد استفاده و ویژگی اسکرول قرار داده شده است. از پاسخها مشخص است که جامعه وب با اسکرول مشکل دارد. تقریباً نیمی از پاسخدهندگان سطحی از نارضایتی کلی را گزارش میدهند.
ما معتقدیم که نظر کلی در مورد کار با اسکرول نباید تا این حد پایین باشد. این معیار باید تغییر کند؛ این یک نشانه واضح است که باید کارهایی انجام شود.
مشکل در کار با اسکرول
سوال ۲
۴۳ ٪
گزارش شده است که تا حدودی یا
بسیار دشوار
برای کار با اسکرول کردن .
طبق تحقیقات ما، این مشکلات از موارد استفادهی متعدد اسکرول ناشی میشوند. وقتی در مورد اسکرول کردن صحبت میکنیم، ممکن است شامل موارد زیر باشد: - قرار دادن عناصر در نواحی قابل اسکرول - اسکرول بینهایت - انیمیشن مرتبط با اسکرول - چرخوفلکها - پدینگ نمای اسکرول - اسکرول چرخهای - اسکرول مجازی
فقدان ویژگیهای مرورگر، جاوا اسکریپت پیچیده و نیاز به پشتیبانی از حالتهای ورودی از جمله لمس، صفحه کلید و دستههای بازی، همه این موارد را دشوارتر میکند.
اهمیت تعاملات لمسی
سوال ۳
۵۱ ٪
گزارش تعاملات لمسی به عنوان
خیلی یا فوقالعاده مهم
به کارشان.
با توجه به اینکه آمار بازدید کاربران وب از طریق موبایل همچنان در حال افزایش است ، جای تعجب نیست که نیمی از پاسخدهندگان گزارش دادند که لمس برای کارشان در وب بسیار مهم است. این نشان میدهد که ویژگیهای وب مانند اسکرول اسنپ CSS و touch-action نیاز به توجه بیشتری دارند تا وب بتواند تعامل لمسی با کیفیتی را ارائه دهد.
مشکل در استفاده از کلید Tab یا پیمایش با دسته بازی
سوال ۵ الف
۴۴ ٪
گزارش تا حدودی یا بسیار دشوار
برای انجام گیمپد و پیمایش تب .
پیمایش شامل روشهای ناوبری مانند کلیدهای جهتنمای صفحهکلید، کلیدهای تب، فشردن کلید فاصله و دستههای بازی میشود و گنجاندن این موارد هنگام انجام کارهای پیمایش سفارشی میتواند دشوار باشد. تقریباً نیمی از پاسخدهندگان گزارش میدهند که گنجاندن این ورودیها تا حدودی یا بسیار دشوار است.
یادگیری touch-action
سوال ۹
۵۰ ٪
گزارش یادگیری در مورد
`عمل لمسی: دستکاری`
از نظرسنجی.
برخی از سوالات نظرسنجی در مورد استفاده از APIهای خاص با پاسخهای احتمالی بله، خیر یا «امروز یاد گرفتم» پرسیده شده بود. یکی از نکات قابل توجه بازخورد، تعداد افرادی بود که از طریق نظرسنجی در مورد touch-action اطلاعات کسب کردند، زیرا این یک ویژگی حیاتی هنگام ساخت حرکات لمسی سفارشی است که نیاز به تعامل در داخل اسکرول دارند.
پیمایش چرخهای
سوال ۲۷
۵۸ ٪
گاهی، اغلب یا در مورد هر پروژه گزارش دهید
با استفاده از پیمایش چرخهای .
بعد از ۶۰ ثانیه دوباره از ۰ شروع میشود.
این اعداد برای یک ویژگی پیمایش که توسط پلتفرم وب پشتیبانی کمی ارائه میشود یا اصلاً پشتیبانی نمیشود، بسیار بالا هستند. این ویژگی اغلب به دلیل این موضوع، با حجم بالایی از بدهی فنی مواجه میشود، که شامل تکرار یا تزریق جاوا اسکریپت برای اعمال این اثر میشود. این ویژگی برای نمایش محصولات به صورت چرخشی و همچنین هنگام انتخاب زمان بر حسب ثانیه یا دقیقه برای ارائه پیمایش چرخهای، محبوب است.
آیا قسمتهای قابل اسکرول مهم هستند؟
سوال ۲
۵۵ ٪
خیلی یا
بسیار مهم
۱۶ ٪
اصلا گزارش نده
یا کمی مهم
پاسخدهندگان به شدت به اهمیت فضاهای قابل اسکرول اعتقاد داشتند، که نشان دیگری از دشواریهای ارائه اسکرول با کیفیت بالا بود.
چرخ و فلکها
سوال ۲۰
۸۷ ٪
از چرخ و فلک استفاده کرده اند .
۲۴ ٪
گزارش دهید که آنها
مدیریت آسان .
تقریباً هر پاسخدهندهای در کار وب خود از چرخ و فلک استفاده میکند، در حالی که تنها ۲۵٪ مدیریت آنها را آسان میدانند. چرخ و فلکهای آماده در طول تحقیقات ما محبوب بودند، اما این آمار ما را شگفتزده کرد، زیرا به نظر نمیرسد خیلی حل شده باشد.
اسکرول بینهایت
سوال ۲۲
۶۵ ٪
گاهی اوقات از آن استفاده کنید
به هر پروژه
۶۰ ٪
تا حدودی یا
به شدت دشوار .
دو سوم از پاسخدهندگان در کار وب خود از اسکرول بینهایت استفاده میکنند و به همین میزان گزارش میدهند که انجام این کار دشوار است. نمونه دیگری از استفاده زیاد همراه با دشواری بالا، که به ما نشان میدهد که این حوزه نیاز به توجه دارد.
اگرچه میتوان content-visibility و contain-intrinsic-size برای کاهش هزینههای رندر برای قسمتهای طولانی قابل اسکرول ترکیب کرد، اما به نظر نمیرسد که به تجربه کاربری اسکرول بینهایت با قابلیت «بارگذاری بیشتر» کمکی کند.
انیمیشنهای اسکرول-لینک یا اسکرول-تریگر
سوال ۲۴
۴۷ ٪
گاهی اوقات از آن استفاده کنید
به هر پروژه
۵۶ ٪
تا حدودی گزارش دهید یا
بسیار دشوار
تقریباً نیمی از پاسخدهندگان از انیمیشنهای هماهنگشده با اسکرول استفاده میکنند و نیمی از پاسخدهندگان آن را دشوار میدانند، که بار دیگر استفاده زیاد را با دشواری مرتبط میدانند.
با پیمایش داخلی رقابت کنید
سوال ۲۶
۳۲ ٪
همیشه یا
بیشتر اوقات
۵۰ ٪
گاهی اوقات
تعاملات لمسی و اسکرول داخلی برنامههای تلفن و تبلت اغلب به عنوان مکانی واضح برای وب معرفی میشوند که میتواند به آن برسد. این ویژگیها شامل انیمیشنهای اسکرول-لینک، رابطهای برنامهنویسی، ادغام صدا، راهنماییهای اسکرول و APIهای کشیدن برای تازهسازی (pull-to-refresh) است.
تنها نیمی از پاسخدهندگان احساس میکردند که فقط گاهی اوقات میتوان تجربهای مشابه پیمایش داخلی را ارائه داد.
رضایت کلی از تعاملات اسکرولی در وب
سوال ۲۷
نکات کلیدی نظرسنجی
نتایج نظرسنجی به چهار دسته تقسیم میشوند: سازگاری ، آموزش ، APIها و ویژگیها .
سازگاری
تیم کروم اعلام کرده است که هدفش کاهش تعداد مشکلات سازگاری با وب، از جمله سازگاری با اسکرول است.
سه مسئله سازگاری اول که باید روی آنها تمرکز کنیم: ۱. سازگاری با اسکرول افقی. ۱. overscroll-behavior در مرورگرهای مختلف. ۱. حذف پیشوندها از -webkit-scrollbar و پیروی از استاندارد.
آموزش
نتایج این نظرسنجی نشان داد که باید آموزش بیشتری در مورد touch-action و ویژگیهای منطقی وجود داشته باشد. مرورگر در خط مقدم طرحبندی بینالمللی قرار دارد و ظاهراً از آن به اندازه کافی استفاده نمیشود یا به درستی درک نمیشود.
حوزههایی که باید روی آنها تمرکز کرد: ۱. touch-action ۱. ویژگیهای منطقی
رابطهای برنامهنویسی کاربردی (API)
استفاده از Scroll Snapping رو به افزایش است و توسعهدهندگان در پاسخ به این موضوع اعلام کردهاند که میخواهند از ویژگیهای آن به صورت تعاملی با کتابخانهها و افزونههای محبوب استفاده کنند. کاهش این شکاف بین CSS و کتابخانههای افزونه به رضایت توسعهدهنده و تجربه کاربری Scroll Snap کمک خواهد کرد.
ما کار API را روی scroll-snap متمرکز خواهیم کرد: ۱. در دسترس بودن API و سازگاری آن در مرورگرها. ۱. شروع کار روی APIهای جدید CSS مانند scroll-start . ۱. شروع کار روی رویدادهای جدید JS مانند snapChanged() .
ویژگیها
نتایج نظرسنجی نشان داد که کاربران با برخی از انواع خاص اجزای مرتبط با اسکرول در وب مشکل دارند، زیرا این پلتفرم، مقدمات لازم برای ساخت آنها را بدون افزونهها یا تلاش زیاد فراهم نمیکند. این حوزهای است که امیدواریم عمیقتر بررسی کنیم.
ویژگیهایی که توسعهدهندگان برای ساخت آنها تلاش میکنند عبارتند از: ۱. چرخ و فلک ۱. اسکرول مجازی ۱. اسکرول بینهایت
منابع
- گزارش پیمایش پیمایش
- اطلاعیه نظرسنجی
- گزارشهای DNA موزیلا
- Compat2021: حذف پنج نقطه ضعف اصلی سازگاری در وب
تصویر کوچک: عکس از تیلور ویلکاکس در Unsplash .