טופסי יצירת קשר נגישים וחוק הנגישות האירופי

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

מה מכסה חוק הנגישות האירופי

חוק הנגישות האירופי (דירקטיבה (EU) 2019/882) חל מאז 28 ביוני 2025. הוא קובע דרישות נגישות למוצרים ולשירותים מסוימים המוצעים לצרכנים — ובהם מסחר אלקטרוני, שירותי בנקאות לצרכנים, ספרים אלקטרוניים, תקשורת אלקטרונית וחלקים מתחום הסעת הנוסעים. באתר אינטרנט, פירוש הדבר הוא החנות המקוונת או שירות הבנקאות במלואם, כולל הטפסים שבהם לקוחות משתמשים ליצירת קשר, לשאלות או לתלונות. מיקרו-עסקים שמספקים שירותים פטורים: עסקים עם פחות מעשרה עובדים ועם מחזור שנתי או מאזן כולל של לא יותר מ-EUR 2 מיליון. הצעות שמכוונות אך ורק לעסקים אחרים נמצאות בדרך כלל מחוץ לתחולתו.

כל מדינה חברה העבירה את הדירקטיבה לחקיקה לאומית. בגרמניה זו Barrierefreiheitsstärkungsgesetz (BFSG), ובפולין זהו חוק משנת 2024 להבטחת עמידתם של מוצרים ושירותים מסוימים בדרישות הנגישות. רשויות הפיקוח והסנקציות שונות ממדינה למדינה, אך אמת המידה הטכנית דומה ברובה: בפועל התקן האירופי EN 301 549, שמבוסס בתורו על הנחיות הנגישות לתוכן אינטרנט (WCAG).

למה זה משתלם גם בלי חובה משפטית

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

רשימת בדיקה מעשית עם הפניות ל-WCAG 2.2

• תוויות גלויות המקושרות לשדות (1.3.1, 3.3.2): לכל שדה יש תווית גלויה שמחוברת אליו באמצעות for/id. טקסט מציין מיקום לבדו אינו תווית — הוא נעלם ברגע שמתחילים להקליד.
• הודעות שגיאה שמסבירות את התיקון (3.3.1, 3.3.3): יש לציין את השדה, להסביר מה שגוי ואיך לתקן — בטקסט, לא רק במסגרת אדומה. ״יש להזין כתובת דוא״ל כמו name@example.com״ עדיף על ״קלט לא תקין״.
• תפעול מלא במקלדת (2.1.1, 2.1.2): אפשר להגיע לכל שדה, תיבת סימון, CAPTCHA וכפתור השליחה ולהשתמש בהם באמצעות Tab, Space ו-Enter, ללא מלכודות מקלדת.
• מיקוד גלוי (2.4.7): תמיד אפשר לראות איזה שדה פעיל. הסרת מסגרת המיקוד של הדפדפן ללא תחליף אינה עומדת בקריטריון הזה.
• ניגודיות מספקת (1.4.3): לטקסט, לתוויות ולהודעות שגיאה יש יחס ניגודיות של לפחות 4.5:1 מול הרקע (3:1 לטקסט גדול).
• גודל מטרה (2.5.8): כפתורים, תיבות סימון וקישורים הם בגודל של לפחות 24 × 24 פיקסלי CSS, או שיש סביבם מרווח מספיק.
• חלופות CAPTCHA (1.1.1) ואימות נגיש (3.3.8): קריטריון 1.1.1 דורש חלופת טקסט ו-CAPTCHA ביותר מצורה חושית אחת; 3.3.8 מתייחס במדויק לשלבי כניסה, אך הרעיון שלו מתאים גם כאן — חידה כמו הקלדה מחדש של אותיות מעוותות או פתרון תרגיל חיבור אינה צריכה להיות הדרך היחידה להתקדם. יש להציע חלופה או להשתמש בשיטה שאינה דורשת חידה כלל.
• שדות מלכודת שמוסתרים מטכנולוגיה מסייעת: העטיפה של שדה המלכודת מקבלת aria-hidden="true" והשדה מקבל tabindex="-1", כך שמשתמשי קוראי מסך ומקלדת לעולם אינם מגיעים אליו.

CAPTCHA ושדות מלכודת: המפגש בין הגנה מספאם לנגישות

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

<div class="hp" aria-hidden="true">
  <label for="hp-website">יש להשאיר שדה זה ריק</label>
  <input type="text" id="hp-website" name="website"
         tabindex="-1" autocomplete="off">
</div>
<!-- CSS: .hp { position: absolute; left: -10000px; } -->

בדיקת הטופס בתוך חמש עשרה דקות

1. 1יש להניח את העכבר בצד ולמלא את כל הטופס באמצעות המקלדת בלבד. האם אפשר להגיע לכל שדה ולכפתור השליחה, והאם תמיד רואים היכן נמצאים?
2. 2יש לשלוח את הטופס כשהוא ריק, ואז עם כתובת דוא״ל שגויה. האם השגיאות מופיעות כטקסט ליד השדה הנכון, והאם ברור מה צריך לעשות?
3. 3יש לפתוח את הדף בטלפון או להגדיל את הדפדפן ל-200%. האם הכול קריא, האם קל להקיש על הכפתורים, והאם באנר עוגיות או רכיב צ׳אט מסתירים את כפתור השליחה?
4. 4יש להפעיל קורא מסך (VoiceOver, NVDA או TalkBack) ולהקשיב: האם כל שדה מוקרא עם התווית שלו, והאם שדה המלכודת נשאר שקט?
5. 5יש להריץ בדיקה אוטומטית כגון axe-core. היא מוצאת במהירות תוויות חסרות ובעיות ניגודיות, אבל לא הכול — הצעדים הידניים שלעיל עדיין נחוצים.

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