تأخير النقر 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() هي event.preventDefault(). ولحسن الحظ، سيتجنب برنامج FastClick إعداد المستمعين في الحالات التي يزيل فيها المتصفح بالفعل التأخير الذي يبلغ 300 ملي ثانية، وبالتالي يمكنك الاستفادة من كليهما!