صور WebP و WordPress: لماذا وكيفية استخدامها

إذا كنت تبحث عن تسريع موقع WordPress الخاص بك ، فمن الجيد استخدام تنسيق صورة WebP. تكمن المشكلة الرئيسية في سبب بطء تحميل محتوى موقع الويب الخاص بك في وجود صور كبيرة على موقع الويب الخاص بك.

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

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

ماذا تقصد بصور WebP و WordPress ، ومتى تستخدمه ، وكيف يمكنك إضافة WebP إلى موقع الويب الخاص بك الذي يعتمد على WordPress؟

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

WebP: ماذا يعني ذلك؟

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

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

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

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

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

لديها أهداف مماثلة كما يفعل WebM. يعني WebM ضغط الصوت والفيديو أثناء تحسينه للويب.

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

لكنه لا يعمل بشكل أفضل مع Internet Explorer و KaiOS وإصدارات Safari الأخرى. ولكن لا يزال هناك الكثير من المستخدمين الذين يستخدمون هذه المتصفحات بما في ذلك الإصدار القديم من Safari.

لماذا يعتبر WebP ضروريًا

على صور WebP و WordPress ، أجرت Google الكثير من الأبحاث. ومع ذلك ، وجدوا في كل مرة أن الخوارزمية يمكنها ضغط 25-34٪ أصغر مع الصور المفقودة و 26٪ أصغر مع الصور غير المفقودة.

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

هذه هي ميزة استخدام WebP ، ولكن لا يزال هناك الكثير من المستخدمين الذين يستخدمون التقنيات القديمة لضغط الصور.

ومع ذلك ، هناك 0.3٪ فقط من مواقع الويب التي تستخدم ميزات WebP. يتزايد الاتجاه مع WebP ولكن لا يزال الناس متمسكين بالتقنية الأقل استخدامًا.

هذا مفاجئ للغاية عندما نتحدث عن فوائد WebP.

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

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

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

WebP وأنواع تنسيقات ملفات الصور الأخرى

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

ستجد أيضًا بعض التنسيقات الأخرى التي ستوفر خلفية شفافة. لا نقول إن WebP هو الخيار الأفضل لكل بديل ، لكن نعم إنه يوفر بعض الميزات التي يمكن استخدامها في بعض المواقف المتنوعة.

دعنا نرى بعض تنسيقات ملفات الصور الشائعة المستخدمة عالميًا

• PNG: يمكن اعتبار PNG تنسيق الملف الأكثر شيوعًا. يعد تنسيق الملف هذا أكثر شيوعًا للضغط بدون فقد ومن الأفضل عرض العمل الفني والتصوير الفوتوغرافي عبر الإنترنت.
• TIFF: تنسيق ملف آخر هو TIFF الذي لا يحتوي على ضغط. هذه الصورة معروضة في كل مدحها. هذا هو السبب في أن معظم الملفات المحفوظة بتنسيق TIFF سيكون لها حجم ملف كبير. بالنسبة للويب ، هذا ليس الخيار الأفضل.
• GIF: تنسيق آخر هو GIF وهو مدعوم بالرسوم المتحركة. ومع ذلك ، يمكنك القول إنه أقدم تنسيق ملف يدعم أيضًا أكثر من 250 لونًا. ستبدو الصور المحفوظة بتنسيق GIF منخفضة الجودة وقبيحة. إذا كنت تبحث عن رسوم متحركة فعليك اختيار تنسيق GIF.
• ملفات EPS و SVG: هذان هما اتحادان خاصان بهما. سيؤدي هذا إلى حفظ وعرض الصور المتجهة التي تكون قابلة للقياس والوضوح لأنها لم يتم إنشاؤها من وحدات البكسل.
• WebP: جودة صورة WebP مماثلة لـ PNG أو JPG بحجم ملف أقل. كما أنه يدعم الرسوم المتحركة والشفافية.

إذا كنت مرتاحًا لفقدان نوع من جودة الصورة مقابل الصور الأصغر ، فإن WebP هو الخيار المثالي لك.

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

إلى WordPress الخاص بك كيف يمكنك تحميل صور WebP

ستجد طريقتين مختلفتين ستساعدك على تحميل صور WebP و WordPress

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

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

ولكن إذا اخترت الحصول على صور WebP يدويًا ، فسيتعين عليك أولاً الحصول على صور WebP. بصفتك WebP ، لا يمكنك حفظ الصور أو على جهاز الكمبيوتر الخاص بك ، لا يمكنك تغيير الامتداد ، ستحتاج إلى محول مخصص.

لهذا ، يمكنك الاستفادة من برنامج Photoshop الإضافي من Google المعروف باسم WebPShop. أو يمكنك أيضًا استخدام محول WebP عبر الإنترنت وتحميل الصور على جهاز الكمبيوتر الخاص بك.

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

مع هذا لديها مشكلة:

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

على الخادم الخاص بك ، يمكنك تحميل صور WebP يدويًا ويمكنك تكوين موقع الويب بشكل صحيح لعرضها ولكنه يتطلب بذل الكثير من الجهد.

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

1. تخيل

يمكنك القول أن Imagify ليس مجرد تحويل WebP ولكنه أيضًا مكون إضافي يساعدك على تحسين الصور والصور المصغرة التي تقوم بتحميلها.

يتم تضمين ثلاثة مستويات مختلفة من الضغط مع Imagify ، أي فائقة (أقصى ضغط ضياع) ، وعادي (بدون خسارة) ، وعدواني (ضياع).

سيساعدك مُحسِّن الجملة على ضغط جميع الصور التي تم تحميلها. وبالتالي سيتم حفظ النسخة الاحتياطية لذلك في حالة ما إذا كنت ترغب في عدم ضغط الصور ، فيمكنك التراجع عنها.

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

بمساعدة Imagify ، يمكنك ضغط صور 25 ميجا بايت كل شهر مجانًا.

2. محسن صور EWWW

البرنامج المساعد الآخر الأكثر شيوعًا لمحسن صور WordPress هو EWWW. تمت مضاعفة هذا البرنامج المساعد كمحول WebP. يمكنك ضغط الصور غير المحدودة مجانًا أيضًا.

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

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

3. محسن صورة البيكسل القصيرة

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

وبالتالي ، ستتمكن بسهولة من إنشاء إصدارات WebP تلقائيًا. يمكنك تحسين الصور إما باستخدام مُحسِّن مجمّع أو عن طريق التحميل المباشر.

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

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

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