فرق بین تگ alt و title در تصاویر چیست؟
سلام و درود به شما دوستان عزیز و همراهان مِستر آموز.
فرق بین تگ alt و title در تصاویر چیست؟
اگر شما هم به عنوان نویسنده یا مدیر یک سایت مطالبی را در سایت قرار می دهید، می دانید که مقدار زیادی از محتوای وب شامل تصاویر است. اما بسیاری از سایت داران تصاویر خود را برای سرعت و رتبه بندی بهتر بهینه نمی کنند.
در وردپرس گزینه ای برای اضاف کردن متن ALT و عنوان تصویر یا TITLE می آید. ولی خیلی از کاربران شاید ندانند که فرق این دو چی هست. در این مقاله آموزشی میخواهیم فرق بین Alt و Title را بررسی کنیم. با ما همراه باشید.
متن ALT و عنوان تصویر چیست؟
ALT به عنوان متن جایگزین است. و یکی از ویژگی اضافه شده به برچسب تصویر در HTML میباشد. این متن زمانی که تصویر به هر دلیلی نمایش داده نشود، متن Alt جایگذینش می شود. دلیل مهم بودن این خصوصیت این است که به موتورهای جستجو در درک تصویر کمک میکند. متن جایگزین برای تصاویری که در صفحه پیدا نمیشود هم مفید است.
اما عنوان تصویر، ویژگی دیگری است. عنوان تصویر را باید به تگ تصویر در HTML اضافه کرد. متنی که در تگ عنوان وارد میکنید. عنوان تصویر زمانی که کاربر ماوس را اطراف عکس حرکت میدهد در یک کادر کوچک نمایش داده میشود.
این تو خصوصیت برای تصاویر اغلب برای بهبود بخشیدن به دسترسی به وب سایت برای کسانیکه دید ضعیف دارند یا دستگاه صفحه خوان دارند استفاده میشود. صفحه خوان متن مقاله وارد شده را میخواند و زمانیکه به تصاویر می آید به تصاویر میگوید:Title XYZ. به کاربران اجازه میدهد که بدانند چرا با وجود دیده نشدن عکس، تگ اضافه کرده اید.
نحوه ی افزودن متن ALT به تصویر در وردپرس
در وردپرس به 2 روش می توان این کار را انجام داد: روش اول به راحتی می توانید به رسانه ها بروید و عکس مورد نظر را انتخاب کنید. سپس طبق تصویر زیر از منوی سمت چپ در کادر متن جایگزین، متن مورد نظر خود را بنویسید.
در روش دوم می توانید از ویرایشگر روی دکمه متن کلیک کنید تا کدهای HTML صفحه باز شوند.
و اکنون به تگ img خصیصه alt را اضاف کنید و در ” ” متن مورد نظر را بنویسید:
<img src="https://webamooz.co/wp-content/uploads/alt.jpg" alt="alternate text for image"/>
نحوه ی افزودن TITLE تصاویر در وردپرس
همچنین برای قرار دادن یک متن برای عنوان یا همان Title 2 روش وجود دارد:
روش اول: وقتی که داریم یک تصویر آپلود می کنیم با استفاده از کادر سمت چپ در فیلد عنوان (در وردپرس جدید 2 تا نام وجود دارد که نام بالاست همان عنوان است.)
روش دوم هم با استفاده از کد های HTML می باشد که برای انجام این کار به کد زیر دقت کنید:
<img src="http://www.webamooz.co/wp-content/uploads/title.jpg" alt="alternate text for image" title="A proper title attribute" />
همانطور که می بینید که خصوصیت به نام title نوشته شده است.
موفق و پیروز باشید.
پیشنهاد: شما می توانید مطالب مرتبط زیر را نیز بخوانید:
