איך מנגישים תמונות באתר אינטרנט?

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

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

ראשית דבר מרכזי שחשוב להבין שאין להכניס שום מידע כתוב על התמונה.

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

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

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

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

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

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

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

מה עושים עם תמונה שהיא רק רקע ואינה מעבירה כלל מסר?

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

תמונה נגישה עם טקסט חי

תמונה שעל גביה יש טקסט חי

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

תמונה שאינה נגישה עם טקסט מוטמע בה

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

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

שתפו פוסט זה

Share on facebook
Share on whatsapp
Share on linkedin
Share on twitter
Share on email

פוסטים נוספים בנושא הנגשת אתרים

מהן רמות הנגישות הקיימות באינטרנט

רמת נגישות לאתר אינטרנט

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

מאמר חשוב לגבי נגישות באינטרנט

נגישות באינטרנט

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

מעוניין שנבדוק עבורך האם האתר שלך נגיש?

השאר פרטים ואנו מבטיחים לחזור אליך בשעות הקרובות

web-a הנגשת אתרים

חזרו אליי בבקשה לגבי
נגישות באינטרנט