25 نوفمبر، 2020

أفضل الطرق لتحسين الصور لزيادة سرعة موقعك WordPress

شـارك المقالـة

أهمية تحسين الصور

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

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

كيف تؤثر الصور على سرعة وأداء موقع الويب الخاص بك

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

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

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

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

  • تقليل حجم ملف الصور الخاصة بك قبل تحميلها على موقعك

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

    • استخدام أداة عبر الإنترنت لضغط صورك موقع pixlr

استخدام أداة عبر الإنترنت لضغط صورك موقع pixlr

    • استخدام أداة عبر الإنترنت لضغط صورك موقع websiteplanet

استخدام أداة عبر الإنترنت لضغط صورك موقع websiteplanet

    • استخدام أداة عبر الإنترنت لضغط صورك موقع imageoptimizer

استخدام أداة عبر الإنترنت لضغط صورك موقع imageoptimizer

هناك نوعان من ضغط الصور:

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

يطبق تلقائيًا طريقة الضغط المثالية لتقليل حجم ملف صورتك بأكبر قدر ممكن دون فقدان الجودة. تضيف الأبعاد الكبيرة للغاية وزنًا غير ضروري لموقعك وخادمك أيضًا. لذلك، يمكنك أيضًا تقليل حجم الملف عن طريق ضبط ارتفاع وعرض صورك. يمكنك تحديد هذه القياسات في HTML الخاص بك أو باستخدام منصة لتحرير الصور قبل تحميلها. لنفترض أن لديك صورة بأبعاد أصلية 5472 × 3648 بكسل. حجم الملف (أو وزنه) 3 ميجا بايت. لكن يحتاج موقعك فقط إلى صورة بحجم 1920 x 1280 بكسل. يؤدي تغيير حجم الصورة إلى هذه الأبعاد وتقليل جودتها قليلاً بنسبة عشرة بالمائة إلى تقليل الحجم الإجمالي للملف من 3 ميجابايت إلى 613 كيلوبايت.

إقرأ أيضا:

  1. أهم الخطوات المتبعة لتسريع موقعك WordPress
  2. كيفية معالجة و تحسين الصور بواسطة KeyCDN لتسريع موقعك ووردبريس
  3. تفعيل ضغط Gzip لتسريع موقعك ووردبريس
  4. كيفية تقليل TTFB لتسريع تحميل صفحات موقعك ووردبريس
  5. أفضل إضافات ذاكرة التخزين المؤقت wp cache لتسريع موقع ووردبريس
  6. دور إضافات التخزين المؤقت wp cache في تسريع موقع ووردبريس
  7. تقنيات تحسين السيو لإبراز المحتوى الخاص بك في عمليات بحث Google
  • اختر التنسيق أو الصيغة المناسبة

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

هناك أربعة تنسيقات ملفات رئيسية مستخدمة للصور على الويب:

    1. PNG: يتطلب هذا التنسيق ضغطًا بدون فقد. عادةً ما تكون صور PNG عالية الجودة ولكنها ذات أحجام ملفات كبيرة بشكل طبيعي.
    2. JPEG: تميل صور JPEG إلى أن تكون أقل جودة من ملفات PNG، ولكنها أيضًا أصغر وزناً.
    3. GIF: يستخدم هذا التنسيق فقط الضغط بدون فقدان. إنه مخصص للصور المتحركة ذات أحجام الملفات الصغيرة ويستخدم بشكل شائع لوسائل الإعلام الاجتماعية ومشاركات المدونات. يجب استخدام ملفات GIF باعتدال. على الرغم من أنها غالبًا ما تكون مصدرًا ممتازًا للفكاهة أو المعلومات التعليمية، إلا أن الرسوم المتحركة تميل إلى وضع حد لسرعة موقعك.
    4. WebP: تنسيق ملف جديد نسبيًا يمكن أن يستخدم ضغطًا بدون فقد أو فقد. تكون صور WebP أصغر بنسبة 26 بالمائة من صور PNG وأقل بنسبة 34 بالمائة من صور JPEG. ومع ذلك، فإن التنسيق غير معتمد من قبل جميع متصفحات الإنترنت الرئيسية (وعلى الأخص Safari). صور WebP متفوقة بمعنى أنها تقدم أصغر حجم ممكن للملفات بأعلى جودة. ونظرًا لأن Safari هو ثاني أشهر متصفح بعد Google Chrome (خاصة لأجهزة الجوال) ، فقد لا يكون الخيار الأفضل هو تقديم محتوى مرئي غير موثوق.

عندما يتعلق الأمر بالاختيار بين صور PNG و JPEG ، فإن الإجماع العام هو أن الأولى هي الأفضل للقطات الشاشة والرسومات بينما تنتج الأخيرة صورًا أفضل.

  • استخدم ملحق تحميل كسول مثل LazyLoad

إذا كنت تأخذ أداء موقعك على محمل الجد، فربما قمت بتحسينه. ولكن هل فكرت في تحميلها في Lazy Load؟ يعمل Lazy Load of Images على تحسين تجربة المستخدم من خلال تحرير النطاق الترددي للمحتوى المهم.

يرفض البعض هذه التقنية لأسباب تحسين محركات البحث. لكن التحميل البطيء لصورك لا يمنع فهرستها. دعنا نرى لماذا يجب عليك تنفيذ تحميل كسول للصور وكيفية التأكد من توافقه مع SEO الخاص بك.

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

Lazy Image Loading عبارة عن مجموعة من التقنيات المصممة لتلبية هذه الحاجة الأخيرة من خلال تأخير تنزيل كل صورة حتى تكون هناك حاجة إليها، بعد تفاعل معين، أو بعد التمرير، أو بعد الوصول إليها.

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

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

الغرض من هذه التقنية هو تقليل عدد الصور التي يجب على متصفحات الزوار تحميلها في نفس الوقت. يساعد في كل من عرض النطاق الترددي وسرعة الموقع

لتمكين هذه الميزة، نوصي باستخدام تحسين الصورة والمكون الإضافي للتحميل البطيء مثل LazyLoad

Lazy Load by WP Rocket

  • يعرض Lazy Load by WP Rocket الصور و / أو إطارات iframe على الصفحة فقط عندما تكون مرئية للمستخدم. هذا يقلل من عدد آلية طلبات HTTP ويحسن وقت التحميل.
  • يعمل هذا البرنامج المساعد على الصور المصغرة وجميع الصور في محتوى المنشور أو في نص القطعة والصورة الرمزية والابتسامات وإطارات iframe لا يتم استخدام مكتبة JavaScript مثل jQuery ووزن البرنامج النصي أقل من 10 كيلو بايت.
  • يمكنك أيضًا استبدال إطارات iframe على Youtube من خلال صورة مصغرة للمعاينة لزيادة سرعة وقت تحميل موقعك على الويب.
187 مشاهدة
قمت بالتصويت سابقًا!

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *