WebP و نحوه استفاده از این فرمت در وردپرس + معرفی افزونه

تصاویر تقریبا 50 درصد از حجم یک صفحه از سایت را به خود اختصاص می دهند، پس هر چیزی که می تواند باعث بهینه سازی تصاویر شما و کاهش حجم آنها شود نه تنها باعث آزاد شدن بخش زیادی از فضای هاست شما می شود، بلکه باعث می شود که صفحات سایت شما سریع تر بارگذاری شده و در عین حال کاربران با تصاویر بی کیفیت نیز روبرو نشوند.

خوشبختانه، با فرمت تصویر WebP، شما می توانید تصاویر سایت را با حجم 26 درصد کمتر از فرمت PNG و 25-34 درصد کوچکتر از JPEG بر روی سایت منتشر کنید در حالیکه آسیبی به کیفیت تصاویر نیز وارد نمی شود.
در این آموزش به بررسی فرمت WebP و نحوه استفاده از این قالب تصویر در سایت های وردپرسی توضیح داده می شود تا مشاهده کنید چگونه یک فرمت تصویری می تواند حجم صفحات سایت شما را به صورت چشمگیری کاهش دهد.

WebPro چیست؟
WebP یک فرمت فایل تصویری است که توسط یک تیم متخصص و خبره در Google ایجاد شده است تا جایگزینی برای فرمت های JPEG، PNG و GIF باشد، این در حالی است که از فشرده سازی، شفافیت و انیمیشن ها نیز پشتیبانی می کند.

WebPro نخستین بار در سپتامبر 2010 به عنوان یک استاندارد جدید برای فایل های گرافیکی به صورت فشرده شده در وب منتشر شد و حجم فایل های تولیده شده دارای کیفیت قابل مقایسه با JPEG و با حجم کمتر می باشد.

از سال 2012 این فرمت جایگزینی برای فرمت PNG معرفی شد. فشرده سازی تصاویر بدون افت کیفیت مهم ترین ویژگی فرمت WebPro است.

در نمونه های زیر از گالری WebP گوگل نمی توانید تفاوت کیفیت قابل توجهی بین تصاویر JPEG در سمت چپ و نسخه های WebP در سمت راست مشاهده کنید. با مشاهده کردن نمی توانید تفاوت آنها را تشخیص دهید مگر اینکه اندازه فایل ها را بررسی کنید. تصاویر WebP بیش از 30٪ کوچکتر از تصاویر با فرمت JPEG هستند.


تصویر (1)

بنابراین با کاهش اندازه فایل های تصویری با استفاده از یک قالب مانند WebP همراه با تکنیک های دیگر مانند استفاده از قابلیت بارگذاری افزونه WP Rocket، می توانید تصاویری کوچکتر را ارائه دهید و اطمینان حاصل کنید که صفحات شما سریع تر از قبل بارگذاری می شوند.

پشتیبانی مرورگر ها از WebP
ممکن است تعجب کنید که با گذشت 8 سال از رونمایی فرمت WebP هنوز آن طور که باید شناخته شده نیست، به نظر شما چرا این فرمت تصویر محبوبیتی ندارد ؟ چرا هنوز از JPEG و PNG استفاده می شود؟ در حالیکه WebP می تواند اندازه فایل های تصویری ما را کوچکتر کرده و کیفیت آن را نیز ثابت نگه دارد؟ متاسفانه در حال حاضر همه مرورگرها از WebP پشتیبانی نمی کنند.

در تصویر زیر می توانید میزان پشتیبانی مرورگرهای مختلف را از این فرمت مشاهده کنید، مرورگرهایی که از WebP پشتیبانی می کنند عبارتند از Chrome، Opera، Opera Mini، مرورگر Android و Chrome for Android.


تصویر (2)

مایکروسافت اعلام کرد که از WebP در مرورگر Edge خود در اواخر ماه اکتبر پشتیبانی می کند، موزیلا نیز مطلب مشابهی را برای فایرفاکس منتشر کرده است. در حال حاضر، تنها Safari اپل بدون هیچ گونه سازگاری با webp از سایر مرورگرها عقب مانده است.

پس از اینکه اپل مشاهده کرد کاربران زیادی علاقه مند به استفاده از فرمت WebP هستند در iOS 10 و MacOS Sierra خود فرمت HEIF را جایگزین فرمت WebP کرد. HEIF یک فرمت تصویری بر اساس استاندارد فشرده سازی ویدیوی HEVC (همچنین به عنوان H.265 و MPEG-H شناخته می شود) می باشد.

در حالی که هیچ نشانه ای از اخباری که اپل از WebP در آینده پشتیبانی می کند وجود ندارد، این شرکت در حال حاضر کمترین علاقه را برای پشتیبانی از این فرمت محبوب دارد، زیرا تمام مرورگرهای اصلی و نرم افزارهای ویرایش تصویر از آن حمایت می کنند.

آیا استفاده از فرمت تصویر WebP یک ریسک محسوب می شود ؟
فقط به این دلیل که اپل از WebP پشتیبانی نمی کند، به این معنا نیست که شما نباید از فرمت WebP استفاده کنید. اما قبل از تصمیم گیری در مورد استفاده یا عدم استفاده از WebP در سایت خود، چند نکته وجود دارد که باید در نظر داشته باشید.

حتما می دانید که Chrome محبوب ترین مرورگر با 64٪ سهم بازار است. بنابراین احتمال دارد که اکثر بازدیدکنندگان قادر به مشاهده تصاویر WebP در سایت شما باشند و مشکلی نیز با آن نداشته باشند.


تصویر (3)

در گوگل آنالیتیکس می توانید بررسی کنید کاربران با چه مرورگرهایی از سایت شما دیدن کرده اند، با بررسی دقیق تر می توانید مطمئن شوید که اکثر بازدیدکنندگان سایت شما از چه مرورگری استفاده می کنند تا تصمیم بهتری برای استفاده از فرمت WebP بگیرید. می توان پیش بینی کرد که تقریبا 85 درصد از کاربران با مرورگرهایی مانند فایرفاکس و یا کروم به سایت شما مراجعه می کنند و مرورگر سافاری در رتبه سوم قرار دارد، بنابراین می بایست تصمیم بگیرید که در سایت خود برای تصاویر از فرمت WebP استفاده کنید یا خیر. اگر نمی خواهید کاربران خود در مرورگر سافاری را نیز از دست دهید می توانید از تصاویر جایگزین در بین متون خود استفاده کنید.

نحوه استفاده از فرمت WebP در وردپرس
در اینجا مشکل دیگری برای استفاده از فرمت WebP در وردپرس وجود دارد، متاسفانه به صورت پیش فرض وردپرس از آن پشتیبانی نمی کند.
در حالی که وردپرس از محبوب ترین فرمت های فایل تصویری، از جمله JPEG، PNG، GIF، و ICO پشتیبانی می کند، هنوز WebP را به آن لیست اضافه نکرده است. این بدان معنی است که شما نمی توانید یک فایل WebP را در کتابخانه رسانه وردپرس خود آپلود کنید زیرا با خطای امنیتی زیر روبرو می شوید:


تصویر (4)

اما نگران نباشید با کمک افزونه ای که در ادامه معرفی می شود می توانید یک تصویر با فرمت WebP را در وردپرس آپلود نمائید.

با استفاده از افزونه WebP Express می توانید تصاویر سایت خود را به فرمت webp تبدیل نمائید. این افزونه از کتابخانه WebP Convert برای تبدیل تصاویر به webp استفاده می کند. WebP Convert قادر است تصاویر را با استفاده از چندین روش تبدیل کند. روش های تبدیل عبارتند از: cwebp، gd، imagick. این افزونه با تبدیل فرمت های تصویری، مشاهده تصاویر سایت شما را که با فرمت webp هستند برای کاربرانی که از Safari استفاده می کنند ممکن می سازد. تصویری از تنظیمات افزونه را در ادامه می توانید مشاهده کنید:


تصویر (5)

قابلیت شتاب دهنده سایت Jetpack (که قبلا نیز به نام Photon شناخته می شد) نیز به طور خودکار JPEG ها و PNG ها را به فرمت تصویر WebP تبدیل می کند.
در اینجا یک مثال از کیفیت فشرده سازی است که API Photon در هنگام تنظیم بر روی 50٪ ارائه می دهد را می توانید مشاهده کنید:


تصویر (6)

همچنین می توانید از یک CDN استفاده کنید، کاربران Cloudflare می توانند با پرداخت هزینه به ویژگی CDN آن دسترسی داشته باشند که تبدیل خودکار WebP را نیز ارائه می دهد و باعث می شود تمامی کاربران با هر مرورگری قادر به مشاهده تصاویر سایت شما باشند. اما خبر خوش برای کاربران افزونه WP Rocket این است که در نسخه 3.3 این افزونه از WebP پشتیبانی خواهد شد.

مقایسه فرمت JPEG با WebP:
شش تصویر تصادفی JPEG از Unsplash دانلود شد، تصاویر دانلود شده فشرده شدند تا بررسی شود چه میزان می توان حجم تصاویر را کم کرد و سپس تصاویر اصلی به WebP تبدیل شدند تا میزان فشرده سازی آن ها قابل مقایسه باشد. در تصویر زیر می توانید این مقایسه را مشاهده کنید:


تصویر (7)

تبدیل فرمت تصویر به WebP به طور متوسط باعث کاهش 50٪ حجم تصاویر شد. در تصویر زیر به صورت واضح می توانید تفاوت دو فرمت JPEG با WebP را مشاهده کنید، واقعا حیرت انگیز است !


تصویر (8)

مقایسه فرمت PNG با WebP:
مجدد شش تصوير انتخاب شدند، این بار فایل های PNG از freepngs.comدریافت شدند. تصاویر فشرده شدند و سپس به فرمت WebP تبدیل شدند تا بتوان آنها را مقایسه کرد. همانطور که در تصویر زیر نیز مشاهده می کنید به طور کلی، تبدیل از PNG به WebP منجر به کاهش به طور متوسط 67٪ در اندازه فایل اصلی شده است.


تصویر (9)

و اما در انتها :

فرمت فایل WebP همچنان در حال رشد و محبوبیت و پشتیبانی توسط مرورگرهای مختلف است. در واقع هیچ فرمت تصویری یا ابزار بهینه سازی تصویر برای وب وجود ندارد که بتواند اندازه فایل ها را بدون هیچ گونه افت کیفیت قابل توجه ای کاهش دهد اما WebP این امکان را به شما می دهد تا ضمن کاهش 50 درصدی اندازه فایل های تصویری، کیفیت آنها نیز حفظ شود. کاربران امیدوارند در آینده اپل نیز از WebP پشتیبانی کند. اما تا زمانیکه این اتفاق نیفتاده است می توانید از روش های جایگزینی که در این مطلب ذکر شد استفاده کنید.



آیا این پاسخ به شما کمک کرد?

افزودن به مورد علاقه ها افزودن به مورد علاقه ها

پرینت این مقاله پرینت این مقاله

در همین زمینه

هر گونه مشکل و سوالی دارید، تیم ما آماده پاسخگویی می باشد

هم اکنون ارتباط را برقرار کنید

بخش مورد نظر را انتخاب کنید


در حال حاضر 42 نفر از همکاران Online در حال پاسخگویی هستند

کانال های ما
کانالهای ما