הנגשת אתרים לפי תקן ישראלי 5568

אני חי זריהן, ומבחינתי נגישות היא חלק מחוויית השימוש באתר.

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

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

מה זה אתר נגיש?

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

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

הנגשה יכולה לכלול שינויים בתוכן, במבנה העמודים, בעיצוב ובקוד.

דוגמאות להתאמות נגישות

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

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

מהו תקן ישראלי 5568?

תקן ישראלי 5568 עוסק בנגישות תכנים באינטרנט.

ת"י 5568 חלק 1 מתייחס לנגישות אתרי אינטרנט ומבוסס על WCAG 2.0, בשילוב השינויים והתוספות הלאומיים של התקן.

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

רמת AA היא רמת התאמה מרכזית בהקשר של דרישות הנגישות לאתרי אינטרנט בישראל.

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

מה זה WCAG?

WCAG הוא קיצור של Web Content Accessibility Guidelines – הנחיות בינלאומיות לנגישות תכנים באינטרנט.

ההנחיות מבוססות על ארבעה עקרונות:

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

מה כולל שירות הנגשת אתרים?

בדיקת המצב הקיים

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

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

באתר תדמית אפשר להתמקד בעמודי שירות ובטפסי פנייה.

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

התאמות כותרות ומבנה

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

אני בודק האם העמודים משתמשים בכותרות מתאימות ואם קיימת היררכיה עקבית.

חשוב שכותרת תוגדר לפי תפקידה בתוכן, ולא רק לפי הגודל החזותי שלה.

טקסטים חלופיים לתמונות

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

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

אני בוחן את תפקיד התמונה בעמוד ולא ממלא את שדה ALT במילות מפתח בלבד.

ניגודיות וקריאות

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

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

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

ניווט באמצעות מקלדת

לא כל המשתמשים יכולים להיעזר בעכבר.

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

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

התאמות לטפסים

טפסים משמשים לקבלת פניות, הרשמות ולעיתים גם הזמנות.

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

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

הנגשת אתר WordPress ו-Elementor

אתרי WordPress יכולים לכלול רכיבים רבים ממקורות שונים.

למשל, אתר שנבנה ב-Elementor עשוי להשתמש בתבניות, טפסים, חלונות קופצים ותוספי הרחבה.

כל אחד מהרכיבים האלה צריך להיבדק בהתאם לתפקידו.

תבניות ורכיבים חוזרים

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

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

חלונות קופצים

חלון קופץ צריך להיות ניתן להפעלה ולסגירה בצורה נגישה.

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

תוספי צד שלישי

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

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

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

הנגשת חנויות WooCommerce

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

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

לכן אני מתייחס למסלול הרכישה כולו.

מוצרים עם וריאציות

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

סליקה חיצונית

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

יכולת ההתאמה תלויה במערכת הסליקה ובהרשאות הזמינות.

הודעות שגיאה

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

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

האם תוסף נגישות מספיק?

תוסף נגישות יכול להוסיף אפשרויות שימוש מסוימות, כגון שינוי תצוגה או התאמות חזותיות.

אבל הוא אינו מחליף בהכרח בדיקה ותיקון של מבנה האתר.

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

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

בדיקות נגישות אוטומטיות וידניות

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

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

אבל לא כל בעיה ניתנת לזיהוי אוטומטי.

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

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

תהליך העבודה שלי

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

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

הצהרת נגישות לאתר – מה צריך לכלול?

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

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

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

פרטים מרכזיים בהצהרת נגישות

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

דוגמה לשדות בעמוד ההצהרה:

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

הצהרה צריכה לשקף את המצב שנבדק בפועל. לכן אני ממליץ לעדכן אותה כאשר האתר משתנה או כאשר מתבצעות התאמות נוספות.

מה קורה אחרי שהאתר הונגש?

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

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

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

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

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

כמה עולה הנגשת אתר אינטרנט?

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

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

שאלות נפוצות