ابزار رایگان دسترس‌پذیری
بررسی متن جایگزین تصاویر
آدرس یک صفحه را وارد کنید تا همه تصاویر آن را با متن جایگزینشان، همان‌طور که در یک مرورگر واقعی پس از اجرای اسکریپت‌ها خوانده می‌شود، ببینید. مشخص می‌شود کدام تصاویر متن جایگزین ندارند، کدام به‌عنوان تزئینی علامت‌گذاری شده‌اند و متن جایگزین کدام‌یک چیزی را توصیف نمی‌کند.
رایگان. آدرسی را که وارد می‌کنید در حدود 20 ثانیه بررسی می‌کند.
این ابزار چه چیزهایی را بررسی می‌کند
تصاویر بدون متن جایگزین
هر عنصر img و دکمه تصویری که ویژگی alt و هیچ نام قابل‌دسترس دیگری، مانند aria-label، ندارد.
تصاویر لینک‌داری که لینک را بی‌نام می‌گذارند
لوگوها و آیکون‌های داخل لینک‌ها یا دکمه‌ها که نه متن جایگزین دارند و نه متن دیگری، بنابراین صفحه‌خوان فقط می‌تواند «لینک» را اعلام کند.
متن جایگزینی که شبیه نام فایل است
مقادیری مانند IMG_2041.jpg، DSC0042 یا رشته‌ای طولانی از ارقام که بسیاری از سیستم‌ها هنگام آپلود به‌طور خودکار پر می‌کنند.
کلمات کلی
متن جایگزینی که فقط «تصویر»، «عکس»، «لوگو» یا «بنر» است به هیچ‌کس نمی‌گوید تصویر چه چیزی را نشان می‌دهد.
متن زائد و تکراری
توضیحاتی که با «تصویری از» شروع می‌شوند، متن لینک کنارشان را تکرار می‌کنند، یا روی سه تصویر مختلف یا بیشتر به کار رفته‌اند.
تصاویر تزئینی و پنهان
تصاویری که با alt="" یا role="presentation" علامت‌گذاری شده‌اند و تصاویری که با aria-hidden یا CSS پنهان شده‌اند جداگانه فهرست می‌شوند تا مطمئن شوید هر کدام واقعاً تزئینی است.
پیش‌نمایش هر تصویر
یک تصویر کوچک کنار متن جایگزینش، تا بتوانید هر توضیح را در چند ثانیه ارزیابی کنید. فیلترها فقط مشکلات یا فقط موارد نیازمند بررسی را نشان می‌دهند.
آنچه نمی‌تواند بررسی کند
- تشخیص اینکه متن جایگزین دقیق است یا نه. فقط کسی که تصویر را می‌بیند و می‌داند چرا در صفحه است می‌تواند درباره آن قضاوت کند.
- بررسی تصاویری که به‌عنوان پس‌زمینه CSS تنظیم شده‌اند، یا جایگزین‌های متنی گرافیک‌های SVG و canvas. این ابزار عناصر img و دکمه‌های تصویری را فهرست می‌کند.
- بررسی تصاویر داخل فریم‌ها، مانند ویدیوها، نقشه‌ها و تبلیغات جاسازی‌شده.
- فهرست کردن بیش از 150 تصویر. در صفحات بسیار طولانی، 150 تصویر اول را نشان می‌دهد و تعداد کل را می‌گوید.
- تست صفحات دیگر. اسکن رایگان کامل، متن جایگزین را همراه با بقیه WCAG در حداکثر پنج صفحه کلیدی بررسی می‌کند.
چرا اهمیت دارد
متن جایگزین همان چیزی است که صفحه‌خوان به‌جای تصویر می‌خواند و مرورگر وقتی تصویر بارگذاری نمی‌شود نشان می‌دهد. معیار موفقیت 1.1.1 در WCAG 2.2، در سطح A، برای هر تصویری که اطلاعاتی منتقل می‌کند یک جایگزین متنی، و برای تصاویری که اطلاعاتی ندارند یک جایگزین خالی الزامی می‌کند.
نبود متن جایگزین دومین خطای رایج دسترس‌پذیری در وب است: تحلیل WebAIM در سال 2026 آن را در 53.1% از صفحات اصلی یک میلیون وب‌سایت برتر پیدا کرد، و 16.2% از همه تصاویری که بررسی کرد هیچ متن جایگزینی نداشتند.
موتورهای جست‌وجو هم آن را می‌خوانند. گوگل می‌گوید از متن جایگزین همراه با بینایی ماشین و محتوای صفحه برای درک تصاویر استفاده می‌کند، و متن جایگزین تصویر لینک‌دار مانند انکر تکست (anchor text) لینک عمل می‌کند.
نحوه خواندن نتایج
- بدون متن جایگزین
- تصویر ویژگی alt و هیچ نام دیگری ندارد. بسته به نرم‌افزار، صفحه‌خوان ممکن است نام فایل را بخواند یا از تصویر رد شود.
- تزئینی
- alt="" یا role="presentation": صفحه‌خوان‌ها از تصویر رد می‌شوند. برای تزئین درست است؛ برای تصویری که اطلاعات منتقل می‌کند یا تنها محتوای یک لینک است نادرست است.
- دارای متن جایگزین
- تصویر توضیح دارد. ما مواردی را که نادرست به نظر می‌رسند علامت می‌زنیم؛ بقیه هم هنوز به بررسی انسانی برای اطمینان از دقت نیاز دارند.
- نام‌گذاری‌شده با ARIA یا title
- ویژگی alt وجود ندارد، اما نامی از aria-label، aria-labelledby یا title دارد. این در تست‌های خودکار قبول می‌شود؛ با این حال alt گزینه قابل‌اعتمادتری است.
- پنهان
- نمایش داده نمی‌شود، یا با aria-hidden از فناوری‌های کمکی پنهان شده است. چیزی برای اصلاح نیست، مگر اینکه تصویر باید دیده شود.
- لینک بدون نام
- لینک یا دکمه‌ای که تنها محتوایش تصویری بدون جایگزین متنی است. این مورد رد می‌شود، حتی اگر خود تصویر تزئینی باشد.
- بررسی
- متن جایگزینی که شبیه نام فایل یا یک کلمه کلی است، با «تصویری از» شروع می‌شود، متن لینک را تکرار می‌کند، بسیار طولانی است یا روی چند تصویر به کار رفته است.
نحوه رفع رایج‌ترین مشکلات
عکس‌های محصول و محتوا
آنچه را کاربر بدون تصویر از دست می‌دهد، در بافت صفحه توصیف کنید. برای محصول: خود کالا، رنگش و نمایی که نشان داده می‌شود. برای عکس یک مقاله: چیزی که نشان می‌دهد و متن نمی‌گوید.
لوگوهایی که به صفحه اصلی لینک می‌دهند
تصویر لینک‌دار باید بگوید لینک به کجا می‌رود. برای لوگویی که به صفحه اصلی لینک می‌دهد، به‌جای «لوگو» از نام شرکت استفاده کنید، مثلاً alt="صفحه اصلی Acme".
آیکون‌های داخل لینک‌ها و دکمه‌ها
به آیکون متن جایگزینی بدهید که عمل را بیان کند، مانند «جست‌وجو» یا «سبد خرید»، یا به لینک یک aria-label بدهید و آیکون را با alt="" تزئینی علامت بزنید.
تصاویر تزئینی
برای جداکننده‌ها، تزئینات پس‌زمینه و تصاویری که متن کنار خودشان را تکرار می‌کنند از alt="" (یک مقدار خالی، نه ویژگی ناموجود) استفاده کنید.
نام فایل‌هایی که پلتفرم شما پر می‌کند
بسیاری از پلتفرم‌ها هنگام آپلود، نام فایل را در فیلد alt کپی می‌کنند. آن را همان جایی ویرایش کنید که تصویر مدیریت می‌شود: در Shopify، در بخش رسانه محصول؛ در WordPress، در فیلد Alternative Text در کتابخانه رسانه.
نمودارها و اینفوگرافیک‌ها
یک alt کوتاه بدهید که بگوید نمودار چه چیزی را نشان می‌دهد، و داده‌ها یا خلاصه‌ای از آن‌ها را در متن یا جدولی کنار آن بگذارید.
تصاویر بدون متن جایگزین: چگونه آن‌ها را در Shopify، WooCommerce و هر سایتی اصلاح کنیم
پرسش‌هایی درباره این ابزار
متن جایگزین چیست؟
ویژگی alt یک تصویر، جایگزین متنی آن را در خود دارد. صفحه‌خوان‌ها آن را با صدای بلند می‌خوانند و مرورگرها وقتی تصویر قابل نمایش نیست آن را نشان می‌دهند.
آیا همه تصاویر باید متن جایگزین داشته باشند؟
هر عنصر img باید ویژگی alt داشته باشد. برای تصویری که اطلاعات منتقل می‌کند، این ویژگی تصویر را توصیف می‌کند؛ برای تصویر تزئینی باید خالی باشد (alt="") تا صفحه‌خوان‌ها از آن رد شوند.
متن جایگزین چقدر باید طولانی باشد؟
WCAG هیچ محدودیتی تعیین نمی‌کند. متن جایگزین خوب معمولاً یک عبارت یا جمله کوتاه است. اگر تصویری به توضیح بیشتری نیاز دارد، آن را در متن صفحه یا یک کپشن توصیف کنید و alt را کوتاه نگه دارید. ما متن جایگزین بیش از 150 کاراکتر را برای بررسی دوباره علامت می‌زنیم.
آیا متن جایگزین به سئو کمک می‌کند؟
گوگل می‌گوید از متن جایگزین، همراه با بینایی ماشین و محتوای صفحه، برای درک تصاویر استفاده می‌کند و متن جایگزین تصویر لینک‌دار مانند انکر تکست عمل می‌کند. همچنین هشدار می‌دهد که پر کردن ویژگی‌های alt با کلمات کلیدی ممکن است اسپم تلقی شود.
آیا ویژگی title همان alt است؟
خیر. title هنگام hover به‌صورت راهنمای ابزار (tooltip) نمایش داده می‌شود، صفحه‌خوان‌ها آن را به‌طور قابل‌اعتماد اعلام نمی‌کنند و روی صفحه‌های لمسی در دسترس نیست. تست‌های خودکار وقتی alt وجود ندارد آن را به‌عنوان نام می‌پذیرند، اما alt گزینه قابل‌اتکاست.
آیا هوش مصنوعی می‌تواند متن جایگزین من را بنویسد؟
می‌تواند پیش‌نویس توضیحات را بنویسد، اما نمی‌داند تصویر چرا در صفحه شماست. همه پیش‌نویس‌ها را بازبینی کنید: متن جایگزین درست به بافتی بستگی دارد که فقط شما از آن خبر دارید.
منابع
- W3C: توضیح معیار موفقیت 1.1.1 Non-text Content در WCAG 2.2(در زبانه جدید باز می‌شود)
- W3C Images Tutorial: درخت تصمیمگیری alt (An alt decision tree)(در زبانه جدید باز می‌شود)
- W3C Images Tutorial: تصاویر کاربردی (Functional images)(در زبانه جدید باز می‌شود)
- Google Search Central: بهترین روشهای سئو تصاویر(در زبانه جدید باز می‌شود)
- Deque: قاعده image-alt در axe-core(در زبانه جدید باز می‌شود)
- WebAIM: The WebAIM Million (2026)(در زبانه جدید باز می‌شود)
ابزارهای مرتبط
- دسترسپذیریبررسی دسترس‌پذیری سایتسایت خود را در یک مرورگر واقعی با WCAG 2.2 در سطح A و AA تست کنید و هر مانع را همراه با عنصر، صفحه و دلیل اهمیت آن ببینید.باز کردن ابزار
- دسترسپذیریبررسی کنتراست رنگدو رنگ را بر اساس WCAG 2.2 بررسی کنید، یا یک صفحه را برای یافتن متنهای زیر حداقل کنتراست اسکن کنید و برای هر کدام یک رنگ قابلقبول بگیرید.باز کردن ابزار
- سئوبررسی سئو سایتمشکلات سئو تکنیکال را که صفحات کلیدی شما را از نتایج جست‌وجو دور نگه میدارند یا ظاهرشان را در نتایج بدتر می‌کنند پیدا کنید.باز کردن ابزار
به راه‌حل‌ها نیاز دارید، نه فقط یافته‌ها؟
گزارش رفع مشکلات دسترس‌پذیری ($174، یک‌باره) از اسکن رایگان کامل شروع می‌کند و صفحات بیشتر، تغییر لازم برای هر یافته، یک فایل PDF و تست‌های مجدد برای تأیید اصلاحات شما را اضافه می‌کند.