تصاویر بخش زیادی از سایتها را تشکیل میدهند که علاوه بر ایجاد زیبایی بصری باعث انتقال ساده تر مفاهیم به کاربر میشود و از طرفی حجم فایلهای تصویر به کار رفته در صفحات سایتها باعث بالا رفتن حجم کلی صفحه و کند شدن سایت میشود.
برای حل کردن این مشکل و ایجاد سایتهایی که بتواند با استفاده از تصاویر هم به سرعت بارگذاری شود، شرکت گوگل فرمت تصویری وب پی webP را ارائه کرد که امروز قصد دارم در مورد آن صحبت کنم
فرمت تصویری webP چیست
در سال ۲۰۱۰ گوگل شرکتی به نام on2 technologies را خریداری کرد که این شرکت روی روشهای فشرده سازی فایلهای ویدئویی کار میکرد و در نهایت دو محصول با نامهای webM برای فشرده سازی ویدئو و webP برای فشرده سازی تصاویر را ارائه کرد.
فرمت وب پی در حقیقت مانند تصاویر JPG/PNG/GIF که سالهاست از آنها استفاده میکنیم کار میکند با این تفاوت که نوع فشرده سازی منحصر به فردی دارد و توانست از نظر میزان فشرده سازی جای فرمت PNG که قبل از آن مورد استفاده قرار میگرفت را بگیرد.
در این تصویر از ابزار page speed insight گوگل که برای بررسی سرعت سایت استفاده میشود مشاهده میکنید که خود گوگل پیشنهاد کرده از فرمتهای سبک مانند webP برای تصاویر سایت استفاده شود.
نکته: از نظر حجم فایلهای تصویری فرمت JPG که فرمت رایج دوربین های دیجیتال و تلفن همراه است در رتبه اول قرار دارد و تصاویر آن بسیار سنگین هستند و برای استفاده از سایت مناسب نیست و در مرحله بعد فرمت PNG است که تا حدی فشرده است و برای اینترنت مناسب است و در رتبه اول هم فرمت webP قرار دارد.
خصوصیات اصلی فرمت webP عبارت اند از :
- پشتیبانی از هر دو نوع Lossy و Lossless در فشرده سازی
- حجم تصاویر وب پی تا ۲۶% کمتر از PNG و تا ۳۴% کمتر از JPEG
- بخاطر این حجم کم سایتها سبکتر شده و سرعت لود بالایی دارند که امتیاز مهمی در سئو سایت است
تصویر webP چگونه فشرده سازی میشود
تصاویر از واحدهای کوچکی به نام پیکسل تشکیل میشوند و مجموع پیکسلها در کنار هم تشکیل یک تصویر را میدهند و هنگامی که قصد داریم تصاویر را فشرده سازی کنیم در واقع تعدادی از پیکسل های مابین رنگهای مشابه را حذف میکنیم به صورتی که در کیفیت تصویر نهایی تاثیر منفی نداشته باشد.
برای مثال به این تصاویر دقت کنید
این دو تصویر دقیقا شبیه هم هستند با این تفاوت که سمت چپ با فرمت JPG و حجم ۱.۳ مگابایت است و تصویر سمت راست با فرمت webP و حجم ۴۳۰ کیلوبایت که تقریبا یک سوم تصویر اصلی است.
در حالت عادی هیچ تفاوتی بین این دو تصویر مشاهده نمیشود و تا زمانی که دو تصویر را زوم نکنید اصلا متوجه فرق آنها نمیشوید و این همان قدرت فشرده سازی تصاویر وب پی است.
چطور تصاویر سایت وردپرس را به webP تبدیل کنید
اگر به این فرمت تصویری علاقه مند شدید و قصد دارید تصاویر پرحجم سایت خود را با نسخه وب پی جابجا کنید میتوانید از روشهای زیر استفاده کنید
۱-تبدیل آنلاین تصاویر به webP : سایتهای زیادی مانند Squoosh.app وجود دارند که تصاویر عادی خود را در آن آپلود میکنید و در چند ثانیه نسخه فشرده شده webP آن را دانلود میکنید که البته این سایتها تنظیماتی هم دارند که اگر بخواهید میزان فشرده سازی تصاویر بیشتر شود میتوانید آن را تغییر دهید.(هرچه میزان فشرده سازی بیشتر شود، افت کیفیت در تصویر محسوس تر میشود)
۲-استفاده از نرم افزار گرافیکی برای تبدیل تصاویر به webP : نرم افزارهای گرافیکی مانند فتوشاپ و sketch توانایی ذخیره تصاویر با فرمت webP را دارند و میتوانید از این نرم افزارها برای آماده سازی تصاویر خود برای اینترنت استفاده کنید.
۳-استفاده از Node JS برای تبدیل تصاویر به webP : نود جی اس بسیار قدرتمند است و میتوان از پلاگین imagemin-webp در آن برای فشرده سازی تصاویر و تبدیل به فرمت webP استفاده کرد.
۴-استفاده از پلاگین وردپرس برای تبدیل تصاویر به webP : چند پلاگین بسیار خوب در وردپرس وجود دارد که بصورت اتوماتیک تمامی تصاویر سایت شما را به webP تبدیل میکند از جمله پلاگین های webP express و Imagify و webp converter for media و plus webp کافی است آنها را در سایت خود نصب و فعال سازی کنید.
از نظر من پلاگین webp express بهترین افزونه موجود در حال حاضر برای وردپرس است که میتواند بدون محدودیت تمامی تصاویر سایت شما را فشرده کند و امکانات فوق العاده ای در آن بصورت کاملا رایگان قرار داده شده است.
در دوره آموزشی افزایش سرعت سایت وردپرسی به صورت کامل نصب و تنظیمات این پلاگین آموزش داده شده است.
استفاده از webP چه مشکلاتی دارد
تنها مشکلی که استفاده از فرمت وب پی برای سایت شما ایجاد میکند این است که هنوز همه مرورگرها از آن پشتیبانی نمیکنند و برای مثال نسخه های قدیمیتر مرورگر سافاری در موبایلهای اپل از این فرمت تصویری پشتیبانی نمیکنند اما اکثر مرورگرهای به روز مانند گوگل کروم و فایرفاکس و اپرا و … به صورت کامل از webP پشتیبانی میکنند.
برای رفع این مشکل باید تنظیماتی در سایت خود انجام دهید که اگر کاربر با مرورگری وارد سایت شما شد که از فرمت webP پشتیبانی نمیکرد به او نسخه اصلی تصویر به صورت PNG یا JPG نمایش داده شود تا مشکلی در نمایش سایت نداشته باشید.
پلاگین webp express به صورت کامل از این راهکار پشتیبانی میکند و برای مرورگرهای قدیمی از تصاویر fallback استفاده میکند تا بتوانید با خیال راحت از webP در سایت خود استفاده کنید.
حال که با مزایای استفاده از webP در وردپرس آشنا شدید باید بدانید که استفاده از این فرمت باعث سبک تر شدن صفحات سایت شما میشود به خصوص اگر از تصاویر زیادی در سایت استفاده میکنید و این سبک شدن سایت باعث افزایش سرعت آن و بهبود تجربه کاربری سایت شما خواهد شد که به صورت مستقیم در سئو سایت تاثیر دارد.در حقیقت استفاده از تصاویر یکی از مهم ترین علت های کند شدن سایتها است و اکنون با استفاده از وب پی میتوان این مشکل را رفع کرد.
