تحسين أداء مواقع الويب

مقدمة في تحسين أداء مواقع الويب Website performance optimization

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

ولتحسين أداء الموقع للشركات ابتكرت Google أدوات مثل PageSpeed Insights لتوفير بيانات قياسية وتحديد النقاط التي تقيد الأداء، وأشارت شركة Google في عام2021) ) إلى أن أوقات تحميل الصفحة الأطول لها تأثير شديد على معدلات الارتداد (ويقيس نسبة الزائرين إلى الصفحة الذين يبقون على الصفحة أو الموقع والذي يغادرون)، على سبيل المثال وفقا لشركة جوجل:

– إذا زاد وقت تحميل الصفحة من ثانية إلى 3 ثواني يزداد معدل الارتداد بنسبة 32 %. 

– إذا زاد وقت تحميل الصفحة من ثانية إلى 6 ثواني يزداد معدل الارتداد بنسبة 106 في المائة.

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

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

على سبيل المثال: إذا زار 100 شخص صفحة ويب، وغادر 50 شخصًا الصفحة دون اتخاذ أي إجراء آخر، فإن معدل الارتداد سيكون 50٪.

لا يوجد رقم محدد يعتبر معدل ارتداد جيدًا بشكل عام، لأن ذلك يعتمد على نوع الموقع الإلكتروني وأهدافه.

وتقدم شركة  Googleشرح لعناصر الويب الأساسية Core Web Vitals الجديدة لأصحاب المواقع لمراجعة أداء صفحاتهم في Search Console تبع Google، وتشير عناصر الويب الأساسية      Core Web Vitals الى معايير محددة من Google أُضيفت إلى إشارات البحث السابقة الخاصة بتجربة الصفحة، بما في ذلك سهولة الاستخدام على الأجهزة المحمولة، والتصفح الآمن، وأمان HTTPS وإرشادات النوافذ المنبثقة المزعجة التي قد تؤثر سلبًا على الترتيب إذا كانت الجودة منخفضة، وهناك العديد من عناصر الويب لتقييم الصفحات أو مواقع الويب.

عناصر الويب الأساسية لتقييم الصفحات أو المواقع

1- عرض أكبر قدر من المحتوى Largest Contentful Paint (LCP) الذي يشير إلى أداء تحميل الصفحة، الوقت الذي يستغرقه تحميل أكبر جزء قابل للعرض من محتوى الصفحة.

ويمكن تحسين  LCPمن خلال تحسين سرعة خادم الويب، وضغط الصور والنصوص لتقليل حجم الملفات، وتجنب استخدام JavaScript ثقيل.

2- تأخير الادخال الأول First Input Delay (FID) ويشير الى وقت استجابة صفحة الويب الخاصة بك بناءً على وقت استجابة المتصفح لأول مرة للتفاعل.

ولتقليل من (FID) قلل من كمية JavaScript التي يتم تحميلها وتنفيذها على الصفحة، حيث أن  JavaScript  الثقيل يمكن أن يؤخر استجابة المتصفح للتفاعلات.

وتعرف جافاسكريبت (JavaScript) بأنها لغة برمجة كمبيوتر ديناميكية تُستخدم لجعل صفحات الويب تفاعلية، لإنشاء تأثيرات ديناميكية على صفحات الويب، مثل:

التفاعلات مع المستخدم كالنقر على الأزرار، واستخدام القوائم المنسدلة، وإدخال البيانات في النماذج.

ووضع الرسوم المتحركة والتأثيرات المرئية مثل تحريك العناصر على الشاشة، وتغيير ألوانها، وإنشاء رسومات متحركة جذابة.

3- تكرار تغير التخطيط (Cumulative Layout Shift (CLS الذي يشير إلى تكرار التغييرات غير المتوقعة في تخطيط محتوى الصفحة أثناء تحميلها.

ويمكن التقليل من CLS من خلال استخدام أبعاد ثابته للعناصر مثل الصور ومقاطع الفيديو بشكل ثابت قبل تحميلها، والتأكد من اختبار صفحتك على أجهزة مختلفة ومعايير شاشة مختلفة.

يُعد الابتكار في البروتوكولات المستخدمة لنقل البيانات عامل مساعد في تحسين أداء الموقع، و HTTP / 2 هو مراجعة رئيسية لبروتوكول شبكة HTTP الذي يستخدمه الويب العالمي لنقل البيانات بين متصفحات الويب والخوادم ويحتمل أن يكون أسرع، وتستخدم غالبية المواقع الآن بروتوكول HTTPS الآمن (يتم الإشارة إليه برمز القفل في شريط المتصفح)، وتشجع Google المواقع على استخدام https لأنه أكثر أمانًا، وتفضل مواقع https الآمنة عند تصنيفها.

أن إعادة تصميم المواقع لتحسين الأداء وسهولة الاستخدام يمكن أن يكون لها فوائد كبيرة في رضا العملاء.

فوائد تحسين محتوى الصور في مواقع

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

زيادة سرعة صفحات الويب

الصور غير المحسنة تجعل صفحات الويب الخاصة بك ثقيلة وبطيئة التحميل، ومن خلال تحسين الصور التي تكون كبيرة الحجم دون الإضرار بالجودة، يمكنك تسريع الموقع، وبالتالي سوف يؤدي إلى سرعة تحميل صفحات الموقع.

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

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

تحسين محركات البحث (SEO) بشكل أفضل

تفضل محركات البحث مثل Google المواقع التي يتم تحميلها بسرعة وتعاقب المواقع البطيئة، إذا تم تحسين الصور وكان الموقع سريعًا، فمن المرجح أن يحصل على ترتيب جيد في صفحات نتائج محرك البحث (SERPs)، وهناك عوامل أخرى تسهم في تحسين نتائج محركات البحث تم ذكرها في مقالات سابقة.

طرق لتحسين الصور على مواقع الويب:

هناك العديد من الطرق التي يمكننا القيام بها لتحسين الصور على الموقع، ومنها:

– ضغط صور الموقع في  الموقع

من خلال ضغط الصور ستقلل حجم ملفاتها، وسيتم تحميل ملف الصورة المضغوط بشكل أسرع على صفحة الويب الخاصة بك على الموقع مما يحسن سرعتها.

ويمن ضغط الصور من خلال استخدام إضافة للموقع.

ويمكن ضغط الصور الكبيرة يدويًا قبل تحميلها الى الموقع باستخدام برنامج تحرير الصور أو أداة مجانية مثل TinyPNG ، وهناك العديد من البرامج التي تعمل مع تنسيقات الصور المختلفة.

– تغيير حجم الصور

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

وبشكل افتراضي يستخدم WordPress مثلا أربعة أحجام مختلفة لنفس الصورة:

الصورة المصغرة (150 × 150 بكسل)

متوسط ​​(حتى 300 × 300 بكسل)

كبير (حتى 1024 × 1024 بكسل)

الحجم الكامل (حجم الصورة الأصلية)

كما يمكن تقديم محتوى الصور عبر شبكة CDN شبكة توصيل المحتوى وهي عبارة عن نظام عالمي من الخوادم التي تعمل على تسريع توصيل محتوى موقع الويب الخاص بك، بما في ذلك الصور ومقاطع الفيديو والكتب والتقارير. فاستخدام شبكة توصيل المحتوى على الموقع سيضمن حصول الزوار على البيانات من خادم قريب منهم.

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