چرا هر تصویر به alt نیاز دارد؟
هر تصویری که در یک صفحه میگذاری یک attribute بهاسم alt دارد؛ یک متن کوتاه که میگوید آن تصویر چیست. خیلیها این را خالی میگذارند یا اصلاً از قلم میاندازند، چون وقتی تصویر درست بارگذاری میشود دیده نمیشود. ولی alt دقیقاً برای همان لحظههایی است که تصویر دیده نمیشود — و بیشتر از چیزی که فکر میکنی مهم است.
alt چیست؟
وقتی یک تصویر را با tag تصویر در صفحه میگذاری، کنارش مینویسی alt="..." و داخل گیومه توضیح میدهی تصویر چه چیزی را نشان میدهد. این متن، جانشینِ تصویر است؛ اگر تصویر سرِ جایش نبود، این متن کارش را انجام میدهد. تا وقتی همهچیز عادی است کسی آن را نمیبیند، ولی همیشه آنجاست و منتظر است.
چه کسی به alt نیاز دارد؟
کاربران screen reader. کسی که نمیتواند تصویر را ببیند، صفحه را با یک screen reader میشنود. این ابزار تصویر را نمیتواند بخواند، ولی متن alt را با صدای بلند میگوید. اگر alt نباشد، آن کاربر فقط میشنود «تصویر» یا حتی اسم فایل را — و هیچ نمیفهمد آنجا چه بوده.
وقتی تصویر بارگذاری نمیشود. اینترنت ضعیف، آدرس اشتباه، یا یک سرورِ خاموش؛ هر کدام میتواند تصویر را نیاورد. در آن حالت مرورگر بهجای تصویر همان متن alt را نشان میدهد، و صفحه بهجای یک مربع خالیِ شکسته، هنوز معنا دارد.
موتورهای جستجو. گوگل تصویر را «نمیبیند»؛ برای فهمیدن اینکه تصویر دربارهی چیست، به متن alt تکیه میکند. یک alt خوب یعنی شانس بیشتر برای دیدهشدن در جستجوی تصویر.
alt خوب چه شکلی است؟
قانون طلایی: هدف تصویر را توصیف کن، نه جزئیات ظاهرش را. بپرس «اگر این تصویر نبود، چه جملهای جایش میگذاشتم تا خواننده همان را بفهمد؟» همان جمله، alt توست.
- ضعیف:
alt="تصویر"یاalt="عکس ۱"— هیچ اطلاعاتی نمیدهد. - بیشازحد: توصیفِ رنگ هر گوشهی تصویر. کسی نمیخواهد یک پاراگراف بشنود.
- خوب: کوتاه و دقیق، همان چیزی که تصویر میخواهد برساند — مثلاً «مدار یک LED که به مقاومت وصل شده».
یک نکته: داخل alt ننویس «تصویری از…»؛ خواننده و screen reader هر دو میدانند که این یک تصویر است. مستقیم برو سراغ چیزی که نشان میدهد.
کِی alt را خالی میگذاریم؟
گاهی یک تصویر فقط تزئینی است و هیچ معنایی به صفحه اضافه نمیکند — مثل یک خطِ جداکننده یا یک نقشِ پسزمینه. در این حالت alt="" میگذاری، یعنی یک alt خالیِ عمدی. این به screen reader میگوید «این تصویر را رد کن، چیزی برای گفتن ندارد». دقت کن: alt="" با نبودِ alt فرق دارد؛ اولی یعنی «عمداً خالی»، دومی یعنی «یادم رفت» — و screen reader این دو را متفاوت برخورد میکند.
در یک جمله
هر تصویری که معنا دارد به یک alt کوتاه و هدفمحور نیاز دارد؛ هر تصویری که فقط تزئین است به یک alt="" خالی. این یک عادت کوچک است که صفحهات را برای همه — از جمله کسانی که تصویر را نمیبینند — قابلاستفاده میکند. در خودآموز تاروپود نوشتن alt درست از همان اولین تصویری که در صفحه میگذاری بخشی از کار است، نه یک کارِ اضافه در آخر. (اینکه چرا انتخابِ درستِ tag هم به همین شکل به همه کمک میکند، موضوع نوشتهی چرا فقط <div> کافی نیست؟ است.)
