איך כותבים טקסט חלופי טוב לתמונות

מאת צוות Negishut.app2 דקות קריאה

בקצרה

  • טקסט חלופי מתאר את התפקיד של התמונה בעמוד, לא כל פרט בה.
  • תמונת קישוט מקבלת alt ריק, כדי שקורא המסך ידלג עליה.
  • תמונה שהיא קישור או כפתור מתארת את הפעולה, לא את התמונה.

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

השאלה הנכונה: למה התמונה כאן?

לפני שכותבים, שאלו מה התמונה מוסיפה לעמוד. אותה תמונה יכולה לקבל טקסט שונה בהקשרים שונים. תמונה של הצוות בעמוד ״אודות״ מתארת את האנשים. אותה תמונה ככותרת לפוסט על אירוע מתארת את האירוע.

כללים שעובדים

  • קצר וממוקד: משפט אחד בדרך כלל מספיק.
  • בלי ״תמונה של״: קורא המסך כבר מודיע שזו תמונה.
  • טקסט שמופיע בתוך התמונה צריך להופיע גם בטקסט החלופי.
  • תמונה שהיא קישור מתארת את היעד. לוגו שמוביל לדף הבית: ״דף הבית של החברה״.
  • גרף או תרשים מקבל תיאור קצר, והנתונים עצמם מופיעים גם בטקסט או בטבלה.

מתי משאירים ריק

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

דוגמאות

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

בוורדפרס

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

רוצים לדעת איפה האתר שלכם עומד?

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

נכתב על ידי

צוות הנגישות של Negishut.app

בודקים אתרים לפי ת״י 5568 ו-WCAG 2.2 AA, עם מקלדת, קוראי מסך ומכשירים אמיתיים, וכותבים על מה שאנחנו פוגשים בדרך.