متن جایگزین تصویر (Alt Text): راهنمای سئو و فروش بیشتر

TL;DR — متن جایگزین تصویر رو جای «تصویر» بنویس، نه توضیح تبلیغاتی؛ هم سئو می‌بره جلو، هم صفحه برای کاربر نابینا قابل استفاده می‌شه.

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

توی این مقاله کوتاه، دقیقاً می‌گم alt چیه، چه چیزی نیست، و چطور در چند دقیقه برای کل سایتت درستش کنی.

alt دقیقاً چیکار می‌کنه؟

alt صفتی روی تگ img هست که می‌گه «اگه این تصویر لود نشد یا کاربر نتونه ببینَدش، این متن جایگزینشه». سه نفر ازش سود می‌برن:

• صفحه‌خوان‌ها: تنها راه فهمیدن محتوای تصویری برای کاربر کور یا کم‌بینا.
• موتورهای جستجو: گوگل از alt برای فهم موضوع تصویر و صفحه استفاده می‌کنه، مخصوصاً در Image Search.
• کاربر روی موبایل با اینترنت ضعیف: وقتی عکس لود نمی‌شه، متن alt جای خالی رو پر می‌کنه و صفحه به‌هم‌ریخته دیده نمی‌شه.

نکتهٔ مهم: alt روی سئوی کلمات کلیدی اثر مستقیم و تضمینی نداره، ولی کلمهٔ کلیدی رو در جایی طبیعی و در توضیحات تصویر به کار بردن، به گوگل سیگنال موضوع صفحه می‌ده.

چی بنویسیم و چی ننویسیم؟

قانون ساده‌اش اینه: توصیف کن، تبلیغ نکن.

| ❌ اشتباه | ✅ درست | چرا | | --- | --- | --- | | تصویر | کفش رانی مردانه مدل الیاس سفارش ۳۹۰۰۰۰ | توصیف واقعیت | | خرید ارزان کفش کفش کفش | کفش رانی مردانه مدل الیاس | تکرار مصنوعی = اسپم | | لینک خرید کفش ارزان | کفش رانی مردانه مدل الیاس، زیره تخت | CTA جای alt نیست | | تکرار کلیدواژه ۵ بار | ۸ تا ۱۲ کلمه توصیف ساده | خوانایی و اعتماد |

قانون ۱۰۰ کلمه: alt رو زیر ۱۰۰ تا ۱۲۵ کاراکتر نگه دار، چون در عمل بیشتر از این کسی نمی‌خونه.

و چند قاعدهٔ فنی که خیلی‌ها یادشون می‌ره:

• تصویر تزئینی (خط جداکننده، آیکون، فلش اسلایدر) → alt="" خالی. این یعنی «این تصویر هیچ اطلاعات اضافه‌ای نداره»، و برای صفحه‌خوان بهتر از توضیح الکیه.
• عکس محصول → همیشه alt داشته باش، حتی اگه متن کنار عکس همون رو تکرار کنه. لینک تصویر رو به صفحهٔ محصول وصل کن و alt رو بذار روی لینک، نه خود عکس؛ اگه دو تا لینک با یک اسم داشته باشی، دسترسی‌پذیری خراب می‌شه.
• لوگو → اسم برند، مثلاً لوگوی تی‌شاپ.
• alt هیچ‌وقت نباید کلمهٔ «تصویر» یا «عکس» رو با «alt» تکرار کنه مگر وقتی واقعاً داری یه عکسِ از یه عکس رو توصیف می‌کنی.

نمونهٔ واقعی برای یه محصول:

یه نمونهٔ واقعی برای یه محصول: تصویر داخل figure قرار می‌گیره، alt توصیف کوتاه و دقیق داره («کفش رانی مردانه مدل الیاس، روی زمینهٔ سفید از روبه‌رو»)، width و height برای جلوگیری از پرش چیدمان ست شدن، loading="lazy" داره و توضیح تکمیلی هم توی figcaption اومده.

چک‌لیست عملی: alt سایتت رو درست کن

• [ ] همهٔ تصاویر داخل محصول، بنر صفحهٔ اصلی و دسته‌بندی‌ها alt توصیفی دارن
• [ ] تصاویر تزئینی alt="" گرفته‌ن
• [ ] عکس لینک‌شده، alt روی خود تگ لینک هست نه روی تصویر
• [ ] لوگوی سایت اسم برند رو داره و یه‌بار در هدر تکرار نشده
• [ ] متن alt زیر ۱۲۵ کاراکتره و کلمهٔ «تصویر» اضافه نداره
• [ ] تصاویر داخل <figure> با <figcaption> توضیح تکمیلی دارن
• [ ] همهٔ فایل‌ها اسم معنادار دارن (مثل ali-3600.webp، نه IMG_2048.webp)
• [ ] در گزارش سرچ کنسول، تصاویرت ایندکس شدن

سرعت و بهینه‌سازی: alt تنها کافی نیست

alt وقتی اثر داره که تصویر واقعاً لود بشه. اگه عکس‌ها سنگین باشن، هم کاربر منتظر می‌مونه، هم گوگل ممکنه تصویر رو به‌عنوان «کم‌کیفیت» کم‌ارزش‌تر ببینه. اینجا width، height، فرمت مدرن و loading کنار alt می‌نشینن و همون فایل رو حرفه‌ای می‌کنن.

اگه تا حالا سرعت سایت رو بررسی نکردی، اول راهنمای Core Web Vitals برای کسب‌وکار رو ببین. و اگه هنوز عکس‌ها رو خام آپلود می‌کنی، راهنمای بهینه‌سازی تصویر در Next.js دقیقاً همون کدی رو داره که لازم داری.

یادتون باشه کیفیت خود عکس هم جدا بحثه: عکاسی محصول برای فروشگاه کمک می‌کنه عکس‌هایت واقعاً بفروشن، نه فقط ایندکس شن. و اگه می‌خوای alt رو کنار بقیهٔ عناصر صفحه سیستماتیک پیش ببری، چک‌لیست سئوی داخلی صفحه رو دنبال کن.

چطور altها رو بررسی کنیم؟

روش ارزون و سریع: توی ترمینال دنبال تصاویری بگرد که تگ <img دارن ولی alt= ندارن — با grep -rn "<img" src/ و فیلتر کردن خط‌هایی که alt= ندارن. اگه خروجی داشت، اون تصاویر کاندیدای اصلاحن. بعدش با صفحه‌خوان تست کن (روی ویندوز NVDA، روی مک VoiceOver، روی اندروید TalkBack) و خودت ببین متن‌ها منطقی خوانده می‌شن یا نه. این تست ۱۰ دقیقه‌ای، بیشتر از هر ابزار سئو بهت می‌گه مشکل کجاست.

۵۰٪ کار: اولویت‌بندی

همهٔ تصاویر سایت رو یک‌جا نمی‌شه درست کرد. از این ترتیب شروع کن:

۱. تصاویر صفحهٔ اصلی و بنرهای بالای صفحه ۲. عکس محصولات پرفروش ۳. دسته‌بندی‌های اصلی ۴. تصاویر نوشته‌های وبلاگ ۵. بقیهٔ صفحات

روزی ۱۰ تا تصویر رو درست کن، بعد از دو هفته کل سایتت تمیز می‌شه. همین کار ساده معمولاً بیشترین تاثیر رو روی دسترسی‌پذیری می‌ذاره و به مرور روی سئوی تصاویرت هم اثر می‌کنه.

سوالات پرتکرار

Q: رو با کلمهٔ کلیدی پر کنم یا نه؟

اگه کلمهٔ کلیدی به‌طور طبیعی داخل توضیح تصویر جا می‌شه، عالیه. ولی تکرار مصنوعی‌اش (مثلاً «کفش کفش کفش ارزان») نتیجهٔ معکوس می‌ده؛ هم برای صفحه‌خوان آزاردهنده‌ست، هم گوگل این الگو رو دستکاری محتوا می‌بینه.

Q: یر دکوراتیو رو با alt خالی بذارم یا کلاً حذف کنم؟

alt="" بهترین گزینه‌ست. اگه با display: none یا CSS پنهانش کنی، معمولاً ربات‌های ایندکس‌کننده لازمش دارن بخونن؛ با alt="" صریح بهشون می‌گی این تصویر محتوایی نداره.

Q: داخل متن یا لینک، alt کجا بره؟

alt همیشه روی خود تگ img می‌مونه، حتی وقتی تصویر داخل لینکه. چیزی که باید توی aria-label یا متن لینک باشه، توصیف کاریه که لینک انجام می‌ده («مشاهدهٔ جزئیات محصول»)، نه اسم فایل عکس.

منابع

• Google Search Central — Google image SEO best practices: https://developers.google.com/search/docs/appearance/google-images
• W3C WAI Tutorials — An alt decision tree: https://www.w3.org/WAI/tutorials/images/decision-tree/
• Google Search Central — Image sitemaps: https://developers.google.com/search/docs/crawling-indexing/sitemaps/image-sitemaps
• Reddit r/SEO — Is it confusing for SEO to post the same images: https://www.reddit.com/r/SEO/comments/1htojt8/