מדריך להנגשת תמונות באמצעות טקסט חלופי

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

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

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

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

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

מי נחשף לטקסט החלופי של התמונה:

1. משתמש המסתייע באמצעות קורא מסך.
2. משתמש שהחיבור לאינטרנט שלו איטי או שהאפשרות להצגת תמונות חסומה אצלו במחשב או בטלפון הסלולרי.

סוגי התמונות הקיימות לצורך הנגשה

תמונה למטרת דקורציה

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

הנגשת תמונה מסוג תמונה למטרות דקורציה (תמונה דקורטיבית) יכולה להתבצע בשתי דרכים:

1. הגדרת התמונה כתמונת רקע.
2. הגדרת טקסט אלטרנטיבי ריק = "" (זוג מירכאות ללא תוכן באמצע).

תמונה שמטרתה העברת מסר

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

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

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

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

תמונה מורכבת המכילה טקסט רב

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

להלן שתי אפשרויות מרכזיות להנגשת תמונות מורכבות:

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