تحسين سرعة الموقع في السعودية: Core Web Vitals خطوة بخطوة
سرعة الموقع لم تعد “ميزة إضافية”؛ هي عامل مؤثر في تجربة المستخدم، وفي ثقة العميل، وفي النتائج التسويقية داخل السعودية (طلبات/مكالمات/واتساب). ومع تحديثات Google أصبح التركيز عمليًا على مؤشرات Core Web Vitals مثل LCP وINP وCLS. المشكلة أن كثيرًا من المواقع تبدو “سريعة” على شبكة قوية، لكنها بطيئة جدًا على جوال متوسط واتصال 4G، وهذا يقتل التحويل ويرفع معدل الارتداد. في هذا الدليل ستتعلم كيف تقيس السرعة بشكل صحيح، وكيف تحسّنها بخطوات مرتبة، وما الذي يعطي أكبر تأثير بسرعة.
ما هي Core Web Vitals باختصار؟
- LCP (Largest Contentful Paint): زمن ظهور أكبر عنصر محتوى (غالبًا صورة/عنوان) — الهدف عادة < 2.5s.
- INP (Interaction to Next Paint): سرعة استجابة الصفحة للتفاعل — الهدف عادة < 200ms.
- CLS (Cumulative Layout Shift): اهتزاز العناصر أثناء التحميل — الهدف عادة < 0.1.
هذه المؤشرات ليست أرقامًا للعرض فقط؛ هي ترجمة لمشكلة حقيقية: المستخدم ينتظر، أو يضغط ولا يحدث شيء، أو يتحرك الزر فيضغط بالخطأ.
1) قبل التحسين: قِس بشكل صحيح (لا تعتمد على إحساسك)
أول قاعدة: لا تبدأ بتحسينات عشوائية. قس أولًا ثم اختر أعلى أسباب التأخير:
- PageSpeed Insights: يعطيك بيانات مختلطة (Lab + Field) واقتراحات واضحة.
- Lighthouse: مناسب لقياس سريع أثناء التطوير.
- Chrome DevTools Performance: لمعرفة ما الذي يستهلك وقت المعالجة.
- Search Console (Core Web Vitals report): لتعرف صفحات “سيئة/تحتاج تحسين/جيدة” على مستوى الموقع.
2) حدّد الصفحات ذات الأولوية (للسعودية)
ابدأ بالصفحات التي تؤثر على الطلبات مباشرة:
- الصفحة الرئيسية.
- صفحات الخدمات (Service Pages).
- صفحات الهبوط للحملات (Landing Pages).
- صفحات المقالات التي تجلب زيارات عالية.
تحسين 5 صفحات أهم من تحسين 50 صفحة لا تجلب تحويل.
3) أسرع مكسب: الصور (Images) — غالبًا هي سبب LCP
- حوّل الصور إلى WebP/AVIF عندما ممكن.
- استخدم أبعاد ثابتة لمنع CLS (حدد width/height).
- Lazy Load للصور خارج الجزء المرئي (below the fold).
- صورة الهيرو (Hero) لا تعمل لها lazy-load غالبًا؛ اجعلها محسنة ومضغوطة.
4) الكاش وتهيئة السيرفر (Server + Cache)
حتى لو الكود ممتاز، سيرفر بطيء أو إعدادات خاطئة ستقتل الأداء:
- تفعيل كاش للصفحات/الـviews حسب التقنية المستخدمة.
- استخدام HTTP caching headers للملفات الثابتة (CSS/JS/Images).
- ضغط Gzip/Brotli.
- تقليل وقت الاستجابة (TTFB) عبر تحسين الاستعلامات وقاعدة البيانات.
5) تقليل JavaScript (سبب شائع لضعف INP)
INP يتأثر عندما تكون الصفحة مشغولة بتنفيذ JS كبير. الحلول العملية:
- احذف سكربتات غير ضرورية (خاصة أدوات تتبع كثيرة).
- حمّل السكربتات بشكل مؤجل (defer/async) حسب الحاجة.
- قسّم الباندل (code splitting) إن كانت واجهة SPA كبيرة.
- تجنب مكتبات ثقيلة لو يمكن استبدالها بحل أبسط.
6) CSS: اجعل الجزء المرئي يظهر بسرعة
- قلل CSS غير المستخدم.
- اجعل CSS الأساسي (Critical CSS) جاهز بسرعة.
- تجنب تحميل خطوط كثيرة أو أوزان متعددة بدون حاجة.
7) منع CLS: استقرار التخطيط أهم من “حركات” التصميم
من أكبر أسباب CLS: صور بدون أبعاد، إعلانات/بنرات تظهر فجأة، وخطوط تتغير بعد التحميل. لتقليل CLS:
- حدد أبعاد الصور والـiframes.
- احجز مساحة للعناصر التي ستظهر لاحقًا (banner/popup) أو اجعلها overlay.
- استخدم font-display: swap بحذر مع ضبط fallbacks.
8) تحسين الموبايل (السعودية = جوال أولاً)
حتى لو السرعة ممتازة على الديسكتوب، الموبايل هو الحكم الحقيقي:
- حجم الصفحة (Total bytes) يجب أن يكون معقولًا.
- أزرار CTA واضحة وسهلة الضغط.
- تجنب popups الثقيلة التي تغطي الشاشة.
- اختبر على شبكة 4G/3G لمحاكاة الواقع.
9) أدوات قياس ومراقبة مستمرة
بعد التحسين، تابع النتائج أسبوعيًا:
- Search Console → Core Web Vitals
- PageSpeed Insights للصفحات الأساسية
- مراقبة أخطاء JavaScript والـNetwork في DevTools
10) خطة تنفيذ سريعة (7 أيام)
- يوم 1: قياس + تحديد أسوأ 5 صفحات.
- يوم 2: تحسين الصور (WebP + أبعاد + ضغط).
- يوم 3: كاش + ضغط + تحسين TTFB الأساسي.
- يوم 4: تقليل JS وتفعيل defer/async.
- يوم 5: تقليل CSS وتحسين الخطوط.
- يوم 6: منع CLS + اختبار الموبايل.
- يوم 7: إعادة القياس وتوثيق النتائج.
تفصيل عملي لتحسين TTFB (وقت استجابة السيرفر)
TTFB سيئ يعني أن المتصفح ينتظر من السيرفر قبل أن يبدأ العرض. هذه أسباب شائعة وحلولها:
- استعلامات قاعدة البيانات: راجع N+1 وفعّل eager loading، وضع Index على الأعمدة المستخدمة في البحث.
- كاش التطبيق: فعّل caching للنتائج المتكررة (قوائم خدمات/مقالات) بدل إعادة الحساب في كل طلب.
- كاش الصفحات/الـviews: في صفحات محتوى ثابتة (مثل مقالات) يمكنك الاستفادة من كاش مناسب حسب البنية.
- الاستضافة: في بعض الحالات المشكلة ليست كود بل موارد السيرفر (CPU/RAM/IO) أو إعدادات PHP-FPM.
Third‑Party Scripts: السبب رقم 1 لبطء المواقع التسويقية
أدوات التتبع والشات والبيكسلات قد تكون مفيدة لكنها قد تقتل INP وLCP. راجع هذه النقاط:
- لا تضع 5 أدوات تتبع إن كانت أداة واحدة تكفي.
- حمّل سكربتات الطرف الثالث بعد تفاعل المستخدم أو بعد ظهور المحتوى (defer + trigger).
- احذف widgets غير مستخدمة (chat قديم/heatmap غير مُفعل/إعلانات).
الخطوط (Fonts): تحسين صغير يعطي فرق كبير
- قلل عدد عائلات الخطوط والأوزان.
- استخدم صيغة woff2.
- فعّل preload للخط الأساسي فقط.
- اضبط fallback مناسب لتقليل CLS الناتج عن تبدل الخط.
CDN ومتى تحتاجه داخل السعودية؟
إذا زوارك موزعين على مناطق مختلفة داخل المملكة أو لديك ملفات ثابتة كثيرة (صور/JS/CSS)، CDN يساعد في تقليل زمن التحميل. لكن لا يعتبر بديلًا عن تحسين الصور والكود. استخدمه خصوصًا للصور والملفات الثابتة مع كاش طويل.
Checklist سريعة قبل إطلاق حملة إعلانات
| العنصر | ما المطلوب؟ | الأثر |
| LCP | صورة هيرو محسنة + كاش + TTFB جيد | تحميل أسرع |
| INP | تقليل JS + تأجيل سكربتات الطرف الثالث | استجابة أفضل |
| CLS | أبعاد ثابتة للصور/iframes | ثبات الصفحة |
| موبايل | CTA واضح + تجنب popups الثقيلة | تحويل أعلى |
| القياس | Events لنقرات واتساب/النموذج | تحسين بالأرقام |
أخطاء شائعة تجعل التحسين بلا نتيجة
- الاعتماد على اختبار واحد فقط (Lighthouse) بدون متابعة Search Console وقياس صفحات متعددة.
- تحسين صفحة مقالة واحدة وترك صفحات الخدمة/الهبوط البطيئة.
- ضغط الصور لكن ترك فيديوهات كبيرة أو سكربتات طرف ثالث غير مؤجلة.
- تغيير أشياء كثيرة دفعة واحدة بدون مقارنة قبل/بعد.
الخلاصة + CTA
تحسين Core Web Vitals يعني تجربة أفضل ونقرات أكثر وتحويل أعلى، خصوصًا على الموبايل داخل السعودية. إذا تريد تدقيق سرعة لموقعك (LCP/INP/CLS) مع خطة تحسين عملية وترتيب أولويات، تواصل على واتساب: +20884690567.