تُستخدم طريقة CLS لقياس مدى تغير أو تحرك المحتوى الموجود على صفحة الويب طوال دورة حياة عرض الصفحة بأكملها، أو بعبارة أخرى، لقياس مدى استقرار المظهر المرئي للموقع الإلكتروني.
ربما مررتَ في حياتك بتجارب عديدة شعرتَ فيها بالإحباط الشديد عندما تنقر بالخطأ على إعلان في قائمة، فينقلك إلى موقع ويب خارجي، أو عندما يتغير ترتيب محتوى صفحة الويب أثناء تصفحك. بالطبع، تُعدّ هذه التغييرات في تصميم الصفحة مصدر إزعاج للمستخدمين، ولكنها قد تُسبب مشاكل أكبر لناشري المواقع، كارتفاع معدلات الارتداد وانتهاك سياسات الإعلانات نتيجة النقرات العرضية.
بالإضافة إلى ذلك، ولأن جوجل تعتبر CLS أحد " مؤشرات الأداء الأساسية الثلاثة للويب "، فإن انخفاض درجة CLS قد يؤثر سلبًا على النتيجة الإجمالية لمؤشرات الأداء الأساسية للويب، مما يؤدي إلى رسوب المستخدم. وكجزء من التغييرات الأخيرة التي طرأت على خوارزمية بحث جوجل، تُصنّف المواقع التي تحصل على درجة نجاح في تقييم مؤشرات الأداء الأساسية للويب بشكل أفضل في نتائج البحث.
هناك علاقة مباشرة بين تحسين درجة CLS، وتحسين تجربة المستخدم بشكل عام، وتحسين تصنيفات جوجل المحتملة، وزيادة حركة المرور العضوية من جوجل.
كيف يتم قياس التحول التراكمي للتخطيط؟
عندما يُغيّر عنصر مرئي في نافذة العرض موضعه الابتدائي لأي سبب، يُسجّل هذا التغيير. لذا، يُعتبر العنصر غير مستقر إذا غيّر موضعه الابتدائي. من المهم ملاحظة أنه لا يُمكن إحداث تغيير في التخطيط إلا إذا انتقل عنصر مرئي إلى مكان مختلف على الصفحة نتيجةً لحدث ما فيها، وليس إذا كبر أو صغر حجم عنصر جديد أو عنصر موجود.
يتكون مؤشر CLS من مقياسين محددين مصممين لتتبع تغيرات التخطيط: نسبة التأثير ونسبة المسافة. يُستخدم هذان المقياسان لتحديد مؤشر CLS. تقيس نسبة التأثير مدى تأثير العناصر غير المستقرة على مساحة العرض بين إطارين، وذلك بدمج العنصر الأصلي والتغير الحاصل كنسبة يمكن مقارنتها بإجمالي المساحة المرئية لمساحة العرض بين الإطارين. في حالة عنصر غير مستقر يتحرك أفقيًا أو رأسيًا، تمثل نسبة المسافة المسافة التي قطعها هذا العنصر في مساحة العرض (أفقيًا أو رأسيًا).
كيف يمكنك تحسين درجتك في اختبار CLS؟
لتقليل العناصر غير المستقرة/سلوك التحول، إليك بعض التوصيات:
- قد تحصل صفحات الويب المختلفة على درجات CLS متباينة تبعًا لبنية موقعك. على سبيل المثال، قد تكون درجات CLS لصفحات المقالات أعلى من تلك الخاصة بالصفحة الرئيسية. لذا، تتمثل الخطوة الأولى في قياس درجات CLS لجميع قوالب الصفحات الرئيسية في موقعك.
- يجب أن تحتوي الصور ومقاطع الفيديو دائمًا على سمات العرض والارتفاع. أنشئ صورًا متجاوبة بنسب أبعاد محددة.
- بدلاً من ذلك، يمكن استخدام مربعات نسبة العرض إلى الارتفاع في CSS لحجز المساحة اللازمة للعناصر. أثناء عملية التحميل، يضمن ذلك أن يخصص المتصفح المساحة المناسبة في المستند.
- يمكن أن يساهم عرض الإعلانات بشكل كبير في تغيير تصميم الصفحة إذا لم يتم تحسين مواضع الإعلانات بشكل مناسب.
- لا تقم بإضافة محتوى ديناميكي فوق المحتوى المحمل مسبقًا، إلا استجابةً لتفاعلات المستخدم، وفي هذه الحالة سيتغير التخطيط.
حسّن أداء موقعك على ووردبريس من خلال خدمات تحسين المواقع التي !