سئو تصاویر: راهنمای عملی از Alt Text تا WebP و CDN

سئو تصاویر مجموعه اقداماتی است که تصویرهای یک صفحه را هم برای موتور جستجو قابل‌فهم و هم برای کاربر سریع می‌کند: نام فایل توصیفی، Alt Text دقیق، فرمت مدرن مثل WebP یا AVIF، ابعاد درست، تصاویر واکنش‌گرا، مدیریت Lazy Loading و تحویل از CDN. نتیجه‌اش بهبود LCP و ورود ترافیک از گوگل تصاویر است. در بیشتر پروژه‌هایی که تیم جریان دیجیتال آنالیز می‌کند، تصاویر بزرگ‌ترین سهم را در حجم صفحه دارند — معمولاً بیش از نیمی از بایت‌های دانلودی یک صفحه وردپرسی. یعنی قبل از اینکه سراغ مینیفای کردن CSS و حذف اسکریپت‌ها بروید، بیشترین بازده را از بهینه‌سازی تصاویر می‌گیرید. این مقاله همان مسیر را قدم‌به‌قدم و با کد اجرایی توضیح می‌دهد.

سئو تصاویر چیست و چرا روی رتبه اثر می‌گذارد؟

سئو تصاویر دو مسیر جداگانه دارد که اغلب با هم اشتباه گرفته می‌شوند و هر کدام اقدام متفاوتی می‌خواهند.

مسیر اول دیده‌شدن در گوگل تصاویر است. اینجا گوگل باید بفهمد تصویر شما چیست؛ و چون خودِ فایل تصویری متنی ندارد، از سیگنال‌های اطرافش استفاده می‌کند: نام فایل، Alt Text، عنوان و متنِ نزدیک به تصویر، کپشن، و ساختار داده. تصویری که در صفحه‌ای بی‌ربط و با نام IMG_2049.jpg نشسته، عملاً برای گوگل نامرئی است.

مسیر دوم اثر تصاویر بر سئوی کل صفحه از راه سرعت است. معیار LCP در Core Web Vitals تقریباً همیشه یک تصویر است: بنر هدر، تصویر شاخص مقاله یا عکس اصلی محصول. آستانه‌ی «خوب» برای LCP، ۲.۵ ثانیه است. اگر تصویر LCP شما ۸۰۰ کیلوبایت JPEG باشد، صفحه روی موبایل و اینترنت ایران این آستانه را رد نمی‌کند و این روی تجربه‌ی کاربر و در نتیجه رتبه اثر می‌گذارد.

نکته‌ای که باید صادقانه گفت: ادعاهای رایجی مثل «۲۶ درصد جستجوها تصویری است» در فضای فارسی زیاد تکرار می‌شود اما منبع رسمی و به‌روزی ندارد. سهم گوگل تصاویر از ترافیک شما کاملاً به صنعت‌تان بستگی دارد — برای فروشگاه مبلمان، آموزش آشپزی یا کلینیک زیبایی می‌تواند بسیار زیاد باشد و برای یک سایت خدمات B2B تقریباً هیچ. به‌جای تکیه بر آمار عمومی، در Search Console بخش Performance را روی نوع جستجوی Image فیلتر کنید تا عدد واقعی خودتان را ببینید.

انتخاب فرمت تصویر: WebP، AVIF، JPEG، PNG و SVG

انتخاب فرمت، بزرگ‌ترین برد سریع در سئو تصاویر است. جدول زیر تصمیم را ساده می‌کند:

توصیه عملی ما: AVIF به‌عنوان گزینه اول، WebP به‌عنوان فالبک، و JPEG به‌عنوان فالبکِ فالبک. این کار با تگ <picture> انجام می‌شود و مرورگر خودش اولین فرمتی را که می‌فهمد دانلود می‌کند:

<picture>
  <source srcset="/img/seo-tasavir-jaryan.avif" type="image/avif">
  <source srcset="/img/seo-tasavir-jaryan.webp" type="image/webp">
  <img src="/img/seo-tasavir-jaryan.jpg"
       alt="مقایسه حجم فایل تصویر در فرمت‌های AVIF، WebP و JPEG"
       width="1200" height="675" loading="lazy" decoding="async">
</picture>

لوگو و آیکون‌ها را هرگز PNG نگذارید. یک SVG معمولاً زیر ۵ کیلوبایت است، در هر رزولوشنی تیز می‌ماند و نیازی به نسخه‌های ۲x و ۳x ندارد.

نام‌گذاری فایل تصویر — و تکلیف نام‌های فارسی

گوگل نام فایل را می‌خواند و از آن برای فهم موضوع تصویر استفاده می‌کند. اما یک سؤال مشخص در پروژه‌های ایرانی همیشه پیش می‌آید: نام فایل فارسی بنویسیم یا انگلیسی؟

پاسخ ما: انگلیسی با حروف کوچک و خط تیره. نام فایل فارسی در URL به شکل درصدی (percent-encoded) درمی‌آید — یعنی تصویر-سئو.webp در واقع به %D8%AA%D8%B5%D9%88%DB%8C%D8%B1... تبدیل می‌شود. این آدرس هنگام کپی‌شدن در چت، ایمیل یا CDN شکسته می‌شود، در برخی سرورها به خطای ۴۰۴ می‌خورد و خوانایی صفرش هیچ مزیت سئویی را جبران نمی‌کند. کلمه کلیدی فارسی را در Alt Text و کپشن بگذارید، نه در نام فایل.

• نادرست: IMG_20260101.jpg ، Screenshot 2026-09-05 at 11.04.png

• نادرست: سئو-تصاویر-وردپرس.jpg (encode می‌شود)

• درست: image-seo-webp-comparison-jaryan.webp

سه تا پنج کلمه کافی است. نام فایل جای چیدن ده کلمه کلیدی پشت سر هم نیست؛ آن کار اسپم محسوب می‌شود.

نوشتن Alt Text مؤثر

Alt Text توصیف متنی تصویر است. سه کار هم‌زمان می‌کند: به گوگل می‌گوید تصویر چیست، برای کاربر صفحه‌خوان (screen reader) خوانده می‌شود، و اگر تصویر لود نشد جای آن نمایش داده می‌شود. معیار درست نوشتنش هم ساده است: اگر این تصویر را برای کسی که نمی‌بیندش توصیف می‌کردید، چه می‌گفتید؟

چند قاعده کاربردی: حدود ۱۲۵ کاراکتر سقف منطقی است (صفحه‌خوان‌ها معمولاً بیشتر از این را قطع می‌کنند)؛ عبارت «تصویری از» یا «عکس» را ننویسید چون صفحه‌خوان خودش اعلام می‌کند که این یک تصویر است؛ کلمه کلیدی را فقط وقتی بیاورید که واقعاً تصویر را توصیف می‌کند؛ و برای تصاویر صرفاً تزئینی (خط جداکننده، بک‌گراند، آیکون تکراری) از alt="" خالی استفاده کنید تا صفحه‌خوان از رویش رد شود. حذف کردن کامل صفت alt با گذاشتن alt="" فرق دارد و دومی درست است.

اگر تصویر داخل لینک است، Alt Text نقش متن لنگر (anchor text) را بازی می‌کند — پس مقصد لینک را توصیف کنید، نه ظاهر تصویر را.

ابعاد، فشرده‌سازی و بودجه حجمی

رایج‌ترین اشتباه در سایت‌های وردپرسی این است که یک عکس ۴۰۰۰ پیکسلی مستقیم از دوربین آپلود می‌شود و CSS آن را به ۸۰۰ پیکسل کوچک می‌کند. مرورگر همچنان کل فایل را دانلود کرده است. ابعاد را قبل از آپلود درست کنید:

• بنر تمام‌عرض هدر: حداکثر ۱۹۲۰ پیکسل عرض

• تصویر شاخص و تصاویر داخل مقاله: ۱۲۰۰ تا ۱۶۰۰ پیکسل عرض

• تصویر محصول در لیست: ۶۰۰ تا ۸۰۰ پیکسل

• تصاویر آواتار و آیکون: دقیقاً به اندازه نمایش، در SVG یا WebP

برای فشرده‌سازی، کیفیت ۷۵ تا ۸۵ درصد در عمل از نظر چشم انسان با ۱۰۰ درصد تفاوتی ندارد ولی حجم را چند برابر کم می‌کند. متادیتای EXIF (مدل دوربین، مختصات GPS، پروفایل رنگی سنگین) را هم حذف کنید — هم چند ده کیلوبایت صرفه‌جویی است و هم از افشای ناخواسته موقعیت مکانی جلوگیری می‌کند.

یک بودجه حجمی مشخص برای خودتان تعریف کنید و به آن پایبند بمانید: تصویر شاخص زیر ۱۵۰ کیلوبایت، تصاویر داخل متن زیر ۱۰۰ کیلوبایت، آیکون‌ها زیر ۱۰ کیلوبایت. بودجه‌ای که نوشته نشود رعایت هم نمی‌شود.

ابزارهایی که در پروژه‌ها استفاده می‌کنیم: Squoosh برای کار دستی و مقایسه چشمی خروجی فرمت‌ها، ShortPixel یا Imagify برای تبدیل خودکار انبوه کتابخانه رسانه وردپرس، و cwebp / avifenc در خط فرمان برای پروژه‌هایی که بیلد اتوماتیک دارند.

تصاویر واکنش‌گرا با srcset و sizes

کاربر موبایل با صفحه ۳۹۰ پیکسلی نباید همان فایل ۱۶۰۰ پیکسلی دسکتاپ را دانلود کند. راه‌حل استاندارد، دادن چند نسخه به مرورگر و اجازه انتخاب به اوست:

<img src="/img/image-seo-800.webp"
     srcset="/img/image-seo-400.webp 400w,
             /img/image-seo-800.webp 800w,
             /img/image-seo-1600.webp 1600w"
     sizes="(max-width: 768px) 100vw, 800px"
     alt="مراحل بهینه‌سازی تصاویر برای سئو در وردپرس"
     width="1600" height="900" loading="lazy" decoding="async">

دو نکته که معمولاً فراموش می‌شود. اول، sizes باید اندازه واقعی نمایش تصویر در لِی‌اوت را بگوید نه اندازه فایل؛ اگر اشتباه بنویسید مرورگر نسخه بزرگ‌تر از نیاز را برمی‌دارد و کل زحمت هدر می‌رود. دوم، همیشه width و height را بنویسید. مرورگر از نسبت این دو، فضای تصویر را از قبل رزرو می‌کند و از پرش لِی‌اوت (CLS) جلوگیری می‌شود — یکی از سه معیار Core Web Vitals.

Lazy Loading و fetchpriority: کجا استفاده کنیم، کجا نه

ویژگی loading="lazy" باعث می‌شود مرورگر تصویر را فقط وقتی به آن نزدیک شدیم دانلود کند. این ویژگی امروز بومیِ مرورگر است و نیازی به کتابخانه جاوااسکریپت ندارد.

اما اینجا یک تله وجود دارد که در بسیاری از سایت‌های ایرانی دیده‌ایم: افزونه‌های بهینه‌سازی، Lazy Loading را روی همه تصاویر از جمله تصویر LCP فعال می‌کنند. نتیجه معکوس است — مرورگر دانلود مهم‌ترین تصویر صفحه را عقب می‌اندازد و LCP بدتر می‌شود. قاعده درست:

• تصویر بالای صفحه (Above the Fold) و به‌خصوص تصویر LCP: بدون loading="lazy"، و با fetchpriority="high"

• همه تصاویر پایین‌تر: loading="lazy" به‌همراه decoding="async"

<!-- تصویر LCP در هدر مقاله -->
<img src="/img/hero.avif" alt="..." width="1600" height="900" fetchpriority="high">

برای پیدا کردن اینکه کدام تصویر LCP شماست، در PageSpeed Insights بخش «LCP element» را ببینید. اگر آن عنصر loading="lazy" دارد، همین یک اصلاح می‌تواند چند دهم ثانیه از LCP کم کند.

CDN تصاویر و ملاحظات ایران

CDN فایل‌های شما را روی سرورهایی نزدیک به کاربر نگه می‌دارد تا مسیر شبکه کوتاه شود. برای سایتی که مخاطبش داخل ایران است، این انتخاب حساس‌تر از حالت عادی است: CDNهای بین‌المللی ممکن است برای کاربر داخلی کندتر از سرور داخلی عمل کنند یا محدودیت دسترسی داشته باشند. در پروژه‌های داخلی معمولاً سرویس‌های ابری ایرانی نتیجه پایدارتری می‌دهند، و اگر مخاطب دوگانه (داخل و خارج) دارید، ترکیب هر دو با روتینگ جغرافیایی منطقی‌تر است.

مزیت جدی CDNهای تصویری مدرن این است که تبدیل فرمت را هم خودشان انجام می‌دهند: یک JPEG آپلود می‌کنید و CDN بر اساس هدر Accept مرورگر، به AVIF یا WebP سرو می‌کند. کنار آن دو تنظیم را فراموش نکنید: هدر Cache-Control با عمر طولانی (مثلاً یک سال) برای فایل‌های نسخه‌دار، و فعال بودن HTTP/2 یا HTTP/3.

اسکیمای ImageObject برای تصاویر

داده ساختاریافته به گوگل کمک می‌کند تصویر را در Rich Results و گوگل تصاویر بهتر نمایش دهد و اطلاعات مالکیت و لایسنس را بفهمد. برای تصویر شاخص مقاله معمولاً کافی است image را داخل اسکیمای Article پر کنید، اما اگر تصویر خودش دارایی مستقلی است (اینفوگرافیک، عکس محصول اختصاصی) اسکیمای ImageObject جدا ارزش دارد:

{
  "@context": "https://schema.org",
  "@type": "ImageObject",
  "contentUrl": "https://jaryandigital.com/img/image-seo-checklist-jaryan.webp",
  "caption": "چک‌لیست بهینه‌سازی تصاویر برای سئو",
  "creditText": "جریان دیجیتال",
  "creator": { "@type": "Organization", "name": "جریان دیجیتال" },
  "license": "https://jaryandigital.com/license",
  "acquireLicensePage": "https://jaryandigital.com/contact"
}

پس از پیاده‌سازی، حتماً خروجی را در Rich Results Test گوگل تست کنید.

سئو تصاویر در وردپرس: کارهای عملی

اگر روی وردپرس هستید، این ترتیب اجرا بیشترین نتیجه را می‌دهد:

1. در تنظیمات رسانه، اندازه‌های تصویر بلااستفاده را غیرفعال کنید؛ هر اندازه اضافی یعنی فایل‌های بیشتر روی هاست.

2. یک افزونه تبدیل فرمت (ShortPixel، Imagify یا معادل) نصب و کل کتابخانه رسانه را یک‌بار به WebP/AVIF تبدیل کنید.

3. Lazy Loading افزونه را طوری تنظیم کنید که تصویر شاخص و اسلایدر هدر را استثنا کند.

4. در فرآیند تولید محتوا، پر کردن Alt Text را اجباری کنید. کتابخانه‌ی رسانه‌ی اکثر سایت‌های ایرانی صدها تصویر بدون alt دارد.

5. سایت‌مپ تصاویر را فعال کنید (Rank Math و Yoast هر دو این گزینه را دارند) تا گوگل تصاویر را سریع‌تر کشف کند.

6. بعد از هر تغییر، صفحه را در PageSpeed Insights بسنجید و عدد LCP قبل و بعد را ثبت کنید.

اشتباهات رایجی که در آنالیزها می‌بینیم

• Lazy Loading روی تصویر LCP. شایع‌ترین اشتباه، و مستقیماً به سرعت ضربه می‌زند.

• نبود width و height. باعث پرش لِی‌اوت و افزایش CLS می‌شود.

• تصاویر استوک تکراری. همان عکس در صدها سایت دیگر هم هست؛ شانس نمایش در گوگل تصاویر تقریباً صفر است. عکس واقعی از تیم، محیط کار و خروجی پروژه هم‌زمان به سئو و به E-E-A-T کمک می‌کند.

• Alt Text کپی‌شده روی همه تصاویر یک صفحه. ده تصویر با یک alt یکسان، سیگنال اسپم است.

• اسکرین‌شات متن به‌جای متن. گوگل متنِ داخل تصویر را برای رتبه‌بندی نمی‌خواند؛ جدول و کد را به‌صورت HTML بنویسید نه عکس.

• تغییر ابعاد فقط با CSS. فایل اصلی همچنان کامل دانلود می‌شود.

چک‌لیست نهایی سئو تصاویر

1. ابعاد تصویر قبل از آپلود به اندازه واقعی نمایش کوچک شده است.

2. فرمت AVIF یا WebP با فالبک مناسب سرو می‌شود.

3. حجم تصویر داخل متن زیر ۱۰۰ کیلوبایت است.

4. نام فایل انگلیسی، کوچک و توصیفی با خط تیره است.

5. Alt Text توصیفی و طبیعی نوشته شده و تصاویر تزئینی alt="" دارند.

6. width و height روی همه تگ‌های img هست.

7. srcset و sizes برای تصاویر مهم تعریف شده است.

8. تصویر LCP بدون lazy و با fetchpriority="high" است.

9. بقیه تصاویر loading="lazy" و decoding="async" دارند.

10. متادیتای EXIF حذف شده است.

11. تصاویر از CDN با کش طولانی سرو می‌شوند.

12. اسکیمای تصویر پیاده و در Rich Results Test تأیید شده است.

13. سایت‌مپ تصاویر فعال و به Search Console معرفی شده است.

14. تصاویر اختصاصی‌اند، نه استوک.

15. عدد LCP قبل و بعد از تغییرات اندازه‌گیری و ثبت شده است.

پرسش‌های متداول درباره سئو تصاویر

Alt Text چند کاراکتر باشد؟

حدود ۱۰۰ تا ۱۲۵ کاراکتر بازه‌ی مناسبی است. صفحه‌خوان‌ها معمولاً متن‌های طولانی‌تر را قطع می‌کنند و گوگل هم از توصیف بیش‌ازحد طولانی سیگنال بهتری نمی‌گیرد. یک جمله‌ی دقیق که تصویر را توصیف کند کافی است.

نام فایل تصویر را فارسی بنویسم یا انگلیسی؟

انگلیسی. نام فایل فارسی در URL به شکل percent-encoded درمی‌آید، هنگام اشتراک‌گذاری می‌شکند و در بعضی سرورها و CDNها خطا می‌دهد. کلمه کلیدی فارسی را در Alt Text، کپشن و متن اطراف تصویر بیاورید که همان‌جا هم اثر سئویی دارد.

AVIF بهتر است یا WebP؟

AVIF حجم کمتری می‌دهد (حدود ۲۰ تا ۵۰ درصد کمتر از WebP) و در ۲۰۲۶ حدود ۹۴ درصد مرورگرها آن را پشتیبانی می‌کنند. بهترین کار استفاده از AVIF به‌عنوان گزینه اول با فالبک WebP در تگ <picture> است تا هم حجم کم شود و هم هیچ کاربری تصویر خالی نبیند.

چرا با وجود فعال بودن Lazy Loading سرعت سایتم بهتر نشد؟

محتمل‌ترین دلیل این است که Lazy Loading روی تصویر LCP هم فعال شده و دانلود مهم‌ترین تصویر صفحه را عقب انداخته است. در PageSpeed Insights عنصر LCP را پیدا کنید و آن یک تصویر را از Lazy Loading مستثنا و با fetchpriority="high" علامت‌گذاری کنید.

آیا استفاده از تصاویر استوک به سئو ضرر می‌زند؟

جریمه مستقیم ندارد، اما فایده هم ندارد. تصویر استوک در هزاران سایت دیگر تکرار شده و شانس نمایشش در گوگل تصاویر عملاً صفر است. عکس اختصاصی از تیم، فرایند کار و نتیجه پروژه هم ترافیک تصویری می‌آورد و هم سیگنال تجربه واقعی (Experience) در E-E-A-T است.

سایت‌مپ تصاویر لازم است؟

برای سایت‌های کوچک ضروری نیست، اما برای فروشگاه‌ها و سایت‌های پرتصویر بله. سایت‌مپ تصاویر کشف تصاویری را که با جاوااسکریپت لود می‌شوند یا در صفحات عمیق سایت هستند برای گوگل ساده‌تر می‌کند. در Rank Math و Yoast با یک کلیک فعال می‌شود.

جمع‌بندی

سئو تصاویر بازدهی‌اش نسبت به زحمتش بالاست، چون بیشترش یک‌بار تنظیم می‌شود و بعد خودکار اجرا می‌شود: فرمت مدرن، ابعاد درست، Alt Text واقعی، تفکیک تصویر LCP از بقیه، و تحویل از CDN. اگر فقط سه کار از این مقاله را انجام بدهید، این سه تا را انتخاب کنید: تبدیل کتابخانه رسانه به WebP یا AVIF، خارج کردن تصویر LCP از Lazy Loading، و افزودن width و height به همه تصاویر.

برای یک بررسی سریع و رایگان، آدرس صفحه را در اسکنر AEO جریان دیجیتال بگذارید؛ علاوه بر سئوی تکنیکال، وضعیت تصاویر و داده‌ی ساختاریافته‌ی صفحه را هم گزارش می‌دهد.

اگر می‌خواهید وضعیت فعلی تصاویر و سرعت سایتتان را دقیق بدانید، تیم جریان دیجیتال آنالیز سئوی فنی سایت شما را انجام می‌دهد و گزارش اقدامات اولویت‌بندی‌شده تحویل می‌دهد. برای مشاوره رایگان با ما تماس بگیرید.