מדריך הוספת תפריט הנגישות לאתר
המדריך הזה מיועד לבעלי אתרים שמעולם לא נגעו בקוד. הוא מסביר, צעד אחר צעד, איך להוסיף לאתר את תפריט הנגישות של שייך, איך לבדוק שהוא עובד, איך לשנות את המראה שלו ואיך לפרסם הצהרת נגישות.
כל מה שצריך לעשות הוא להעתיק ולהדביק. לא צריך להבין את הקוד.
מפתחים וסוכני AI: התיעוד הטכני המלא נמצא ב-docs/ai-agents.md (באנגלית).
תוכן העניינים
- לפני שמתחילים: חשוב לדעת
- מה צריך
- שלב 1: הקוד להעתקה
- שלב 2: הדבקת הקוד באתר
- שלב 3: בדיקה שהכול עובד
- שינוי המראה של הכפתור
- הצהרת הנגישות
- פטורים
- כשמשהו לא עובד
- עדכונים
- חשוב לזכור
לפני שמתחילים: חשוב לדעת
תפריט נגישות לא מגן מפני תביעות ולא הופך אתר לנגיש. החוק בודק את האתר עצמו: האם הוא עומד בתקן הישראלי ת"י 5568 ברמה AA, והאם יש בו הצהרת נגישות נכונה ומעודכנת. התפריט עוזר למבקרים, והצהרת הנגישות שהוא יוצר עוזרת לכם לעמוד בחובת ההצהרה, אבל האחריות לנגישות האתר נשארת אצלכם. כדאי שאיש מקצוע בתחום הנגישות יבדוק את האתר.
אם מישהו מבטיח לכם ש"תוסף נגישות" נותן חסינות מתביעות, אל תסמכו על זה. זה שיווק, לא חוק.
מה צריך
- גישה להגדרות של האתר (שם משתמש וסיסמה לניהול האתר, למשל לוח הבקרה של וורדפרס או של Wix).
- בערך חצי שעה (כולל הצהרת הנגישות).
אין צורך בהרשמה, בחשבון או בתשלום.
אם כבר מותקן באתר תפריט נגישות או תוסף נגישות אחר, הסירו אותו קודם. שני כפתורי נגישות באותו אתר מבלבלים את המבקרים.
שלב 1: הקוד להעתקה
זה הקוד שמוסיפים לאתר. העתיקו אותו כמו שהוא:
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right" }
};
</script>
<script src="https://shayach.co.il/v1/widget.js" defer></script>
מה יש בו:
- החלק הראשון (
window.A11yConfig) הוא ההגדרות: שפת התפריט היא עברית, והכפתור יופיע בפינה הימנית התחתונה. אפשר לשנות אותן בהמשך (ראו שינוי המראה של הכפתור). - החלק השני טוען את תפריט הנגישות עצמו.
איפה הקוד צריך להיות: "ממש לפני </body>". המשמעות: בסוף העמוד, אחרי כל התוכן. בפועל כמעט אף פעם לא צריך לחפש את המקום הזה בעצמכם: ברוב הפלטפורמות יש שדה שנקרא "קוד בתחתית האתר" (Footer code) או "סוף ה-Body" (Body end), ומה שמדביקים בו נכנס בדיוק למקום הנכון ובכל עמודי האתר. בשלב הבא יש הוראות לכל פלטפורמה.
את הקוד מוסיפים פעם אחת לכל האתר, לא לכל עמוד בנפרד.
שלב 2: הדבקת הקוד באתר
בחרו את הפלטפורמה שעליה בנוי האתר שלכם. שימו לב: שמות התפריטים בפלטפורמות משתנים מדי פעם. אם תפריט נראה אחרת מהמתואר כאן, חפשו בדפי העזרה של הפלטפורמה "הוספת קוד לכל האתר" או "custom code".
וורדפרס (WordPress)
משתמשים בתוסף חינמי שמוסיף קוד לתחתית האתר. הדוגמה כאן היא התוסף WPCode.
- היכנסו ללוח הבקרה של האתר.
- בתפריט הצד, לחצו על תוספים ואז על הוספת תוסף (Plugins, Add New Plugin).
- בשדה החיפוש כתבו
WPCode. - בתוסף WPCode (שנקרא גם Insert Headers and Footers), לחצו התקנה ואז הפעלה.
- בתפריט הצד יופיע Code Snippets. לחצו עליו ואז על Header & Footer.
- הדביקו את הקוד בתיבה Footer.
- לחצו Save Changes (שמירת שינויים).
באתר WordPress.com (ולא וורדפרס באחסון עצמאי), אפשר להוסיף קוד כזה רק בחבילה שמאפשרת התקנת תוספים.
אם באתר יש תוסף מטמון (למשל WP Rocket או LiteSpeed Cache), נקו את המטמון שלו אחרי השמירה, אחרת ייתכן שהכפתור לא יופיע מיד.
Wix
נדרשת חבילת פרימיום עם דומיין מחובר. בלי זה Wix לא מאפשרת להוסיף קוד.
- היכנסו ללוח הבקרה של האתר ב-Wix.
- לחצו על הגדרות (Settings).
- גללו עד קוד מותאם אישית (Custom Code) ולחצו עליו.
- לחצו הוספת קוד מותאם אישית (Add Custom Code).
- הדביקו את הקוד בתיבה, ותנו לו שם, למשל "תפריט נגישות".
- תחת "הוספת קוד לעמודים" בחרו כל העמודים (All pages), וגם טעינת הקוד פעם אחת (Load code once).
- תחת "מיקום הקוד" בחרו Body - end (סוף ה-Body).
- לחצו אישור (Apply).
Shopify
- בממשק הניהול של Shopify, לחצו Online Store ואז Themes.
- ליד ערכת העיצוב הפעילה, לחצו על כפתור שלוש הנקודות ובחרו Edit code.
- בתיקייה Layout, לחצו על הקובץ
theme.liquid. - חפשו בקובץ את
</body>(לחיצה על Ctrl+F, או Cmd+F במק, ואז הקלדת</body>). - הדביקו את הקוד בשורה שמעל
</body>. - לחצו Save.
הקוד נשמר בתוך ערכת העיצוב. אם מחליפים ערכת עיצוב, צריך להדביק אותו שוב. שימו לב: קוד בערכת העיצוב לא מגיע לעמודי התשלום (checkout) של Shopify, ולכן הכפתור לא יופיע בהם.
Webflow
נדרשת חבילת אתר בתשלום (Site plan). בלי זה Webflow לא מאפשרת קוד מותאם.
- פתחו את הפרויקט ולחצו Site settings.
- עברו ללשונית Custom code.
- הדביקו את הקוד בתיבה Footer code.
- לחצו Save changes.
- פרסמו את האתר מחדש (Publish).
Squarespace
הוספת קוד (Code Injection) זמינה רק בחלק מהחבילות בתשלום. אם האפשרות לא מופיעה אצלכם, בדקו בדפי העזרה של Squarespace אילו חבילות כוללות אותה.
- היכנסו לניהול האתר ולחצו Settings.
- לחצו Developer Tools (או Advanced, לפי הגרסה) ואז Code Injection.
- הדביקו את הקוד בתיבה Footer.
- לחצו Save.
אתר HTML רגיל
- פתחו כל קובץ עמוד באתר (קובץ שמסתיים ב-
.html) בעורך טקסט. - חפשו את
</body>. - הדביקו את הקוד בשורה שמעליו.
- שמרו והעלו את הקבצים לשרת.
אם לכל העמודים יש קובץ תחתית משותף, מספיק להדביק את הקוד בו פעם אחת.
האתר נבנה על ידי מפתח או בכלי AI
אם מישהו אחר בנה את האתר, או שהוא נבנה בכלי AI (כמו Lovable, Bolt, v0 או Cursor), שלחו למפתח או לכלי את ההודעה הזאת:
אני רוצה להוסיף לאתר את תפריט הנגישות שייך (Shayach), כולל עמוד הצהרת נגישות וקישור אליו בתחתית כל עמוד. ההוראות המלאות כאן: https://shayach.co.il/docs/ai-agents.md שפת התפריט: עברית. מיקום הכפתור: למטה מימין. את פרטי הצהרת הנגישות אמסור לך, ואין להמציא פרטים שלא מסרתי.
Google Sites
ב-Google Sites אי אפשר להוסיף קוד שפועל בכל האתר, ולכן אי אפשר להתקין שם את תפריט הנגישות.
שלב 3: בדיקה שהכול עובד
- פתחו את האתר (אחרי שמירה ופרסום) ורעננו את העמוד.
- חכו כמה שניות. בפינה הימנית התחתונה יופיע כפתור עגול עם סמל נגישות.
- לחצו על הכפתור. ייפתח "תפריט נגישות".
- לחצו על הכרטיס "התאמות טקסט" כדי לפתוח אותו, ובו, ליד "גודל גופן", לחצו על כפתור הפלוס (+). הטקסט בעמוד אמור לגדול.
- לחצו "איפוס הגדרות" בתחתית התפריט כדי להחזיר הכול למצב הרגיל.
הכפתור לא הופיע? ראו כשמשהו לא עובד.
שינוי המראה של הכפתור
כל ההגדרות נמצאות בחלק הראשון של הקוד, בין window.A11yConfig = { לבין };. כדי לשנות משהו, מחליפים את החלק הראשון שהדבקתם בשלב 2 בדוגמה המתאימה מכאן, ושומרים. החלק השני (השורה שמתחילה ב-<script src=) נשאר בדיוק כמו שהוא.
כמה כללים פשוטים:
- כותבים את הערכים בדיוק כמו בדוגמה, כולל המירכאות (
") והפסיקים. - אם כתבתם ערך שהתפריט לא מכיר (למשל מיקום שלא קיים), הוא יתעלם ממנו וישתמש בברירת המחדל.
- אבל טעות בסימנים עצמם, כמו פסיק חסר או מירכאות מיותרות, מבטלת את כל ההגדרות: הכפתור חוזר למראה הרגיל, והצהרת הנגישות מציגה את כל הפרטים כחסרים. לכן אחרי כל שינוי, בדקו שהכול עדיין עובד.
- אם בטקסט שלכם יש מירכאות (כמו בע"מ), כתבו את הסימן העברי ״ (בע״מ), או הוסיפו לוכסן לפני המירכאות:
בע\"מ. מירכאות רגילות בתוך הטקסט ישבשו את כל ההגדרות. - כדאי להעתיק מכאן ולא להקליד, וגם לא להעתיק דרך Word, שמחליף מירכאות רגילות במירכאות מעוצבות.
מיקום הכפתור
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-left" }
};
</script>
במקום bottom-left אפשר לכתוב אחד מאלה:
| איפה הכפתור יופיע | מה לכתוב |
|---|---|
| למעלה מימין | top-right |
| למעלה משמאל | top-left |
| גבוה מימין (רבע מהגובה) | upper-right |
| גבוה משמאל (רבע מהגובה) | upper-left |
| באמצע הצד הימני | middle-right |
| באמצע הצד השמאלי | middle-left |
| נמוך מימין (שלושה רבעים מהגובה) | lower-right |
| נמוך משמאל (שלושה רבעים מהגובה) | lower-left |
| למטה מימין | bottom-right |
| למטה משמאל | bottom-left |
המבקרים באתר יכולים להזיז את הכפתור בעצמם: לגרור אותו לאחד מעשרת המקומות, או לבחור מקום בכרטיס "מיקום הכפתור" שבתפריט. הבחירה שלהם נשמרת רק בדפדפן שלהם ורק בכתובת האתר שבה בחרו (www.example.co.il ו-example.co.il נחשבות לשתי כתובות), ו"איפוס הגדרות" מחזיר את הכפתור למקום שקבעתם. כדי שהכפתור יישאר תמיד במקום שקבעתם, הוסיפו draggable: false:
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-left", draggable: false }
};
</script>
המקומות upper-right, upper-left, lower-right ו-lower-left נוספו בגרסה 1.6.0. עותק ישן של הקוד ששמור בדפדפן של מבקר יציג את הכפתור בברירת המחדל עד שהדפדפן יטען את הגרסה החדשה, בדרך כלל תוך דקות.
צבע
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right" },
theme: { primary: "#0a7d4f" }
};
</script>
הקוד #0a7d4f הוא צבע ירוק. החליפו אותו בקוד הצבע של העסק שלכם (קוד שמתחיל ב-#, אפשר למצוא אותו בהגדרות העיצוב של האתר או בכלי "בוחר צבעים" באינטרנט). הצבע הזה צובע את הכפתור ואת הכותרת של התפריט. אם הטקסט על הצבע שבחרתם לא יהיה קריא, התפריט יבחר לבד שחור או לבן.
צבע פס הגלילה
פס הגלילה בתוך התפריט ובחלון של הצהרת הנגישות צבוע כברירת מחדל בצבע התפריט. כדי לבחור צבע אחר:
theme: { primary: "#B93A22", scrollbar: "#3B2032" }
צבע שלא בולט מספיק מול הרקע של התפריט מוחלף אוטומטית בצבע הטקסט.
צורה
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right", shape: "pill" }
};
</script>
במקום pill אפשר לכתוב:
| צורה | מה לכתוב |
|---|---|
| עיגול (ברירת המחדל) | circle |
| ריבוע עם פינות מעוגלות | rounded |
| כפתור מוארך עם הכיתוב "נגישות" | pill |
| לשונית שצמודה לצד המסך, עם הכיתוב "נגישות" | edge-tab |
גודל
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right", size: 64 }
};
</script>
הגודל נמדד בפיקסלים: מספר בין 44 ל-96. ברירת המחדל היא 56. כותבים את המספר בלי מירכאות.
כיתוב על הכפתור
הכיתוב מופיע רק בצורות pill ו-edge-tab. ברירת המחדל היא "נגישות". כדי לשנות אותו:
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right", shape: "pill", labelText: "תפריט נגישות" }
};
</script>
עד 40 תווים.
מרחק מהקצה
אם הכפתור מסתיר משהו באתר (למשל כפתור צ'אט), אפשר להרחיק אותו מהקצה:
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right", offsetX: 20, offsetY: 100 }
};
</script>
המספר offsetX הוא המרחק מהצד, והמספר offsetY הוא המרחק מלמטה (או מלמעלה), בפיקסלים, מ-0 עד 200. ברירת המחדל היא 20.
מיקום אחר בטלפון
אפשר לקבוע לטלפונים מיקום או גודל אחרים:
<script>
window.A11yConfig = {
language: "he",
icon: {
position: "middle-right",
mobile: { position: "bottom-right", size: 48 }
}
};
</script>
הכול יחד
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-left", shape: "pill", size: 64, labelText: "נגישות" },
theme: { primary: "#0a7d4f" }
};
</script>
<script src="https://shayach.co.il/v1/widget.js" defer></script>
הצהרת הנגישות
מה זה ולמה צריך
הצהרת נגישות היא עמוד באתר שמסביר למבקרים מה נעשה כדי להנגיש את האתר, מה עדיין לא נגיש, ואל מי לפנות בבעיות נגישות. החוק מחייב אתרים לפרסם הצהרת נגישות.
כאן לא צריך לכתוב אותה בעצמכם: ממלאים כמה פרטים, והמערכת יוצרת הצהרה מסודרת לפי התבנית הרשמית של נציבות שוויון זכויות לאנשים עם מוגבלות, ומעדכנת את הנוסח כשהדרישות משתנות. ההצהרה זמינה בעברית, בערבית, ברוסית ובאנגלית.
שלב א: למלא את הפרטים
הדרך הקלה: בעמוד ההגדרה יש שלב "הצהרת נגישות" עם טופס קצר ותצוגה מקדימה. ממלאים, והקוד המוכן כבר כולל את הפרטים ואת הכתובת של עמוד ההצהרה, יחד עם הוראות ליצירת העמוד בכל פלטפורמה. בראש השלב בוחרים את שפות ההצהרה: עברית, אנגלית או שתיהן. באתר באנגלית ההצעות המוכנות כתובות באנגלית, ובאתר בשתי השפות ממלאים כל פרט בשתיהן. אפשר גם למלא ידנית לפי התבנית שכאן:
מחליפים את כל הקוד שהדבקתם בשלב 2 בתבנית הזאת, וממלאים בה את הפרטים שלכם. אם כבר שיניתם את מיקום הכפתור או את הצבע, השאירו גם את ההגדרות האלה. (ב-Wix עושים את זה אחרת: ראו ב-Wix בשלב ב.)
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right" },
statementUrl: "/accessibility-statement",
statement: {
organizationName: "", // שם העסק
updatedAt: "", // התאריך של היום, למשל 2026-10-02
adjustments: [
// כל התאמה בין מירכאות, עם פסיק בין התאמות, למשל:
// "לכל התמונות באתר יש תיאור טקסטואלי",
// "אפשר לנווט באתר באמצעות המקלדת"
],
coordinator: {
name: "", // שם רכז הנגישות
phone: "", // טלפון
email: "" // דוא"ל
}
}
};
</script>
<script src="https://shayach.co.il/v1/widget.js" defer></script>
כל עוד לא מילאתם את הפרטים, בראש ההצהרה תופיע רשימה של הפרטים שחסרים. ההצהרה אף פעם לא ממציאה פרטים. כך ממלאים כל שורה (כל השדות כאן הם חובה):
- שם העסק (
organizationName): כותבים את שם העסק או הארגון בין שתי המירכאות. - תאריך העדכון (
updatedAt): התאריך שבו בדקתם ועדכנתם את ההצהרה, בסדר שנה-חודש-יום. לדוגמה, 2 באוקטובר 2026 נכתב"2026-10-02". בכל פעם שמשנים משהו בהצהרה, מעדכנים גם את התאריך. - ההתאמות שבוצעו (
adjustments): מה נעשה באתר עצמו כדי להנגיש אותו. כל התאמה כתובה בתוך מירכאות, ובין התאמה להתאמה יש פסיק. בתבנית יש שתי דוגמאות בשורות שמתחילות בשני לוכסנים (//): השורות האלה הן הערות בלבד, והמערכת מתעלמת מהן. כדי להשתמש בשורה, מוחקים את שני הלוכסנים שבתחילתה ומתאימים את הטקסט. כתבו רק דברים שנעשו באמת. אין צורך לכתוב על תפריט הנגישות: ההצהרה מוסיפה שורה עליו לבד. - רכז הנגישות (
coordinator): האדם שאליו פונים בנושאי נגישות: שם, טלפון ודוא"ל. חייב להופיע לפחות טלפון או דוא"ל (שם לבד לא מספיק). אם אין רכז נגישות, כתבוcontactבמקוםcoordinator, באותו מבנה, עם פרטי איש הקשר לנושא נגישות. - שירות במקום פיזי: חובה להוסיף אחת משתי השורות שבהמשך, בתוך
statement, אחרי הסוגר}של רכז הנגישות. שימו פסיק אחרי הסוגר הזה.
אם אין לעסק מקום פיזי שמקבל קהל (למשל חנות אונליין בלבד), מוסיפים את השורה:
noPhysicalService: true
אם יש מקום כזה (חנות, משרד, מרפאה), מוסיפים במקומה שורה שמתארת במילים פשוטות את הסדרי הנגישות בו, למשל:
physicalArrangements: "בכניסה למשרד יש רמפה, ובבניין יש מעלית ושירותי נכים"
כך נראה הסוף של החלק statement אחרי ההוספה (בדוגמה, עסק בלי מקום פיזי):
coordinator: {
name: "", // שם רכז הנגישות
phone: "", // טלפון
email: "" // דוא"ל
},
noPhysicalService: true
}
השורה statementUrl אינה חלק מפרטי ההצהרה: היא הכתובת של עמוד ההצהרה, והיא נדרשת כדי שגם תפריט הנגישות יקשר אליו. זו הדרך השנייה להגיע להצהרה (ראו שלב ג).
שדות רשות
אפשר להוסיף גם את השדות האלה, כל אחד בשורה משלו בתוך statement: { ... }, עם פסיק בסוף השורה הקודמת. שדות שמסומנים "רשימה" מקבלים כמה פריטים, כמו ההתאמות:
- תיאור העסק (
organizationDescription): שורה אחת שמתארת את העסק או את האתר. - מחויבות (
commitment): כמה מילים משלכם על המחויבות לנגישות. - תדירות הבדיקה (
reviewFrequency): כל כמה זמן בודקים את נגישות האתר, למשל"אחת לחצי שנה". - צעדים לשמירה על נגישות (
measures, רשימה): למשל בדיקות תקופתיות או הדרכת עובדים. - מגבלות ידועות (
knownLimitations, רשימה): חלקים באתר שעדיין לא נגישים, במילים פשוטות, למשל"לסרטונים בארכיון אין כתוביות". עדיף לכתוב את זה בגלוי. - דפדפנים (
browsers, רשימה): הדפדפנים שבהם האתר נבדק. - טכנולוגיות מסייעות (
assistiveTech, רשימה): טכנולוגיות מסייעות (כמו קוראי מסך) שאיתן האתר נבדק. - רמת הנגישות (
conformanceLevel): למשל"AA". כתבו את זה רק אם האתר נבדק בפועל ברמה הזאת, למשל בבדיקה של מורשה נגישות. בלי השדה הזה ההצהרה פשוט לא מציינת רמה. - תקנים נוספים (
additionalStandards, רשימה): תקנים נוספים שהאתר נבדק מולם. - תכני צד ג' (
thirdPartyPages): עמודים שהתוכן שלהם מגיע מגורם אחר. - הודעות זמניות (
temporaryNotices): הודעות על תקלת נגישות זמנית. מוחקים כשהתקלה מתוקנת. - שלב ההנגשה (
stage): אם האתר עדיין בתהליך הנגשה, תיאור השלב ומועד הסיום המשוער. - פטורים (
exemptions): אם אתם נשענים על פטור מהחוק (ראו פטורים).
הפורמט המדויק של כל שדה מופיע בתיעוד הטכני. אם משהו לא ברור, אפשר לבקש ממפתח או מכלי AI להוסיף את השדה לפי התיעוד.
טקסט ביותר משפה אחת. הטקסט שאתם כותבים מוצג כמו שכתבתם אותו בכל שפה שההצהרה מוצגת בה, לכן כתבו אותו בשפת האתר. אם האתר שלכם מוצג בכמה שפות, אפשר לתת לכל טקסט נוסח בכל שפה: במקום מירכאות אחת, כותבים סוגריים מסולסלים עם קוד השפה לפני כל נוסח (he עברית, ar ערבית, ru רוסית, en אנגלית). לדוגמה:
organizationName: { he: "מאפיית הדוגמה", en: "Example Bakery" },
ההצהרה מציגה את הנוסח בשפה שלה. אם אין נוסח בשפה הזאת, היא מציגה את הנוסח בשפת האתר. בעמוד ההגדרה הקוד הזה נבנה לבד כשבוחרים שתי שפות. מספרי טלפון, כתובות דוא"ל ותאריכים כותבים פעם אחת בלבד.
שלב ב: ליצור עמוד הצהרת נגישות
- צרו באתר עמוד חדש בשם הצהרת נגישות. אם אפשר לבחור את כתובת העמוד, בחרו
accessibility-statement. - הוסיפו לעמוד רכיב שמקבל קוד HTML:
- בוורדפרס: הבלוק HTML מותאם אישית (Custom HTML). באתר שנבנה ב-Elementor: הווידג'ט HTML.
- ב-Webflow: הרכיב Code Embed.
- ב-Squarespace: הבלוק Code.
- ב-Shopify: בעורך העמוד, הכפתור Show HTML (הסמל
<>). - ב-Wix: ראו את ההוראות המיוחדות בהמשך.
- הדביקו ברכיב את הקוד הזה:
<div data-shayach-statement data-layout="blocks"></div>
<script src="https://shayach.co.il/v1/statement.js" defer></script>
- שמרו, פרסמו ופתחו את העמוד. ההצהרה המלאה אמורה להופיע בו.
החלק data-layout="blocks" מציג את ההצהרה בתיבות מסודרות, כמו בתצוגה המקדימה שבעמוד ההגדרה, בגופן ובצבעים של האתר. בלעדיו ההצהרה מוצגת כטקסט רגיל, עם כותרות ורשימות בעיצוב של האתר.
אם ההצהרה לא מופיעה, ייתכן שהפלטפורמה מסננת קוד שמודבק בתוך עמוד. במקרה כזה שלחו למפתח את ההודעה המוכנה משלב 2.
הפרטים עצמם (שם העסק, אנשי קשר וכו') כבר נמצאים בקוד שבכל האתר, משלב א, ולכן בעמוד עצמו מספיקות שתי השורות האלה.
ב-Wix
רכיב הקוד של Wix (הטמעת קוד, Embed HTML) נפתח בתוך מסגרת נפרדת שלא רואה את הקוד שבשאר האתר. לכן ב-Wix פרטי ההצהרה נמצאים רק ברכיב שבעמוד ההצהרה:
- בקוד של כל האתר (בהגדרות, תחת "קוד מותאם אישית") השאירו רק את ההגדרות של הכפתור ואת
statementUrl, בלי החלקstatement:
<script>
window.A11yConfig = {
language: "he",
icon: { position: "bottom-right" },
statementUrl: "/accessibility-statement"
};
</script>
<script src="https://shayach.co.il/v1/widget.js" defer></script>
- בעמוד ההצהרה, הוסיפו רכיב הטמעת קוד (Embed HTML), הדביקו בו את הקוד הזה, ומלאו בו את הפרטים כמו שמוסבר בשלב א (כולל השורה של המקום הפיזי):
<script>
window.A11yConfig = {
statement: {
organizationName: "", // שם העסק
updatedAt: "", // התאריך של היום, למשל 2026-10-02
adjustments: [
// כל התאמה בין מירכאות, עם פסיק בין התאמות, למשל:
// "לכל התמונות באתר יש תיאור טקסטואלי",
// "אפשר לנווט באתר באמצעות המקלדת"
],
coordinator: {
name: "", // שם רכז הנגישות
phone: "", // טלפון
email: "" // דוא"ל
}
}
};
</script>
<div data-shayach-statement data-layout="blocks" data-lang="he"></div>
<script src="https://shayach.co.il/v1/statement.js" defer></script>
- הגדילו את הרכיב בעמוד כך שכל ההצהרה תיראה.
כך יש לפרטים מקום אחד בלבד, וכשמעדכנים אותם, מעדכנים רק ברכיב הזה.
שלב ג: לקשר להצהרה בשתי דרכים
לפי המדריך של נציבות שוויון זכויות לאנשים עם מוגבלות, צריכות להיות לפחות שתי דרכים להגיע להצהרת הנגישות, עם אותו שם לקישור. החלון של ההצהרה בתוך תפריט הנגישות לבדו לא מספיק. לכן עושים את שני הדברים:
- קישור בתחתית האתר: הוסיפו בתחתית האתר (Footer) קישור לעמוד ההצהרה, בשם הצהרת נגישות. בכל הפלטפורמות עושים את זה בעורך של תחתית האתר, כמו כל קישור אחר.
- קישור מתפריט הנגישות: בקוד שבכל האתר (משלב א), השורה
statementUrlצריכה להכיל את הכתובת של עמוד ההצהרה. אם הכתובת היאhttps://www.example.co.il/accessibility-statement, מספיק לכתוב:
statementUrl: "/accessibility-statement",
אם עמוד ההצהרה קיבל כתובת אחרת, העתיקו אותה משורת הכתובת של הדפדפן והדביקו בין המירכאות. מעכשיו, הקישור "הצהרת נגישות" בתחתית תפריט הנגישות יפתח את העמוד. בכרטיס "על תפריט הנגישות" שבתפריט יש גם כפתור שמציג את ההצהרה המלאה בחלון בתוך האתר, עם כפתור הדפסה. החלון לבדו לא מספיק: צריך גם את העמוד ואת הקישור בתחתית האתר.
חשוב: ההצהרה חייבת להיות נכונה
- כתבו רק דברים שנכונים. הצהרה שמתארת התאמות שלא נעשו גרועה יותר מהצהרה שמודה במגבלות.
- את רמת הנגישות (
conformanceLevel) כותבים רק אם האתר נבדק בפועל. - ההצהרה לעולם לא תכתוב שהאתר "נגיש באופן מלא".
- בכל שינוי באתר או בפרטים, עדכנו את ההצהרה ואת התאריך (
updatedAt).
פטורים
יש עסקים קטנים שעשויים להיות פטורים מחובות הנגישות לאתרים, בתנאים מסוימים. אל תניחו שאתם פטורים: שני המקורות הרשמיים לא אומרים אותו דבר, והמערכת הזאת לא קובעת מי פטור.
- התקנות: תקנה 35ו(ז), בנוסח המשולב באתר נבו, פוטרת עוסק פטור או נותן שירות שמחזור העסקאות השנתי הממוצע שלו אינו עולה על 100,000 ש"ח.
- הנציבות: המדריך "נגישות אתרי אינטרנט" של נציבות שוויון זכויות לאנשים עם מוגבלות (עודכן ב-16.03.2026, באתר gov.il) מציין סף של 120,000 ש"ח.
- הפער: מכיוון ששני המקורות שונים, אם אינכם עוסק פטור והמחזור שלכם בין 100,000 ל-120,000 ש"ח, אל תניחו שאתם פטורים. כדאי לבדוק מול הנציבות או מול עורך דין.
- אתרים ותיקים: נותן שירות שהמחזור השנתי הממוצע שלו עד 1,000,000 ש"ח עשוי להיות זכאי לפטור לשלוש שנים, שאפשר לחדש, רק לאתר שהופעל לראשונה לפני 26 באוקטובר 2017, ובתנאי שפרטי הקשר שלו מפורסמים באופן נגיש. אתר חדש חייב להיות נגיש.
- רשויות ציבוריות: לפי הנציבות, הפטורים האלה לא חלים על רשויות ציבוריות.
אם בדקתם והתברר שאתם נשענים על פטור לחלק מהאתר, אפשר לציין את זה בהצהרה (השדה exemptions, ראו התיעוד הטכני). זה אינו ייעוץ משפטי.
כשמשהו לא עובד
הכפתור לא מופיע
- חכו כמה שניות ורעננו. הכפתור מופיע רק אחרי שהעמוד נטען.
- ודאו שהשינוי נשמר ופורסם. בחלק מהפלטפורמות (Webflow, למשל) צריך לפרסם את האתר מחדש.
- פתחו את האתר בחלון גלישה בסתר. כך רואים את הגרסה החדשה ולא גרסה שמורה ישנה. בוורדפרס עם תוסף מטמון (כמו WP Rocket או LiteSpeed Cache), נקו גם את המטמון של התוסף.
- בדקו שהקוד במקום הנכון ושלם. הוא צריך להיות בשדה של כל האתר (Footer או Body end), ולא בתוך עמוד אחד. בדקו שהעתקתם את שני החלקים, מ-
<script>הראשון ועד</script>האחרון. - בדקו את המירכאות. אם העתקתם דרך Word או דרך אפליקציית הודעות, ייתכן שהמירכאות הוחלפו במירכאות מעוצבות. העתיקו שוב ישירות מהמדריך הזה.
- אולי הכפתור הוסתר. בתפריט יש כפתור "הסתרת הווידג'ט". מי שלחץ עליו לא יראה את הכפתור עד שיסגור את לשונית הדפדפן ויפתח את האתר מחדש.
- הגדרות אבטחה של האתר (CSP). יש אתרים עם הגדרת אבטחה שחוסמת קוד שמגיע מאתרים אחרים. אם כך, שלחו למפתח או לחברת האחסון את ההודעה הזאת:
באתר שלנו יש Content Security Policy שחוסם את תפריט הנגישות. יש לאפשר את הכתובת https://shayach.co.il גם ב-script-src וגם ב-font-src. פירוט: https://shayach.co.il/docs/ai-agents.md#content-security-policy
הגופן לדיסלקציה לא נראה שונה בעברית
זה תקין. הגופן לדיסלקציה (OpenDyslexic) קיים רק לאותיות לועזיות. טקסט בעברית, בערבית וברוסית מוצג בגופן Arial. אם מופיעה ההודעה "לא ניתן לטעון את הגופן", כנראה שהגדרות האבטחה של האתר חוסמות אותו: שלחו למפתח את ההודעה שלמעלה (החלק של font-src).
ההקראה לא זמינה
ההקראה משתמשת בקולות שמותקנים במכשיר של המבקר. בחלק מהמחשבים אין קול בעברית או בערבית, ואז הכפתור מושבת עם הסבר. זה תלוי במכשיר של המבקר ולא באתר שלכם. בטלפונים (אייפון ואנדרואיד) ובדפדפן Edge יש בדרך כלל קולות טובים בעברית.
מדריך הקריאה ומסכת הקריאה לא עובדים בטלפון
הם עובדים עם עכבר בלבד, ולכן במכשיר מגע בלי עכבר (טלפון או טאבלט) הם מושבתים עם הסבר. זה תקין.
הכפתור מסתיר משהו באתר
שנו את המיקום שלו או את המרחק מהקצה (ראו מיקום הכפתור ומרחק מהקצה). אפשר גם לקבוע מיקום אחר רק לטלפונים (ראו מיקום אחר בטלפון). גם המבקרים יכולים להזיז את הכפתור בעצמם, בגרירה או בכרטיס "מיקום הכפתור".
הכפתור לא נמצא במקום שקבעתם
אם הזזתם את הכפתור בעצמכם (בגרירה או בכרטיס "מיקום הכפתור"), הדפדפן שלכם זוכר את המקום שבחרתם, והוא גובר על המיקום שבהגדרות. לחצו "איפוס הגדרות" בתחתית התפריט, והכפתור יחזור למקום שקבעתם. זה קורה רק בדפדפן שבו הזזתם את הכפתור.
בראש ההצהרה מופיעה רשימה של פרטים חסרים
אחד מפרטי החובה לא מולא, או נכתב בפורמט שגוי (למשל תאריך שלא בסדר שנה-חודש-יום, או דוא"ל לא תקין). השלימו אותו לפי שלב א.
אם כל הפרטים מופיעים כחסרים, כנראה שחסר פסיק או שיש מירכאות בתוך טקסט (ראו הכללים הפשוטים).
עדכונים
אין צורך לעשות שום דבר. כל עדכון של התפריט ושל נוסח ההצהרה מגיע לאתר שלכם לבד, תוך דקות, בלי לגעת בקוד. כתובת הקוד (/v1/) לא משתנה.
לעתים רחוקות, שינוי בחוק דורש מכם פרט חדש (למשל שדה חדש בהצהרה). שינויים כאלה מסומנים ביומן השינויים (באנגלית) בתווית [Action required], שפירושה "נדרשת פעולה". כך קוראים אותו:
- פתחו את יומן השינויים.
- עברו על הגרסאות שיצאו מאז שהתקנתם את התפריט (לכל גרסה יש תאריך).
- חפשו שורות שמתחילות ב-[Action required]. כל שורה כזאת מסבירה בדיוק מה לשנות. שורות בלי התווית הזאת לא דורשות מכם כלום.
- שורות שמתחילות ב-[Legal] נובעות משינוי בחוק או בתקן, וכוללות קישור למקור הרשמי.
אם קשה לקרוא באנגלית, אפשר להדביק את השורה בכלי AI ולבקש הסבר בעברית.
חשוב לזכור
תפריט הנגישות והצהרת הנגישות עוזרים למבקרים ועוזרים לכם לעמוד בחובת ההצהרה, אבל הם לא מעניקים חסינות מתביעות ולא מחליפים את הנגשת האתר עצמו: תיאור לתמונות, ניגודיות צבעים מספקת, ניווט מלא במקלדת, טפסים עם תוויות, כותרות ברורות וכתוביות לסרטונים. כדאי שאיש מקצוע בתחום הנגישות יבדוק את האתר. המדריך הזה אינו ייעוץ משפטי.