کدگذاری کارآمد تصاویر

بخش فرصت‌ها در گزارش فانوس دریایی شما، تمام تصاویر بهینه‌نشده را با صرفه‌جویی بالقوه در کیلوبایت (KiB) فهرست می‌کند. این تصاویر را بهینه کنید تا صفحه سریعتر بارگذاری شود و داده کمتری مصرف کند:

تصویری از ممیزی تصاویر فانوس دریایی با کدگذاری کارآمد

چگونه Lighthouse تصاویر را به عنوان قابل بهینه سازی پرچم گذاری می کند

Lighthouse تمام تصاویر JPEG یا BMP را در صفحه جمع آوری می کند، سطح فشرده سازی هر تصویر را روی 85 تنظیم می کند و سپس نسخه اصلی را با نسخه فشرده مقایسه می کند. اگر صرفه جویی بالقوه 4KiB یا بیشتر باشد، Lighthouse تصویر را به عنوان قابل بهینه نشان می دهد.

نحوه بهینه سازی تصاویر

برای بهینه سازی تصاویر می توانید مراحل زیادی را انجام دهید، از جمله:

بهینه سازی تصاویر با استفاده از ابزارهای رابط کاربری گرافیکی

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

Squoosh یک گزینه دیگر است. Squoosh توسط تیم Google Web DevRel نگهداری می شود.

راهنمایی مخصوص پشته

دروپال

استفاده از ماژولی را در نظر بگیرید که به طور خودکار تصاویر آپلود شده از طریق سایت را با حفظ کیفیت بهینه سازی و کاهش می دهد. همچنین، مطمئن شوید که از سبک‌های تصویر واکنش‌گرای بومی ارائه‌شده از Drupal برای همه تصاویر ارائه‌شده در سایت استفاده می‌کنید.

جوملا

استفاده از یک پلاگین بهینه سازی تصویر را در نظر بگیرید که تصاویر شما را با حفظ کیفیت فشرده می کند.

مجنتو

استفاده از یک افزونه Magento شخص ثالث را در نظر بگیرید که تصاویر را بهینه می کند .

وردپرس

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

منابع