در گزارش کندی سایت‌هایی که بررسی کرده‌ام، یک مظنون همیشه در سه رتبهٔ اول است: تصاویر. حتی وقتی هاست خوب است و قالب سبک، تصاویرِ چند‌مگابایتی می‌توانند LCP را به پنج ثانیه برسانند. خبر خوب اینکه بهینه‌سازی تصویر، یکی از کم‌هزینه‌ترین و اثرگذارترین اقدامات است؛ ولی انتخاب افزونهٔ درست و تنظیماتش، تفاوت بین «کمک» و «کمکِ نصفه» است. این مقاله، تجربهٔ من از کار با این دسته از افزونه‌ها را مرور می‌کند. پیش از شروع، اگر با مفاهیم پایه آشنا نیستید، افزونه وردپرس چیست و بهینه‌سازی سرعت سایت چیست را ببینید.

چرا تصویر، نیمی از کندی سایت است؟

تصاویر، بزرگ‌ترین بخشِ بایت‌های هر صفحه‌اند. یک عکس هدر با ۲ مگابایت حجم، به‌تنهایی از کل CSS و JS سایت سنگین‌تر است. دو نوع هزینه وجود دارد: یک — حجم فایل؛ عکسی که با دوربین گرفته شده و بدون فشرده‌سازی مستقیم آپلود شده، معمولاً پنج تا ده برابر حجم لازم را دارد. دو — ابعاد نادرست؛ عکسی که با ۳۰۰۰ پیکسل عرض آپلود شده و با CSS به ۳۰۰ پیکسل کوچک شده، روی موبایل، فایل کامل را دانلود می‌کند. بهینه‌سازی، هر دو را حل می‌کند. برای دیدن عمیق‌تر این موضوع، سئوی تصویر چیست و تأثیر تصاویر سنگین بر Core Web Vitals را ببینید.

پیش از خریدن هر افزونهٔ بهینه‌سازی، یک بار کتابخانهٔ تصاویر سایت خودتان را نگاه کنید. معمولاً سه فایلِ اول، بیشتر از تمام تنظیمات دیگر، روی LCP اثر می‌گذارند.

معیار انتخاب افزونه

پنج معیار: یک — توانایی تبدیل به WebP (و در آیندهٔ نزدیک AVIF). دو — فشرده‌سازی lossless یا lossy. سه — پردازش سمت سرور یا سرویس ابری (سرویس ابری روی هاست اشتراکی، فشار را کم می‌کند). چهار — بهینه‌سازی خودکار در لحظهٔ آپلود. پنج — گزینهٔ نگه‌داشتن نسخهٔ اصلی، در صورت نیاز به بازگردانی. توجه به یک نکته: پردازش تصویر در سرور، فشار قابل‌توجهی روی CPU وارد می‌کند. اگر هاست اشتراکی دارید، بهتر است فشرده‌سازی فله‌ای را در ساعت‌های کم‌ترافیک اجرا کنید — مدیریت مصرف در کاهش مصرف منابع هاست آمده است.

Smush

محبوب‌ترین افزونهٔ رایگان در این دسته. روی فشرده‌سازی lossless و lossy تمرکز دارد، لِیزی‌لود را نیز فعال می‌کند و حجم کتابخانه را نمایش می‌دهد. رایگانش برای اکثر سایت‌ها کافی است. نقطهٔ ضعف: نسخهٔ رایگان، محدودیت حجم فایل (حدود پنج مگابایت) دارد و WebP را هم در نسخهٔ رایگان پشتیبانی نمی‌کند یا محدود می‌کند. برای سایت‌های کوچک و متوسط، انتخاب اول من است. برای سایت‌های تصویر-محور با حجم بالا، به‌سراغ گزینه‌های زیر بروید.

Imagify

گزینهٔ محبوب در بازار ایران. سه سطح فشرده‌سازی (Normal، Aggressive، Ultra) با سهماه رایگانِ محدود، و تبدیل خودکار به WebP. پشتیبانی از CDN داخلی خودش و گزینهٔ backup نسخهٔ اصلی. نقطهٔ ضعفش: پس از مصرف سهمیهٔ رایگان، نسخهٔ پولی لازم است و در سایت‌های پرمحتوا، سهمیه سریع تمام می‌شود. تجربه‌ام: برای سایت‌های با ۱۰۰ تا ۵۰۰ تصویر، Imagify ارزش سهمیه‌اش را دارد. برای کتابخانه‌های حجیم‌تر، به گزینه‌های بعدی سر بزنید.

ShortPixel

انتخاب من برای سایت‌های حجیم. فشرده‌سازی lossy و glossy با کیفیت بسیار خوب، پشتیبانی از WebP و AVIF، و امکان بازیابی تصاویر اصلی. رابط ساده ولی حرفه‌ای. نقطهٔ ضعفش: مدل اعتباری (credit-based) است و در سایت‌های بزرگ، هزینهٔ سالانه محسوس می‌شود. اگر سایت شما فروشگاهی با هزاران محصول است، ShortPixel یکی از سه گزینهٔ اول من است. اگر تصاویر سایت کم‌حجم و کم‌تعدادند، Smush رایگان کافی است — تفکری هم‌راستا با همان منطقِ چند افزونه نصب کنیم.

EWWW Image Optimizer

گزینهٔ «ابزارِ فنی». تمام پردازش را در سرورِ خودتان انجام می‌دهد (بدون سرویس ابری)، پشتیبانی از WebP و AVIF، و قابلیت بهینه‌سازی تصاویر موجود در کتابخانه. مزیتش: استقلال از سرویس بیرونی و عدم نیاز به سهمیه. نقطهٔ ضعفش: برای نصب، به کتابخانه‌های سطح سرور (مثل cwebp) نیاز دارد که روی بعضی هاست‌های اشتراکی نصب نیستند. برای تیم‌های فنی با VPS، انتخاب درجه‌یک است. برای کاربران عادی روی هاست اشتراکی، ممکن است نصبش دردسر داشته باشد.

تبدیل به WebP و AVIF

WebP، فرمت مدرن گوگل است که در مقایسه با JPEG، ۲۵ تا ۳۵ درصد حجم کمتر با همان کیفیت دارد. AVIF، نسل جدیدتر است که فشرده‌سازی بهتری می‌دهد ولی پشتیبانی مرورگرهای قدیمی کمتر است. توصیهٔ من: WebP را فعال کنید، AVIF را با احتیاط. سه نکتهٔ فنی: یک — پس از فعال‌سازی WebP، باید قالب یا افزونهٔ لِیزی‌لود از آن استفاده کند. اگر قالب شما به‌طور خودکار WebP را serve نمی‌کند، باید از طریق .htaccess یا یک افزونهٔ مکمل تنظیم شود. دو — نسخهٔ اصلی را نگه دارید؛ اگر روزی خواستید قالب را عوض کنید یا سایز جدیدی نیاز داشتید، به آن نیاز پیدا می‌کنید. سه — پیش از فشرده‌سازی فله‌ای، از یک بکاپ مطمئن شوید. راهنمای بکاپ در افزونه‌های بکاپ. مقایسهٔ فنی فرمت‌ها در بهترین فرمت تصویر وب و WebP یا JPEG آمده است.

تنظیمات پس از نصب

افزونهٔ بهینه‌سازی که درست نصب شود ولی ناقص تنظیم، نصفِ فایده‌اش را می‌دهد. شش گام:

  1. فشرده‌سازی خودکار در لحظهٔ آپلود را فعال کنید.
  2. تبدیل خودکار WebP را روشن کنید (اگر قالب و سرور پشتیبانی می‌کنند).
  3. نگه‌داشتن نسخهٔ اصلی را فعال کنید (برای امنیت آینده).
  4. فشرده‌سازی فله‌ای را در ساعت‌های کم‌ترافیک اجرا کنید.
  5. لِیزی‌لود را برای تصاویرِ زیر دیدِ اول روشن کنید — نه برای عنصر LCP.
  6. ابعاد درست srcset را در قالب چک کنید. بعضی قالب‌ها سایزهای اضافه تولید می‌کنند که فایده‌ای ندارند.

نکتهٔ آخر، مهم‌ترین است: حتی بهترین افزونهٔ بهینه‌سازی، اگر قالب شما سایزبندی درستی برای تصاویر نداشته باشد، نصف کارش هدر می‌رود. معیارهای قالب ریسپانسیو را جدی بگیرید. و برای عکس‌های محصول که LCP را می‌سازند، Core Web Vitals را مرجع بگیرید.

اشتباهات رایج

  • نصب دو افزونهٔ بهینه‌سازی هم‌زمان: تعارض و فشرده‌سازی مضاعف که کیفیت را خراب می‌کند. مرز سالم در افزونه‌های ضروری وردپرس.
  • فشرده‌سازی فله‌ای در ساعت شلوغی: کندی سایت در ساعات اوج.
  • نادیده‌گرفتن بکاپ پیش از فشرده‌سازی فله: اگر چیزی خراب شد، راه بازگشت نیست.
  • حذف نسخهٔ اصلی: اگر روزی قالب را عوض کنید، به نسخهٔ اصلی نیاز دارید.
  • نادیده‌گرفتن ابعاد srcset: فشرده‌سازی، نصف کار است؛ سایزبندی، نصف دیگر.
  • لِیزی‌لود روی تصویر LCP: اشتباه رایجی که LCP را کند می‌کند — تفصیلش در سئوی تصویر.

جمع‌بندی

انتخاب افزونهٔ بهینه‌سازی تصویر در سه جمله: برای سایت‌های کوچک و متوسط، Smush یا Imagify؛ برای کتابخانه‌های حجیم، ShortPixel؛ برای تیم‌های فنی روی VPS، EWWW. در همهٔ حالات، تنظیمات را کامل اجرا کنید — نه فقط نصب. اگر امروز فقط یک کار می‌کنید: ده تصویر پربازدید سایت‌تان را از کتابخانه باز کنید و اندازه‌شان را ببینید. اگر بیشتر از ۲۰۰ کیلوبایت‌اند، بهینه‌سازی مؤثر واقعی است. تجربهٔ خودتان از یک افزونهٔ بهینه‌سازی که عالی کار کرد یا یک باگ رفتاری داشت، در دیدگاه‌ها ارزشمند است. 🖼️