تأخير النقر 300 ملّي ثانية، تم الإيقاف

جيك أرشيبالد
جيك أرشيبالد

على مدى سنوات عديدة، طبّقت متصفحات الأجهزة الجوّالة تأخيرًا يتراوح بين 300 و350 ملي ثانية بين touchend وclick أثناء انتظارها لمعرفة ما إذا كان هذا النقر مرّتين أم لا، لأنّ النقر مرّتين كان إيماءة لتكبير النص.

منذ إطلاق الإصدار الأول من Chrome لنظام Android، تمت إزالة هذا التأخير إذا تم إيقاف ميزة "التكبير/التصغير بإصبعين" أيضًا. ومع ذلك، يعد التصغير أو التكبير بإصبعين من ميزات إمكانية الوصول المهمة. اعتبارًا من Chrome 32 (في عام 2014)، انتهى هذا التأخير بالنسبة إلى المواقع الإلكترونية المحسَّنة للأجهزة الجوّالة، بدون إزالة التكبير أو التصغير بإصبعين! فعل كل من Firefox وIE/Edge الشيء نفسه بعد ذلك بوقت قصير، وفي آذار (مارس) 2016 تم حل مشكلة مماثلة في iOS 9.3.

الفرق في الأداء كبير!

إن وجود واجهة مستخدم تستجيب على الفور يعني أن المستخدم يمكنه الضغط بسرعة على كل زر بثقة، بدلاً من التوقف وانتظار الرد. اطّلِع على المزيد من المعلومات عن تأثير أوقات ردود الفعل البشرية وأداء الويب في مقدّمة عن تقنية RAIL.

لإزالة تأخير النقر الذي يتراوح بين 300 و350 ملي ثانية، ما عليك سوى الاطّلاع على ما يلي في <head> من صفحتك:

<meta name="viewport" content="width=device-width">

يضبط ذلك عرض إطار العرض على عرض الجهاز نفسه، ويُعتبر بشكل عام من أفضل الممارسات للمواقع الإلكترونية المحسَّنة للأجهزة الجوّالة. باستخدام هذه العلامة، تفترض المتصفّحات أنك جعلت النص قابلاً للقراءة على الأجهزة الجوّالة، وتم تجاهل ميزة النقر مرّتين للتكبير/التصغير لصالح النقرات الأسرع.

إذا لم تتمكّن من إجراء هذا التغيير لسبب ما، يمكنك استخدام touch-action: manipulation لتحقيق التأثير نفسه على مستوى الصفحة أو على عناصر معيّنة:

html {
    touch-action: manipulation;
}

هذا الأسلوب غير متوافق مع متصفّح Safari، لذا يُفضَّل استخدام علامة إطار العرض.

هل يعد فقدان النقر مرّتين للتكبير/التصغير مصدر قلق بشأن إمكانية الوصول؟

لا. يستمر استخدام ميزة التكبير/التصغير بإصبعين في العمل، وتلبي ميزات نظام التشغيل احتياجات المستخدمين الذين يجدون صعوبة في استخدام هذه الإيماءة. وعلى نظام التشغيل Android، تعالج إيماءات التكبير هذه الميزة. حتى أن أدوات كهذه تعمل خارج المتصفح.

ماذا عن المتصفحات الأقدم؟

تستخدم ميزة FastClick by FT Labs أحداث اللمس لتحفيز النقرات بشكل أسرع وإزالة إيماءة النقر مرّتين. يرصد هذا الوضع مقدار الحركة التي تم تحريكها بإصبعك بين touchstart وtouchend للتمييز بين عمليات التمرير والنقرات.

إنّ إضافة مستمِع touchstart إلى كل المحتوى تؤثّر في الأداء، لأنّ التفاعلات المنخفضة المستوى، مثل التمرير، تؤدي إلى تأخير الاتصال بالمستمع لمعرفة ما إذا كان event.preventDefault(). لحسن الحظ، ستتجنب ميزة Fast Click إعداد أدوات معالجة البيانات في الحالات التي يزيل فيها المتصفّح المهلة التي تبلغ 300 ملي ثانية، وبالتالي يمكنك الاستفادة إلى أقصى حدّ من كلتا الميزتَين.