۱_فرمت مناسب

به صورت خلاصه، توصیه می‌کنیم که برای عکس‌ها یا تصاویر بزرگ‌تر JPEG را انتخاب کنید. چون که از نظر رنگ‌ها و وضوح با اندازه فایل نتایج نسبتاً خوبی به شما می‌دهد. اگر می‌خواهید شفافیت پس زمینه را در تصویر خود حفظ کنید، از PNG استفاده کنید. همچنین شما میتوانید از WebP به جای JPEG و PNG استفاده کنید.

۲_فشرده سازی

به صورت یک قانون جامع هرچه اندازه تصویر کوچکتر باشد (به بایت) عالی است.

آپلود تصاویر بزرگ بیشتر طول می‌کشد و این می‌تواند تأثیر منفی بر تجربه کاربری به خصوص برای کاربران تلفن همراه داشته باشد.

یک راه حل خوب این است که از ابزارهای بهینه سازی تصویر استفاده کنید که می‌توانند حجم فایل تصویر را بدون از دست دادن کیفیت کاهش دهند این کار به نفع وبسایت شما است و سرعت سایت شمارا زیاد میکند.

به عنوان مثال میتوانید برای تمام تصاویری که در پست‌ها استفاده می‌کنید، ابتدا آنها را در Pixelmator باز نموده (مشابه فتوشاپ)، اندازه آنها را تغییر اده و سپس آنها را با فرمت png یا jpg آپلود نمایید.

همچنین میتوانید قبل از آپلود تصاویر در وب سایت خود، اندازه فایل آنها را با imageoptim بهینه نمایید. این کار حجم فایل را بدون تاثیر بر کیفیت کاهش می‌دهد.

علاوه بر imageoptim یکی دیگر از ابزارهای عالی آنلاین برای این کار، کمپرسور تصویر (image compressor) است.

۳_ایجاد تصاویر جدید و یکتا

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

هرچه تصاویر اصلی و یکتای بیشتری داشته باشید، تجربه بهتری برای کاربر و شانس شما برای رتبه بندی در جستجوهای مرتبط بهتر است.

۴_کپی رایت ممنوع

صرف نظر از فایل‌های تصویری که برای استفاده انتخاب می‌کنید، مطمئن شوید که هیچ تضادی با حق نسخه برداری وجود نداشته باشد.

بر اساس قانون حق نسخه‌برداری هزاره دیجیتال (DMCA)، در صورت نقض هرگونه مشکل حق نسخه‌برداری ممکن است اخطاریه برای شما صادر شود. اگر صاحب یک محتوا محتوای خود را در وب سایت شما ببیند، می‌تواند یک دستور حذف از طریق DMCA صادر کند که شما باید از آن پیروی کنید.

۵_ابعاد تصاویر سایت را مشخص کنید

اگر از AMP یا PWA استفاده می‌کنید، باید ابعاد تصویر خود را در کد منبع مشخص کنید. حتی اگر از هیچکدام از این ابزارها استفاده نمی‌کنید، هنوز هم بهترین روش، تعریف عرض و ارتفاع است. چرا که تجربه کاربری بهتری را فراهم می‌کند. به علاوه، به مرورگرها اجازه می‌دهد تا قبل از بارگیری CSS، تصویر را اندازه بگیرند. این کار از پرش صفحه هنگام بارگیری جلوگیری می‌کند.

ویژگی‌های ابعاد تصویر نیز برای جلوگیری از مسائل تغییر چیدمان تجمعی (CLS) که می‌توانند در بهینه‌سازی Core Web Vitals شما تداخل ایجاد کنند، مهم هستند.

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