הוספת נגישות לאתר

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

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

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

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

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

קודם כל תמונות

הדבר הראשון והשכיח ביותר שיש לו בעיות נגישות, אלו הן התמונות שבאתר.

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

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

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

כיצד גולש כבד ראייה ידע על מה הוא מקליק? ניחשתם נכון, בזכות תגית ה-ALT. זוהי בדיקה ידנית שאנו עורכים בכל אתר ואתר שיש בהם תמונות קליקביליות.

חשוב לדעת: זה תקף גם לגבי אייקונים וקישורים. אם יש לנו אייקון קליקבילי או קישור, אבל אין לנו תיאור מדויק מה הוא עושה ולאן הלחיצה עליו מעבירה את הגולש, הרי שהדבר יקשה מאוד על אדם עיוור.

באנרים בעמודים ראשיים

באתרים רבים ישנה קרוסלת תמונות מתחלפת בחלקו העליון של הדף, ועל גבי כל אחת מן התמונות ישנו טקסט; למשל '50% הנחה על בגדי ילדים לקולקציית הקיץ' וכיוצא בכך.

ההיגיון הבריא אומר שעלינו לתאר בתגית האלט את תמונת הבאנר. אולם השאלה שמוכרחה להישאל היא – האם אנחנו עוזרים בכך לגולשים שלנו להבין את האתר?

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

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

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

ניווט יעיל עם המקלדת

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

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

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

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

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

חלון פופ-אפ

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

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

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

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

וזה בדיוק מה שאנחנו עושים

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

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

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

נשמע מסקרן? צרו עמנו קשר ונציגינו ישמחו לסייע.