التحول التراكمي في التخطيط (CLS)

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

إن السلوك الذي يرصده هذا النظام مألوف لأي شخص حاول النقر على رابط ليجد إعلانًا يظهر فوقه ويدفع الصفحة للأسفل، أو بدأ بقراءة فقرة فقفزت فجأة بسبب تغيير خط الويب. وبعيدًا عن الإزعاج، فإن النتيجة العملية هي النقرات الخاطئة: فتحرك المحتوى بين لحظة اتخاذ المستخدم قرار النقر ولحظة قيامه بذلك يؤدي إلى إجراء خاطئ، وهو ما قد يعني في واجهات التجارة الإلكترونية أو الخدمات المصرفية عملية شراء خاطئة، أو حذفًا خاطئًا، أو تنقلًا غير مقصود.

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

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

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

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

لأن الأسباب عادةً ما تكمن في القوالب، وعمليات دمج الإعلانات، والإضافات الخارجية بدلاً من وجودها في مكون واحد، فإن المعالجة تتطلب عادةً التنسيق بين الفرق المسؤولة عن كل منها. وهذا أمرٌ معتادٌ عملياً. أداء الويب يُعد هذا العمل أحد المجالات التي يكون فيها الارتباط بالنتائج التجارية مباشرًا للغاية، حيث أن عدم استقرار التصميم على صفحة المنتج أو صفحة الدفع يؤدي إلى نقرات خاطئة وتخلي عن العملية، وهو ما... تدقيق UX ستظهر على شكل إخفاقات في سهولة الاستخدام دون تحديد السبب التقني الكامن بالضرورة.