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

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

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

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

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

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

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

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

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

מגדילים ל-200% ואז מסתכלים מחדש על הצבעים

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

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

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

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

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

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

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

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

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

בטפסים בודקים מה מבקשים ומה קורה כשטועים

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

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

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

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

בסרטונים קוראים את הכתוביות ובודקים גם את הנגן

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

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

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

הופכים את הממצאים לתיקונים ובודקים אותם שוב

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

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

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

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