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

بهینه‌سازی تصاویر محصول — سرعت بدون افت کیفیت بصری

تصاویر محصول معمولاً ۶۰–۷۰٪ وزن صفحه فروشگاه را تشکیل می‌دهند. استاندارد: WebP/AVIF، srcset responsive، hero زیر ۱۵۰KB، thumbnail زیر ۳۰KB، width/height explicit برای CLS، lazy load برای below-fold. بدون این‌ها LCP و CLS هر دو Poor می‌مانند.

7 دقیقه مطالعهبروزرسانی: ۷ تیر ۱۴۰۵

بودجه حجم تصویر

نوعحداکثر پیشنهادیفرمت
تصویر اصلی محصول۱۲۰–۱۸۰KBWebP
thumbnail لیست۲۰–۴۰KBWebP
بنر hero۱۰۰–۱۵۰KBWebP/AVIF
zoom با کیفیتlazy on demandWebP

workflow تولید تصویر

  1. 1

    استاندارد upload

    حداکثر ۲۰۰۰px عرض — compression در pipeline.

  2. 2

    تولید variants

    ۳ سایز: thumb، card، detail.

  3. 3

    deploy CDN

    cache طولانی + auto format.

  4. 4

    audit ماهانه

    PageSpeed top 20 URL محصول.

سوالات متداول

خیر — تصویر LCP (اولین visible) باید eager + preload باشد.

مطالب مرتبط