אטריבוט alt

אטריבוט alt הוא אטריבוט בשפת HTML המשמש ליצירת טקסט חלופי (טקסט אלטרנטיבי) לתמונות.

הביטוי alt הוא קיצר של הביטוי alternative (חלופה).

טקסט חלופי לתמונות פירושו טקסט שיופיע במקום תמונה ויהווה תיאור מילולי שלה, לדוגמה באחד מהמקרים להלן.

• תוכנת שרת לא הצליחה לטעון את התמונה
• תוכנת שרת עדיין לא סיימה לטעון את התמונה
• בין אם התמונה נטענה ובין אם לא, אדם עיוור יוכל לקרוא את הטקסט המתאר את התמונה כתחליף לראיית התמונה עצמה.

החשיבות של אטירובט alt

אטריבוט alt היא קריטריון נגישות ווב באתרים שיש בהם תמונה אחת לפחות.

באופן כללי, אי הוספת alt לרוב התמונות (למעלה מ-50%) פוגעת במידת מה במיקום תוצאות חיפוש הקשורות באפליקציה או אתר שאונדקסו לבסיס נתונים של מנוע חיפוש.

מפתחי מנועי החיפוש הגדולים מזהים בצדק בהוספת אטריבוט זה פעולה המנגישה את האתר לציבור כבדי הראייה, העיוורים וציבורים רבים אחרים כמו למשל אנשים שנתקעו בשטח זר עם חיבור אינטרנט גרוע וצריכים לטעון אתר מהר בלי תמונות ואחרים, יכולים להיעזר בטקסטיי alt בכדי להבין מה תמונה מסוימת מייצגת.

אטריבוט alt הוא לא טקסט שמתחת לתמונה

אטריבוט alt הוא לא טקסט שמתחת לתמונה.
חשוב מאד מאד להפנים את זה ויש הבדל מהותי בין אטריבוט alt לבין טקסט שמתחת לתמונה.
טקסט שמתחת לתמונה בדרך כלל מאורגן באלמנט HTML הנקרא figcaption שמופיע מתחת לאלמנט התמונה img כאשר שני אלמנטים אלה מופיעים יחד בתוך אלמנט הנקרא figure. 
להלן דוגמת קוד לכך:

<figure>
    <img src="img.jpg" alt="Some alternative text">
    <figcaption>
        Some text under the image !!!!!
    </figcaption>
</figure>

הערות כלליות

• אני אישית נמנע מלהוסיף נקודה אחרי טקסט alt. הסיבה העיקרית לכך היא כי לפעמים נרצה להדפיס את הטקסט מעל תמונה עם רקע overlay (רקע שכבתי), אבל זה נדיר בעיצוב אתרים.
• לא תמיד חייבים להוסיף טקסט alt, למשל, לצילומי מסך המעידים על בעיה טכנית ומיועדים לאנשים שאינם עיוורים במכוון לא חובה להוסיף טקסט alt אם כי זה עדיין מומלץ כחלק מהפרקטיקה הכללית של הוספת טקסט alt לתמונות.