سرعة الموقع ومؤشرات أداء الويب الأساسية: دليل عملي لتحسين السيو والتحويل

مؤشرات أداء الويب الأساسية (Core Web Vitals) هي ثلاثة مقاييس من Google تقيس تجربة المستخدمين الحقيقيين على الصفحة: مؤشر LCP لسرعة ظهور المحتوى الرئيسي، ومؤشر INP لسرعة الاستجابة للتفاعل، ومؤشر CLS لثبات التصميم أثناء التحميل. تجتاز الصفحة التقييم حين تحقق 75% على الأقل من الزيارات قيمة LCP لا تتجاوز 2.5 ثانية، وINP لا يتجاوز 200 ملي ثانية، وCLS لا يتجاوز 0.1. وهي جزء من إشارات تجربة الصفحة لدى Google، والأهم أن الصفحات السريعة المستقرة تجعل الزائر أكثر ميلاً للبقاء والثقة والتواصل معك.

ماذا تقيس مؤشرات LCP وINP وCLS؟

القيم الواقعة بين "جيد" و"ضعيف" تُصنف على أنها "تحتاج إلى تحسين".

أكبر عنصر مرئي (LCP)

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

الاستجابة للتفاعل (INP)

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

ثبات التصميم (CLS)

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

لماذا تهم سرعة الموقع للسيو وللأعمال؟

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

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

كيف تقيس مؤشرات أداء الويب الأساسية؟

بيانات المستخدمين الحقيقيين مقابل بيانات المختبر

• البيانات الميدانية (Field Data): تأتي من مستخدمي Chrome الحقيقيين الذين يزورون موقعك، وتُجمع في تقرير تجربة مستخدمي Chrome (CrUX)، وهي ما تعتمد عليه Google في التقييم.
• بيانات المختبر (Lab Data): اختبار محاكاة على جهاز وشبكة محددين، مثل تشغيل Lighthouse. ممتازة لتشخيص المشكلات، لكنها قد تختلف عما يعيشه المستخدمون فعلاً.

الأدوات المستخدمة

1. PageSpeed Insights: أدخل رابط الصفحة لترى البيانات الميدانية إن كانت زيارات موقعك كافية، وتقرير Lighthouse المخبري مع توصيات محددة.
2. Google Search Console: يجمع تقرير مؤشرات أداء الويب الأساسية صفحاتك في فئات: جيدة، وتحتاج إلى تحسين، وضعيفة، للموبايل وسطح المكتب.
3. أدوات المطورين في Chrome وLighthouse: لتحليل المشكلات وإصلاحها محلياً.
4. مراقبة المستخدمين الحقيقيين: إضافة سكربت صغير مثل مكتبة web-vitals مفتوحة المصدر من Google إلى أداة التحليلات تمنحك بيانات ميدانية مستمرة لكل صفحة.

ابدأ دائماً بنتائج الموبايل، فـGoogle تعتمد أساساً على نسخة الموبايل من موقعك في الفهرسة، ومعظم الزوار في الخليج يتصفحون من هواتفهم.

كيف تحسّن مؤشر LCP؟

• حسّن الصور: استخدم صيغاً حديثة مثل WebP أو AVIF، واضغطها، وقدّم مقاسات متجاوبة كي لا تحمّل الهواتف صور سطح المكتب.
• امنح الصورة الرئيسية الأولوية: لا تؤجل تحميل الصورة الرئيسية أعلى الصفحة أبداً، بل اجعلها ذات أولوية عالية وحمّلها مسبقاً عند الحاجة، واستخدم التحميل الكسول (Lazy Loading) للصور الواقعة أسفل الصفحة فقط.
• سرّع الخادم: استخدم التخزين المؤقت (Caching) وشبكة توصيل المحتوى (CDN) بنقاط قريبة من مستخدميك في الخليج، واستضافة فعالة.
• استخدم العرض من جهة الخادم (SSR) أو التوليد الثابت: أطر مثل Nuxt وNext.js ترسل صفحات HTML جاهزة فيظهر المحتوى دون انتظار JavaScript.
• قلّل الموارد المعطلة للعرض: ضمّن ملفات CSS الحرجة داخل الصفحة وأجّل السكربتات غير الضرورية.

كيف تحسّن مؤشر INP؟

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

كيف تحسّن مؤشر CLS؟

• حدد العرض والارتفاع أو نسبة الأبعاد لكل صورة وفيديو وعنصر مضمّن ليُحجز مكانه مسبقاً.
• احجز مساحة للافتات وتنبيهات ملفات تعريف الارتباط والمحتوى الديناميكي بدلاً من دفع المحتوى للأسفل.
• تحكّم في تحميل الخطوط: الخطوط التي تتبدل متأخرة قد تعيد ترتيب النص.

ماذا عن الخطوط العربية؟

الخطوط العربية غالباً أكبر حجماً بكثير من اللاتينية، لأنها تضم عدداً كبيراً من الحروف وأشكالها المتصلة. وفي المواقع ثنائية اللغة قد تضر بمؤشري LCP وCLS معاً. خطوات عملية:

• استخدم صيغة WOFF2، واقتطع من الخط الحروف والأوزان التي تستخدمها فعلاً فقط.
• قلل عدد العائلات والأوزان، فوزنان أو ثلاثة تكفي غالباً.
• اعتمد استراتيجية مناسبة لخاصية font-display، وحمّل مسبقاً ملف الخط الرئيسي.
• اختر خطوط نظام بديلة بمقاييس قريبة لتقليل قفز النص أثناء التبديل.

السرعة ليست مشروعاً لمرة واحدة. كل إضافة جديدة أو سكربت تتبع أو لافتة ثقيلة ينتقص من الأداء، لذا حدد ميزانية لحجم الصفحة وراجع المؤشرات بعد كل إصدار.

الخلاصة

لاجتياز مؤشرات أداء الويب الأساسية، استهدف LCP لا يتجاوز 2.5 ثانية، وINP لا يتجاوز 200 ملي ثانية، وCLS لا يتجاوز 0.1 على الموبايل، مقيسة ببيانات المستخدمين الحقيقيين في PageSpeed Insights وSearch Console. ومعظم المكاسب تأتي من تحسين الصور، وتقليل JavaScript، والتحميل الذكي للخطوط العربية، والتخزين المؤقت، وشبكات توصيل المحتوى، والعرض من جهة الخادم. ونطبق هذه الممارسات في كل مشروع ضمن خدمة تطوير تطبيقات الويب لدينا.

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