من يؤثر على سرعة تحميل صفحات الموقع واستهلاك البيانات؟

من يؤثر على سرعة تحميل صفحات الموقع؟

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

إذن كيف يمكن تحسين وتعديل الصور؟

1. التحكم في حجم الصور

(1) للصور المحلية

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

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

    • للصور التي لا تتطلب تنسيقًا شفافًا، يُنصح باستخدام تنسيق JPEG بدلاً من تنسيق PNG.

    • سواء كان ذلك على أجهزة الكمبيوتر أو الأجهزة المحمولة، استخدم تنسيق صور WebP. في ظل ظروف الضغط مع فقدان البيانات، يصعب على العين المجردة ملاحظة التغييرات قبل وبعد الضغط، ولكن الحجم يتقلص بشكل ملحوظ. (ملاحظة: WebP هو تنسيق صور جديد أطلقته Google في عام 2010، وهو متفوق في الضغط مقارنة بتنسيق JPEG الحالي. في ظل ظروف الجودة نفسها، تكون صور تنسيق WebP أصغر بنسبة 40% من صور تنسيق JPEG. استخدام تنسيق WebP لصور الموقع يمكن أن يزيد بشكل كبير من سرعة تحميل الموقع).

(2) كيفية تمكين تنسيق صور WebP على الموقع:

       1) خطوات تمكين WebP بنقرة واحدة: http://help.eyingbao.com/products/webp.html

       2) بعد تمكين تنسيق صور WebP، كيف يتم التعامل مع الصور غير الواضحة؟ في خصائص عنصر التحكم في الصور، يمكن تعديل جودة الصور، ولكن لاحظ أن جودة الصور الأعلى تعني حجمًا أكبر للصور، مما يؤدي إلى تباطؤ سرعة فتح الموقع.

          خطوات العملية كما يلي: http://help.eyingbao.com/products/wangzhanshangtupianbuqingxizenmechuli.html    

      ملاحظات:

      • تأكد من عدم وجود صور زائدة أو غير مستخدمة في صفحات الويب.

      • لاحظ الصور التي يتم تحميلها افتراضيًا ولكن قد لا يتم عرضها أبدًا، مثل "صور الشرائح"، "الأيقونات" و"معارض الصور".

      • لتقليل الوقت اللازم لتصيير الصور المهمة، يستخدم نظام EasyStore تقنية التأخير في تحميل الصور غير المهمة.

(3) معالجة تسريع CDN للصور

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

(4) التحميل البطيء للصور

        يوفر مكون image في منصة إنشاء مواقع EasyStore تقنية lazy-load، حيث تكون الصور افتراضيًا بوظيفة التحميل البطيء:

2. فحص سريع للصور كبيرة الحجم داخل صفحات الويب

        يمكن من خلال أدوات المطورين Network التحقق من وقت تحميل الصور وحجمها، كما يلي:

      (1) جميع المتصفحات لديها وضع مطور، على سبيل المثال في Chrome، بعد فتح الصفحة، اضغط على ctrl+shift+i، أو انقر بزر الماوس الأيمن واختر "فحص"، للدخول إلى وضع المطور، ثم انقر على علامة تبويب Network

       (2) انقر على "Img"، ثم انقر على Size في القائمة لترتيب الصور حسب الحجم، مع التركيز على تحسين الصور التي تزيد عن 50K، باستخدام أدوات معالجة الصور للتحسين

3. تحسين الصور وإعادة نشرها

        بعد تحسين الصور، قم بإعادة تحميلها ونشرها، وسيكون الأمر قد اكتمل. يمكنك أيضًا تمكين وظيفة WebP مباشرة من لوحة تحكم إدارة الموقع.

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