ملفات WebP هي تنسيق أحدث يحل بعض مشاكل ملفات JPEG و PNG. تعرف على كيفية استخدام ملفات WebP لمجموعة متنوعة من أنواع الصور.
ولكن هناك وافد جديد في المدينة: WebP، وهو تنسيق حديث للصور يجمع بين الكفاءة والجودة والتنوع.
أنشأ مطورو Google WebP لتقديم صور عالية الجودة بأحجام ملفات أصغر باستخدام خوارزميات ضغط متقدمة تقلل من بيانات الصور الزائدة عن الحاجة.
ويتفوق WebP على PNG لصور الويب حيث يتفوق في الضغط بنسبة 42% على libpng (المكتبة المرجعية الرسمية لتنسيق PNG) و23% على ZopfliPNG، وفقا لباحثي Google. أحجام ملفات WebP أصغر بنسبة 25٪ إلى 34٪ من ملفات JPEG، مما يجعل مواقع الويب التي تحتوي على صور ثقيلة أكثر كفاءة بشكل ملحوظ.
والإمكانات ملموسة: زيادة سرعة الصفحة، وزيادة تفاعل العملاء، وتحسين تصنيفات محركات البحث، وزيادة الوقت على الموقع، وانخفاض معدلات الارتداد. فيما يلي تفصيل لإيجابيات WebP وسلبياته، بالإضافة إلى كيفية تطبيقه على موقع التجارة الإلكترونية الخاص بك.
ما هو ملف WebP؟
WebP هو تنسيق ملف مصمم لتحسين الصور للويب، وتحسين أوقات التحميل وتحسين الأداء العام للموقع الإلكتروني. تم تطويره من قبل Google في عام 2010، صور WebP أصغر حجما وتنقل البيانات بشكل أسرع وتستهلك نطاقا تردديا أقل للشبكة، مما يسمح بتحميل صفحات الويب بشكل أسرع وبشكل ملحوظ. يمكنك التعرف على ملف WebP من خلال امتداده .webp.
WebP هو تنسيق ملف صورة نقطية، مما يعني أنه يمثل صورة ثنائية الأبعاد كشبكة من البكسلات (عناصر الصورة) معروضة على شاشة رقمية. يتم تعريف الصور النقطية من خلال عرضها وارتفاعها والبت لكل بكسل (bppel)، والتي تحدد كمية المعلومات اللونية التي يمكن تمثيلها في كل بكسل من الصورة.
تؤدي وحدات البت الأعلى لكل بكسل إلى صور أكثر ثراء وتفصيلا. يدعم WebP كلا من عمق الألوان 8 بت و10 بت، مما يوفر صورا عالية الجودة مع نطاق لوني واسع. يوفر عمق الألوان 10 بت 10 بت 1,024 درجة لونية لكل لون أساسي، مما ينتج عنه أكثر من مليار لون ممكن.
يدعم تنسيق ملف WebP الضغط المفقود وغير المفقود لتقليل حجم الملف:
- ضغط WebP المفقود. يزيل الضغط المفقود بعض بيانات الصورة لتقليل حجم الملف، مما يؤدي إلى التضحية بجودة الصورة، على الرغم من أنه غالبا ما يكون غير محسوس للعين البشرية. ومع ذلك، في كل مرة يتم فيها حفظ الصورة أو تحريرها، يتم إعادة تطبيق خوارزمية الضغط، ويمكن أن يؤدي التأثير التراكمي إلى تشويش أو انسداد أو تشوهات لونية.
- ضغط WebP بدون ضياع. يقلل الضغط بدون ضياع من حجم الملف دون أي خسارة في الجودة.
توفر صور WebP مزايا كبيرة في حجم الملف: تكون ملفات WebP غير المفقودة أصغر بنسبة 26% من ملفات PNG المكافئة، بينما تكون ملفات WebP المفقودة أصغر بنسبة 25% إلى 34% من ملفات JPEG المماثلة بنفس مستوى الجودة. ووجدت الدراسات التي ترعاها Google أن WebP يوفر ضغطا أفضل من PNG وJPEG، خاصة للصور الأصغر حجما، وهي الأكثر شيوعا على الإنترنت.
إيجابيات وسلبيات ملفات WebP
- دعم الشفافية. يدعم WebP الشفافية، والمعروفة أيضا باسم قناة ألفا، والتي تسمح للصور ذات الخلفيات الشفافة، وهي مثالية للشعارات والأيقونات.
- دعم الرسوم المتحركة. بالإضافة إلى الصور الثابتة، يدعم تنسيق WebP أيضا الصور المتحركة، مما يوفر بديلا حديثا لتنسيق GIF. يتميز WebP للرسوم المتحركة بضغط أفضل من صور GIF بدون فقدان أو فقدان أفضل من صور GIF، كما أن خيارات WebP التي تبلغ 1024 لونا تتفوق على قيود لوحة الألوان التي تبلغ 256 لونا في صور GIF.
- أداء أفضل للموقع الإلكتروني. عادة ما تكون ملفات صور WebP أصغر بكثير من صور JPEG وصور PNG المماثلة، مما يؤدي إلى تقليل استخدام النطاق الترددي (معدل إرسال خادمك لبيانات الصور إلى متصفحات المستخدمين). وهذا يزيد من سرعة التحميل، مما يتيح لك عرض المزيد من الصور، مثل صور المنتجات، دون المساس بقابلية الاستخدام.
- تحسين تحسين محركات البحث (SEO). يزيد وقت تحميل الصفحة بشكل أسرع من تحسين محرك البحث. توصي Google باستخدام صور WebP لتحسين أداء الموقع الإلكتروني من خلال تقليل أحجام ملفات الصور وتحسين سرعة الموقع.
- صور بجودة أعلى. لست بحاجة إلى التضحية بجودة الصورة من أجل أوقات تحميل أسرع. تحافظ صور WebP غير المفقودة على الجودة الكاملة مع كونها أكثر كفاءة من صور PNG، مما يوفر الحفاظ على الصورة بشكل أفضل دون المساومة على الوضوح.
- سهولة الاستخدام على الهاتف المحمول. يوفر حمل النطاق الترددي الأخف لـ WebP تجربة مرئية عالية الجودة لمستخدمي الأجهزة المحمولة دون التضحية بالأداء.
- التوافق مع المتصفحات القديمة. تتمتع المتصفحات الحديثة بدعم WebP ممتاز، لكن المتصفحات الأقدم والأقل شيوعا قد لا تدعم التنسيق بشكل كامل. قد يحتاج مطورو الويب إلى إضافة صور JPEG أو PNG بدلا من WebP للمتصفحات القديمة، مما يؤدي إلى زيادة النفقات الإضافية وربما تعويض بعض مزايا وقت التحميل التي يوفرها WebP.
- تعقيد التشفير وفك التشفير. يمكن أن يكون ترميز WebP أكثر تطلبا من الناحية الحسابية من JPEG أو PNG، مما يزيد من وقت المعالجة ويتطلب أجهزة أكثر قوة. قد لا يكون هذا الأمر ملحوظا على الأجهزة الحديثة ولكنه قد يؤثر على الأجهزة القديمة أو الأقل قوة.
- دعم برامج الرسومات القديمة. قد لا تدعم برامج تحرير الصور القديمة WebP، مما يتطلب مكونات إضافية أو أدوات تحويل تابعة لجهة خارجية - على الرغم من أن معظم برامج تحرير الصور الحديثة تدعم الآن WebP. على سبيل المثال، تتطلب الإصدارات الأقدم من Adobe Photoshop مكونا إضافيا لتحرير ملفات WebP، لكن جميع إصدارات Photoshop منذ عام 2022 تدعم WebP الأصلي، مما يتيح لك فتح ملفات WebP وتحريرها وحفظها مباشرة.
- احتمال فقدان جودة الصورة. عند استخدام إعدادات ضغط صور WebP الأعلى، قد تلاحظ فقدان جودة الصورة في التفاصيل المعقدة أو القوام، على غرار صور JPEG المضغوطة بدرجة عالية.
WebP مقابل JPEG و PNG
تبرز مزايا WebP بالمقارنة مع صيغتي صور الويب الشائعتين الأخريين: JPEG و PNG.
- الضغط
- الشفافية
- الرسوم المتحركة
الضغط
تستخدم ملفات JPEG ضغطا ضائعا، مما قد يقلل من جودة الصورة عند إعادة حفظ الصورة أو تحريرها عدة مرات، مما يؤدي إلى تدهور تدريجي مع تكرار التحرير والحفظ. وهو مثالي للصور ذات الألوان الكثيرة، مثل الصور، بسبب قيود الإدراك البشري - فأنت أقل حساسية للتغيرات الطفيفة في اللون والسطوع من الحواف الحادة. يعمل ضغط JPEG على تجاهل التفاصيل التي من غير المرجح أن تلاحظها، مما يقلل من حجم الملف عن طريق إزالة المعلومات الأقل إدراكا.
تعد ملفات PNG ممتازة للاحتفاظ بجودة الصورة العالية من خلال الضغط بدون فقدان، ولكن أحجام الملفات أكبر.
ويجمع WebP بين مزايا JPEG وPNG، مما يوفر ضغطا أكثر كفاءة من كليهما. وهذا يعني حجم ملف أصغر مع جودة صورة أفضل.
الشفافية
لاستخدام الصور ذات الحواف التفصيلية على خلفيات مختلفة، تحتاج إلى نوع ملف يدعم الشفافية. لا تدعم JPG الشفافية، بينما تدعم ملفات PNG و WebP، ولكن ملفات PNG تميل إلى أن تكون أكبر من WebP، مما يجعل WebP خيارا أكثر كفاءة.
الرسوم المتحركة
يفتقر كل من JPEG و PNG إلى دعم الرسوم المتحركة. يمكن إضافة دعم PNG باستخدام امتداد APNG، والذي قد لا يكون متوافقا مع المتصفحات القديمة. ومع ذلك، يحتوي WebP على دعم مدمج للرسوم المتحركة، مما يتيح لك إنشاء مقاطع فيديو قصيرة ورسوم متحركة متكررة وميمية رائعة قادمة.
كيفية استخدام صور WebP
- إنشاء ملفات WebP وتحريرها
- فتح ملفات WebP في المتصفح
- التحويل إلى WebP
إليك كيفية إنشاء ملفات WebP وفتحها وتحويل صور JPEG و PNG إلى WebP:
إنشاء ملفات WebP وتحريرها
قم بإنشاء ملفات WebP وتحريرها في تطبيق لتحرير الصور مثل GIMP أو Adobe Photoshop، ثم احفظ صور WebP باستخدام ميزة حفظ باسم أو تصدير واختر خيار تنسيق صورة WebP. قد تتطلب الإصدارات الأقدم من برامج تحرير الصور مكونات إضافية إضافية.
فتح ملفات WebP في مستعرض ويب
يمكنك فتح صور WebP في متصفحات الويب التي تدعم WebP، بما في ذلك المتصفحات الرئيسية مثل Google Chrome وMozilla Firefox وMicrosoft Edge وSafari وObera. ما عليك سوى سحب ملف صورة WebP إلى نافذة المتصفح أو النقر بزر الماوس الأيمن فوق الملف وتحديد ”فتح باستخدام“ لعرضه في متصفحك الافتراضي.
يمكنك أيضا فتح ملفات WebP في أدوات تحرير الصور وعارضات الصور التي تدعم WebP، مثل الإصدارات الأحدث من Adobe Photoshop وGIMP وIrfanView وXnView MP.
التحويل إلى WebP
يمكنك استخدام أدوات عبر الإنترنت مثل Tinify و CloudConvert و Image Resizer لتحميل وتحويل صور JPEG و PNG إلى WebP. قم بتحميل صورك وضبط إعدادات الضغط والتنزيل. تتيح بعض الأدوات معاينة حية للجودة. سيكون لصور WebP المضغوطة حجم ملف أصغر حجما محسنا لمواقع الويب.
الأسئلة الشائعة حول ملف WebP
كيف يمكنني تحويل ملف WebP إلى JPG؟
أسهل طريقة لتحويل ملفات WebP إلى JPG هي استخدام أدوات التحويل عبر الإنترنت مثل CloudConvert أو Tinify. أو يمكنك استخدام أداة غير متصلة بالإنترنت مثل Adobe Photoshop أو GIMP، وأدوات سطر الأوامر مثل cwebpp.
ما الذي سيفتح ملف WebP؟
يمكن فتح ملفات WebP بواسطة المتصفحات الرئيسية مثل Google Chrome وMozilla Firefox وMicrosoft Edge وObera. ويمكنك أيضا استخدام أدوات تحرير الصور وعارضات الصور التي تدعم WebP، مثل الإصدارات الأحدث من Adobe Photoshop و GIMP (برنامج GNU Image Manipulation Program) و IrfanView و XnView MP. تحتاج بعض التطبيقات إلى مكون إضافي.
هل يحل WebP محل JPG؟
WebP هو تنسيق جديد يتمتع بالكثير من المزايا، لكنه لم يحل بالكامل محل JPG. ومع ذلك، يستمر دعم WebP في النمو بسبب خوارزمية الضغط الفائقة والأداء الأفضل على الويب ودعم المتصفح المحسن ودعم Google القوي.