alt تصاویر چیست؟

شرح alt تصاویر چیست

متن جایگزین

Alt Text چیست؟
متن Alt (متن جایگزین) ، همچنین به عنوان “ویژگی های alt” ، “توصیف های alt” یا از نظر فنی به عنوان “برچسب های alt” شناخته می شود ، در یک کد HTML برای توصیف ظاهر و عملکرد تصویر در یک صفحه استفاده می شود.
متن Alt استفاده می کند:
1. افزودن متن جایگزین به عکسها قبل از هر چیز یک اصل در دسترس بودن وب است. کاربران کم بینا که از صفحه خوان ها استفاده می کنند ، برای درک بهتر تصویر داخل صفحه ، یک ویژگی alt را می خوانند.

2. اگر پرونده تصویری بارگیری نشود ، برچسب های Alt به جای تصویر نشان داده می شوند.

3. برچسب های Alt زمینه / توصیفات بهتری را برای خزنده های موتور جستجو فراهم می کنند و به آنها کمک می کند تا به درستی یک تصویر را نمایه کنند.

متن برجسته شده متن alt (ویژگی alt) تصویر سمت چپ را نشان می دهد.

مثال متن Alt

<span><img src = "pupdanceparty.gif" alt = "توله سگها می رقصند"></span>

قالب متن Alt بهینه
بهترین قالب برای متن alt به اندازه کافی توصیفی است اما هیچ گونه تلاش ناخواسته ای برای پر کردن کلمات کلیدی را شامل نمی شود. اگر می توانید چشمان خود را ببندید ، از شخصی بخواهید متن alt را برای شما بخواند و یک نسخه کاملاً منطقی از تصویر را تصور کنید ، در مسیر درست قرار دارید.

بیایید به چند نمونه متن alt برای این تصویر از یک دسته کلوچه زغال اخته با ظاهری خوشمزه نگاه کنیم:

باشه:<img src="pancakes.png" alt="pancakes">

این متن alt فقط “خوب” است زیرا توصیفی چندانی ندارد. بله ، این تصویری از دسته پنکیک است. اما ، در مورد این تصویر چیزهای بیشتری برای گفتن وجود دارد.

خوب: 

<img src="pancakes.png" alt="Stack of blueberry pancakes with powdered sugar">

این متن alt جایگزین بهتری است زیرا توصیف آن چیزی است که در تصویر وجود دارد. این فقط یک دسته “پنکیک” نیست (همانطور که اولین نمونه متن alt نشان داد). این یک دسته پنکیک زغال اخته با گردگیری پودر قند است!

توصیه نمیشود:

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

یا

<img src="pancakes.png" alt="pancake pancakes pan cake hotcakes hotcake breakfast food best breakfast top breakfasts breakfast recipes pancake recipe">

هیچ یک از این مثالها توصیه نمی شود. خط اول کد در واقع اصلاً شامل هیچ متن alt نیست (توجه داشته باشید که نقل قول ها خالی هستند) ، در حالی که مثال دوم پر کردن کلمات کلیدی در متن alt را نشان می دهد.
چرا متن Alt مهم است؟
1. دسترسی
Alt text یک اصل طراحی وب قابل دسترسی است . هدف اصلی (و هنوز اصلی) آن توصیف تصاویر برای بازدیدکنندگانی است که قادر به دیدن آنها نیستند. این شامل خوانندگان صفحه و مرورگرهایی است که تصاویر را مسدود می کنند ، اما همچنین شامل کاربرانی می شود که کم بینا هستند و یا در غیر اینصورت قادر به شناسایی تصویری تصویر نیستند. درج متن متناوب با تصاویر شما ، تضمین می کند که همه کاربران ، صرف نظر از توانایی بصری ، می توانند از محتوای سایت شما قدردانی کنند.
2. سئو تصویر
استفاده از متن alt بر روی تصاویر شما می تواند تجربه کاربری بهتری را ایجاد کند ، اما همچنین می تواند به شما کمک کند هم مزایای صریح و هم ضمنی SEO را داشته باشید. همراه با اجرای عنوان تصویر و بهترین روش های نامگذاری پرونده ، از جمله متن alt نیز ممکن است در سئو تصویر کمک کند.

در حالی که طی سالها فناوری شناسایی تصویر موتور جستجو بسیار پیشرفت کرده است ، خزنده های جستجو هنوز نمی توانند تصاویر موجود در صفحه وب سایت را مانند ما “ببینند” ، بنابراین عاقلانه نیست که تفسیر را فقط در دست آنها بگذارید. اگر آنها نمی فهمند ، یا آن را اشتباه درک نمی کنند ، ممکن است شما می توانید برای کلمات کلیدی ناخواسته رتبه بندی کنید یا به طور کلی رتبه بندی را از دست دهید.

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

جیم هالپرت از دفتر (نسخه ایالات متحده)

اگر می خواهید رتبه “جعل هویت جیم هالپرت از دویت شروت” را بدست آورید ، باید به موتور جستجو کمک کنید.

به این معنا ، متن alt فرصت دیگری را در اختیار شما قرار می دهد تا کلمه کلیدی مورد نظر خود را وارد کنید. با توجه به اینکه استفاده از کلمات کلیدی در صفحه همچنان به عنوان یک عامل رتبه بندی موتور جستجو وزن خود را کاهش می دهد ، ایجاد متن alt که هم تصویر را توصیف کند و هم در صورت امکان شامل کلمه کلیدی یا عبارت کلیدی مورد نظر شما باشد ، به نفع شماست.
چگونه متن alt خوب بنویسم؟

1. تصویر را تا حد امکان به طور خاص توصیف کنید. متن Alt ، قبل از هر چیز برای تهیه توضیحات متنی از تصاویر برای کاربرانی که قادر به دیدن آنها نیستند ، طراحی شده است. اگر تصویری واقعاً هیچ معنی / ارزشی را منتقل نمی کند و فقط برای اهداف طراحی وجود دارد ، باید در CSS زندگی کند نه HTML.
2. آن را (نسبتاً) کوتاه نگه دارید. محبوب ترین صفحه خوان ها متن alt را با 125 کاراکتر قطع می کنند ، بنابراین توصیه می شود متن را به همان تعداد کاراکتر یا کمتر نگه دارید.
3. از کلمات کلیدی خود استفاده کنید Alt text فرصتی دیگر را برای شما فراهم می کند تا کلمه کلیدی مورد نظر خود را در یک صفحه قرار دهید و بنابراین فرصتی دیگر برای سیگنال دادن به موتورهای جستجو است که صفحه شما با یک جستجوی خاص خاص بسیار مرتبط است. در حالی که اولین اولویت شما باید توصیف و ارائه متن به تصویر باشد ، اگر منطقی است چنین کاری انجام دهید ، حداقل کلمه کلیدی خود را در متن alt حداقل یک تصویر در صفحه قرار دهید.
4. از پر کردن کلمات کلیدی خودداری کنید. Google برای متن کم نوشتاری alt امتیازات شما را ضبط نمی کند ، اما اگر از متن alt خود به عنوان فرصتی برای پر کردن هر تعداد کلمه کلیدی مرتبط استفاده کنید ، به مشکل برمی خورید. روی نوشتن متن توصیفی alt که متن را برای تصویر فراهم می کند و در صورت امکان ، کلمه کلیدی مورد نظر شما را شامل می شود ، تمرکز کنید و آن را رها کنید.
5. از تصاویر به عنوان متن استفاده نکنید. این کمتر از یک روش خاص برای متن خاص است و بیشتر از یک اصل توسعه وب مناسب با SEO است. از آنجا که موتورهای جستجو نمی توانند متن را در تصاویر شما بخوانند ، بنابراین باید از استفاده تصاویر به جای کلمات خودداری کنید. اگر این کار را انجام می دهید ، توضیح دهید که عکس شما در متن alt خود چیست.
6. “تصویر” ، “تصویر” و غیره را در متن alt خود وارد نکنید. در حال حاضر فرض بر این است که متن alt شما به یک تصویر اشاره دارد ، بنابراین نیازی به تعیین آن نیست.
7. longdesc = “” را فراموش نکنید. با استفاده از برچسب longdesc = “” برای تصاویر پیچیده تر که به توصیف طولانی تر نیاز دارند ، کاوش کنید.
8. از دکمه های فرم غافل نشوید. اگر فرم در وب سایت شما از دکمه “ارسال” تصویر استفاده می کند ، به آن یک ویژگی alt دهید. دکمه های تصویر باید دارای یک ویژگی alt باشند که عملکرد دکمه ها مانند “جستجو” ، “اکنون اعمال شود” ، “ثبت نام” و غیره را توصیف کند.

متن alt خوب به چه صورت است؟
بیایید نگاهی به چند نمونه از متن alt در عمل بیندازیم:

متن متن خوب: <img src="bird.png" alt="Rooster">

متن alt بهتر: <img src="bird.png" alt="Rooster crowing">

بهترین متن alt: <img src="bird.png" alt="Red-crested rooster crowing">

متن متن خوب: <img src="escalator.jpg" alt="man on escalator">

متن alt بهتر: <img src="escalator.jpg" alt="man walking on escalator">

بهترین متن alt: <img src="escalator.jpg" alt="man wearing backpack walking down escalator">

متن متن خوب: <img src="kwe.png" alt="kw explorer">

متن alt بهتر: <img src="kwe.png" alt="keyword research in Keyword Explorer">

بهترین متن alt: <img src="kwe.png" alt="Moz Keyword Explorer tool for SEO keyword research">

به یادگیری ادامه دهید

• دستورالعمل های انتشار تصویر Google
• عوامل رتبه بندی در صفحه
• توضیحات متا

مهارت های خود را به کار بگیرید
بخش صفحه بهینه سازی ها Moz نرم افزار صفحات برجسته که زندگی نمی کند تا به پتانسیل دید جستجوی کامل (و شامل چیزهایی مانند اینکه آیا یک صفحه از دست رفته است متن ALT). امتحان کنید >> 

منبع : moz.com