همه چیز را درباره تگ ALT بدانید !

نوشته alt چیست ؟

نوشته alt که با نام های توضیحات alt یا وژگی alt میگویند اما از لحاظ فنی گفتن تگ alt اشتباه است . زیرا از تگ alt یک کد در HTML برای توصیف ظاهر و عملکرد یک تصویر در یک صفحه استفاده میشود .

استفاده از نوشته ALT

۱ – دسترسی وب با استفاده از تگ alt بالا میرود . مثلا برای کسانیکه از نرم افزارهای صفحه خوان استفاده می کنند تجربه بسیار بهتری از سایت شما خواهند داشت .

۲ – نوشته alt در صورتی که عکس مورد نظر لود نشود جایگزین عکس میشود .

۳ – نوشته alt توضیح بهتری از عکس را به موتورهای جستجو میدهد و به آنها برای درست ایندکس کردن آن کمک میکند .

نوشته های لایت شده نشان دهنده نوشته alt هستند .

نمونه کد

<img src="pupdanceparty.gif" alt="کیک">

فرمت بهینه

تگ alt یاید توصیفی دقیق از عکس باشد و باید از به کاربردن کلمات کلیدی به صورت اسپم در آن خودداری کرد . در هنگام انتخاب عکس چشمان خود را ببندید و نوشته alt را بخوانید و باید بتوانید دقیقا عکس مورد نظر را با همان نوشته مجسم کنید . بگذارید با مثال توضیح دهیم :

معمولی :

<img src="pancakes.png" alt="کیک"> 

این نوشته alt فقط معمولی است به دلیل اینکه خیلی توضیحی نیست . درست است که در مورد کیک است اما کامل نیست .

بهتر :

<img src="pancakes.png" alt="کیک بلوبری با پودر شکر">

این نوشته alt بهتر از قبلی است به دلیل اینکه خیلی بیشتر آن را توضیح میدهد . این نوشته کامل است و میگوید که پودر شکر هم روی کیک میباشد .

استفاده از فرمت های زیر پیشنهاد نمیشود :

< img src="pancakes.png" alt ="">

و

<img src="pancakes.png" alt="کیک صبحانه کیک صبحانه خوشمزه کیک خوشمزه و عالی">

هیچکدام از مثال های بالا پیشنهاد نمیشوند . اولین مورد که نوشته alt آن خالی میباشد . دومی نیز از کلمات کلیدی زیاد استفاده شده است .

چرا تگ alt مهم است ؟

بالا بردن دسترسی پذیری

استفاده از نوشته alt باعث دسترسی پذیری وب بالاتر برای کسانیکه نمیتوانند صفحات سایت را به صورت معمولی ببینند می شود . مثلا به کسانیکه از ضفحه خوان ها استفاده می کنند یا نابینا هستند بسیار کمک خواهد کرد .

سئو کردن عکس

استفاده کردن از نوشته alt میتواند تجربه کاربری را بالا ببرد و همچنین منافع سئو را نیز تامین کند . استفاده از اسم عکس و نام فایل مناسب در کنار نوشته alt سئو عکس را بالا میبرد .

هنوز هم با این همه پیشرفت در موتورهای جستجو آنها نمیتوانند عکس را مانند انسان مشاهده کنند . شما با نوشتن alt ، اسم عکس و فایل آن میتوانید موتورهای جستجو را راهنمایی کنید تا با لغات کلیدی مربوط برای شما عکس را ایندکس کنند .

مثال :

عکس زیر را در نظر بگیری : گوگل ممکن است از این عکس این را بفهمد : یک مردپشت میز با یک کروات . اگر شما میخواهید با اسم شخصیت مثل مهرداد رنک بگیرید نمیتوانید آن را بدون اسم عکس مناسب ، اسم فایل و نوشته alt به گوگل بفهمانید .

چگونه یک نوشته alt خوب بنویسیم ؟

عکس را به صورت خاص شرح دهید

نوشته alt در درجه اول برا کسانیکه نمیتوانند عکس را ببینند استفاده میشود بنابراین توضیح دقیقی از عکس را در آن بنویسید .

نسبتا کوتاه بنوسید

اندازه مناسب برای کسانیکه که از صفحه خوان ها استفاده میکنند ۱۲۵ کاراکتر یا کمتر میباشد .

از کلمات کلیدی استفاده کنید

سعی کنید کلمه کلیدی خود را نیز در داخل نوشته alt بنویسید اما اگر نمیشود از کلمه کلیدی داخل آن استفاده نکنید .

در استفاده از کلمات کلیدی زیاده روی نکنید

سعی کنید یک نوشته دقیق در مورد تشریح عکس بنویسید و در صورت ممکن کلمه کلیدی مورد نظر را هم داخل آن بگنجانید .

از عکس به عنوان نوشته استفاده نکنید

موتورهای جستجو نمیتوانند نوشته داخل عکس را بخوانند بنابراین نباید از عکس به عنوان نوشته استفاده کرد اگر هم اینکار را کرده اید در نوشته alt توضیح آن را بدهید .

نوشته هایی مانند : ” عکس خرگوش ” ، ” عکس با کیفیت ” و غیره را در نوشته alt بکار نبرید

کاملا مشخص است که نوشته alt در عکس بکار رفته است بنابراین لازم به نوشتن عکس و از این چیزها نیست .

برای توضیحات بلند از تگ “”=longdesc استفاده کنید

اگر توضیح بلندی لازم است از این تگ به عنوان توضیحات خود استفاده کنید .

دکمه های دانلود و ثبت را نادیده نگیرید

اگر از عکس به عنوان دکمه هایی مانند دانلود یا ثبت کردن استفاده میکنید از ” alt attribute ” استفاده کنید . این تگ باعث توضیح دادن عملکرد این عکیس ها مانند : عضویت ، جستجو کردن و غیره میشود .

نوشته alt خوب چه شکلی است ؟

با مثال های زیر توضیح میدهیم :

معمولی :

<img src="bird.png" alt="خروس">

بهتر :

<img src="bird.png" alt="خروش در حال خواندن">

عالی :

<img src="bird.png" alt="خروس با تاج قرمز در حال خواندن">

معمولی :

<img src="escalator.jpg" alt="مردی روی پله برقی">

بهتر :

<img src="escalator.jpg" alt="مردی روی پله برقی راه میرود">

عالی :

<img src="escalator.jpg" alt="مردی با کوله بر پشت خود روی پله برقی راه میرود">