تصاویر به وب سایت شما کمک میکنند که از نظر ظاهری جذاب و گیراتر شوند. در کنار آن، متن جایگزین تصویر یا Alt Text هم میتواند به بهبود تجربه کاربری و دسترسپذیری سایتتان کمک بهسزایی کند.اگر تصاویر سایت به هر دلیلی برای کاربر بارگذاری نشود، متن جایگزین نمایش داده میشود تا بداند چه تصویری در این بخش وجود داشته است. اما از قبل از هرچیز برای استفاده صحیح از این ویژگی، باید بدانید که به طور کلی تگ جایگزین چیست و چگونه کار میکند.
تگ alt تصویر چیست؟
ویژگی متن جایگزین تصویر یا Alt text برای توضیح محتوای یک عکس، به کدهای HTML آن تصویر اضافه میشود. همچنین زمانی که تصویر به درستی بارگزاری نمیشود، تگ جایگزین در کنار آیکن تصویر نمایش داده خواهد شد.
این توضیحات به افرادی که نمیتوانند صفحه را ببیند، کمک میکند تا بدانند چه محتوایی در تصاویر قرار گرفته است. به علاوه اینکه رباتهای موتور جستجو از این اطلاعات استفاده میکنند تا بتوانند تصاویر صفحه را تفسیر کرده و ایندکس کنند.
در کدهای HTML، داخل تگ تصویر، یک تگ alt قرار میگیرد که با یک توضیح کوتاه، هدف تصویر در صفحه را نشان میدهد. این کد در هنگام استفاده مشابه خط زیر خواهد شد:
<img src=”histogram.jpg” alt=”هیستوگرام تصویر در فتوشاپ”/>
تگ تصویر گاهی اوقات با عنوان عکس اشتباه گرفته می شود؛ اگرچه عنوان تصویر ویژگی و تگ متفاوتی است. زمانی که کاربر ماوس را روی تصویر میبرد، عنوان در یک پاپ-آپ کوچک به او نمایش داده میشود. یا در بعضی سایتها این عنوان پایین تصویر یا داخل کادر عکس قرار میگیرد و توضیحی درباره تصویر ارائه میدهد. در حالیکه در شرایط عادی، کاربران محتوای تگ جایگزین عکس را اصلاً نمیبینند.
ویژگی متن ALT در HTML
ابتدا باید به این سوال جواب بدیم که متن تگ ALT چیست؟
یک ویژگی یا اتریبیوت (Attribute) در HTML هست، ویژگی به زبان فارسی و اتریبوت به زبان انگلیسی هست. جلوتر درباره ساختار مهم ویژگی متن جایگزین صحبت میکنیم.
اتریبیوتها (در اینجا alt یک نوع اتریبیوت هست) کدهایی هستند که ویژگیهای یک تگ HTML رو (در اینجا تگ html منظور تگ img هست) مشخص میکنند و درون تگ مربوطه قرار میگیرند. مثلا همین اتریبیوت ALT در تگ تصاویر یا img استفاده میشه.
عبارت alt از خلاصه عبارت Alternative به معنای «جایگزین» هست. بنابراین متن درون این اتریبیوت، جایگزینی برای تصاویر تا محتوای درون عکس رو به صورت خیلی کوتاه برای موتورهای جستجو (که نمیتونند مفهوم عکس رو تشخیص بدن) مشخص کنه. تگ img جزو تگ های مهم HTML در سئو هست و ویژگی ALT درون این تگ هم اثر مهمی در سئو تصاویر داره.
کاربردهای نوشتن متن ALT برای تصویر
همونطور که گفتیم، اتریبیوت alt در تگ img استفاده میشه، اما کاربرد متن ALT یا همون ویژگی متن جایگزین عکس در HTML و سئو چیه؟
درباره اهمیت alt تصاویر شاید همین کافی باشه که بدونیم به قدری مهمه که شرکت گوگل سرویس Google Images رو ایجاد کرده و بهطور ویژه به جستجوی تصاویر اختصاصش داده. از طریق تصاویری که توی این بخش وجود دارند و دیده میشن، میتونیم وارد صفحات وب مرتبط با عبارات جستجو شده بشیم .
