למה בכלל אכפת לנו מנגישות בבוני-עמודים?

רוצים לקבל עדכונים על מאמרים חדשים?

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

איך נאספו הממצאים – תמצית קצרה של הבדיקות

צוות מומחי נגישות בחן תשע-עשרה תבניות ובוני-עמודים מובילים לוורדפרס במטרה לזהות איזה כלי מציע את נקודת הפתיחה הנגישה ביותר למי שמעוניין להעלות אתר מוכן לשימוש מבלי לגעת בקוד מורכב.
לשם כך הוקמו אתרי Staging זהים: פוסטים, טופס קשר, סליידר, אקורדיון וטאבים – תרחישים המדמים בונה אתרים טיפוסי שאינו מתכנת.
כל רכיב נבחן גם בסריקה אוטומטית וגם בבדיקה ידנית במקלדת בלבד, בקרייני-מסך NVDA ו-VoiceOver ובמצב Reduced-Motion כדי לוודא חוויה תקינה לכל משתמש.
הציון לכל כלי חושב לפי אחוז הרכיבים שעברו, כאשר כפתור שאינו נגיש ושדה ללא Autocomplete נספרו שניהם ככשל יחיד לשם שקיפות מתודולוגית.

מתודולוגיית הבדיקה – בקיצור ממוקד

רכיבים שנבדקו (מה בדיוק בחנו)

ניווט ראשי Skip Links ו-Landmarks

הבדיקה התחילה בהערכת מבנה ה-HTML של התפריט: שימוש ב-<nav role="navigation">‎, קיום Landmarks Header Main Footer וקישור דילוג “Skip to content” הנחשף בעת Focus.
הצוות ווידא שהקישור ממוקם בראש העמוד ברצף Tab, מוביל לעוגן בעל id תקין, ומוצג בצבע קונטרסטי כך שמשתמש מקלדת לא יפספס אותו.

אקורדיונים וטאבים – מבנה ARIA ואינטראקציה

הכותרות נדרשו להיות <button> או אלמנט עם role="button" וכן aria-expanded מתחלף בזמן אמת.
בטאבים נבחנה היררכיית role="tablist" ו-role="tab" עם aria-selected ודפוס ניווט במקשי חץ.
הקפדנו לבדוק שה-Tab Order טבעי, שה-Focus Ring גלוי ושקרייני-מסך מקריאים “לשונית פעילה” בזמן הבחירה.

טפסים – תוויות חיווי שגיאות ו-Autocomplete

לכל שדה הוצמד ‎

סליידרים קרוסלות ואפקטים בתנועה

נבדק האם מוצג כפתור Pause עם aria-label מתאים והאם Auto-Play ניתן לכיבוי.
הצוות בחן ניווט במקשי חיצים או Tab בתוך הסליידר והפעיל סקריפט prefers-reduced-motion כדי לוודא שהאנימציות נעצרות עבור מי שבחר בכך בהגדרות מערכת.

רכיבי תוכן דינמי – Loop Blocks רשימות אייקונים ומודלי חיפוש

Loop Blocks נדרשו להיות עטופים ב-<ul> או <section> סמנטי בשילוב כותרות מתאימות כדי לשמור על היררכיית ניווט לקוראי-מסך.
ברשימות אייקונים הוסתר האייקון טקסטואלית (aria-hidden="true") והוערכה ניגודיות האייקון לטקסט.
במודלי חיפוש נבדקה נעילת Focus בתוך הדיאלוג, שימוש role="dialog" ו-aria-modal="true" והחזרת Focus לפקד שפתח את המודל עם סגירתו.

בדיקות מקלדת ו-Screen Reader – תרחיש קצה עד לאימות מלא

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

הגדרת “מעבר” “דגל חשש” ו-“כשל”

רכיב סומן “עבר” אם פעל ללא צורך בשינוי קוד, “דגל חשש” אם דרשה הגדרה סמויה העלולה להתפספס, ו-“כשל” אם נדרש תיקון קוד ידני או תוסף חיצוני כדי לעמוד ב-WCAG 2.1 AA.
למרות שכל הכשלים שוקללו באופן שווה במספר, בהמשך המאמר מוסבר איך לזהות את הכשלים החוסמים ביותר ולתעדף אותם בתהליך הנגשת האתר.

סקירת הבונים – מהמובילים ועד המתעכבים

 

Brand Assets - Kadence WP

Kadence – מוביל הטבלה

רקע כללי

Kadence משלב תבנית קלת-משקל עם ספריית בלוקים רחבה, כך שסוכנויות הדורשות מהירות טעינה ו-SEO נקי נהנות מנקודת פתיחה נגישה במיוחד.

נקודות חוזק עיקריות

כל רכיבי הממשק סמנטיים ומוגדרים עם ARIA, Skip Links בולטים בעת Focus והטפסים כוללים ‎

חסרונות וכלים לעקיפה

סליידר הגלריה מפעיל Auto-Play ללא כפתור Pause ולכן מומלץ לכבות אנימציה או להוסיף כפתור ידני בעת הנגשת אתר.

המלצה מעשית

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

 

GenerateBlocks review: A new way to build fast WordPress sites (no code)

GeneratePress + GenerateBlocks – סוס העבודה הגמיש

רקע

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

חוזקות

ניווט סמנטי עם Skip Link גלוי, אקורדיונים כ-button עם aria-expanded ודגש על CSS מודולרי המאפשר מחלקת focus-visible גלובלית.

חולשות

ב-Tabs צבע Focus עשוי להיבלע ברקעים כהים ו-Placeholder בטפסים בהיר מדי לניגודיות תקנית.

טיפ ליישום מידי

יצירת Child Theme עם צבע ניגוד גבוה ושמירת Template בסיסי עם רכיבי Tabs נגישים יחסכו שעות תיקון בהמשך.

 

Greyd.Suite: All-in-one-WordPress Tool to Replace 15 Plugins

Greyd – עולה חדש עם פוטנציאל

רקע

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

חוזקות

Skip Link ו-Landmarks מלאים, ‎

חולשות

סליידר Auto-Play ללא Pause ואפקטי Parallax המתעלמים מ-Reduced-Motion.

טיפ ליישום מידי

הוספת מחלקת ‎.greyd-pause‎ וכפתור Pause תמנע תלונות רגולטוריות נפוצות באירופה.

 

Elementor Icon SVG Vector & PNG Free Download | UXWing

Elementor – הפופולרי שנדרש לשיפור

רקע

שחקן ותיק עם ממשק Drag & Drop עשיר, אך לא כל הווידג’טים עומדים בתקן נגישות אתרים.

חוזקות

ווידג’טים חדשים סמנטיים, לוח נגישות ייעודי וקהילת תוספים ענפה.

חולשות

אקורדיון ברירת-מחדל כ-div, חסר Autocomplete בשדות טופס וחלק מאפקטי Scroll לא מכבדים Reduced-Motion.

טיפ ליישום מידי

שמירת ספריית Templates עם רכיבי אקורדיון מוגדרים כ-button וחיווי ARIA מלא תקדם נגישות מיידית בכל פרויקט חדש.

 

Beaver Builder

Beaver Builder – קפיצה משמעותית ב-2025

רקע

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

חוזקות

Mega-Menu סמנטי, Tabs עם aria-selected דינמי ותוסף Companion Themer המוסיף Skip Links.

חולשות

כפתורי Ghost חסרי ניגוד תקני וסליידר Testimonials מבוסס Slick נטול Pause.

טיפ ליישום מידי

החלפת Slick בספרייה נגישה או ביטול Auto-Play יבטיחו חוויית משתמש תקינה.

 

Bricks Builder - Visual Site Builder for WordPress v2.0.1 - Nulled Download - EmpireGPL

Bricks – משתפר אך עדיין בתהליך

רקע

Bricks מייצר HTML נקי בזמן ריצה ונשען על JSON, ומקדם ביצועים ו-SEO.

חוזקות

Skip Link מובנה, Tabs כ-button עם aria-selected ואפשרות Toggle Focus Outline דרך הממשק.

חולשות

אקורדיון מוסיף tabindex-1 מיותר, סליידר חסר Pause ומתעלם מ-Reduced-Motion ו-Placeholder אפור מדי לניגוד.

טיפ ליישום מידי

יצירת תבנית-אב עם אקורדיון מתוקן ואיפוס Auto-Play ל-0 תמנע תקלות נפוצות.

 

תחתית הדירוג: Divi Brizy Live Composer

מה מעכב אותם

Divi ממשיך לבסס אקורדיונים וטאבים על div נטול ARIA, Brizy מוחק Skip Links של תבנית הבסיס ומטשטש Landmarks, בעוד Live Composer נשען על מערכת Widgets ותיקה שבה כפתורי CTA הם קישורים ריקים המונעים ניווט מקלדת רציף.

כיצד לתחזק אתר קיים

השלב הראשון הוא סריקה אוטומטית יסודית באמצעות Accessibility Checker, ולאחר מכן הזרקת פונקציות PHP להמרת אקורדיונים ל-button והוספת role="tablist". אם נפח הכשלים רב, כדאי לשקול מעבר הדרגתי לבונה מודרני כדי לחסוך בעלויות אחזקה עתידיות.

כלים משלימים

Brizy יכול להרוויח מהזרקת ‎skiplinks.js‎ קטן, Divi מפוליפיל focus-visible שמחזיר Outline, ול-Live Composer מומלץ לשלב Gravity Forms המוסיף ‎

 

 

 

השוואות ממוקדות ברכיבי-מפתח

טפסים – מי מוביל בנגישות Out-Of-The-Box

Kadence מציג ‎

סליידרים – כפתור Pause ושאר צרות

Beaver Builder עודו משתמש ב-Slick נטול כפתור Pause, Bricks ו-Greyd משתמשים ב-Swiper אך לא מוסיפים כפתור עצירה, בעוד Kadence מספק כפתור Pause ומכבד Reduced-Motion ולכן מהווה בחירה טבעית למי שמבקש להנגיש אתר בקלות.

קישורי דילוג ו-Landmarks

GeneratePress Kadence ו-Beaver Themer מציגים Skip Link בולט, Brizy מוחק את הדילוגים ודורש הזרקת סקריפט, Divi מסתיר את הדילוג ב-CSS ויש להפוך אותו לגלוי בעת Focus.

המלצות יישומיות לאנשי SEO מפתחים ומנהלי תוכן

בניית צ’קליסט קבוע לפרויקט

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

שילוב אוטומציה לסריקות תקופתיות

חיבור Accessibility Checker לסביבת Staging יניב דוח שבועי ויסייע לגלות כשלים לפני עלייה לפרודקשן, ואילו Job CI/CD המריץ Lighthouse במצב נגישות בכל Deploy יאתר כשלי צבע או ARIA שנבטו בעדכון האחרון.

עבודה חכמה מול מפתחי הבונה

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

 

נגישות היא מסע מתמשך

הצעדים הבאים שלך

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

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

איך מולטינט יכולה לעזור?

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

פנה אלינו כדי להפוך כל פרויקט ל-Accessible First ולהוביל הן בחוויית המשתמש והן בדירוגי גוגל.

שאלות ותשובות בנושא נגישות אתרים

למה נגישות אתרים חשובה כל כך בבוני עמודים?

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

אילו בעיות נגישות נפוצות יוצרים בוני עמודים?

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

איך בודקים את רמת הנגישות של אתר שנבנה עם בונה עמודים?

הבדיקה מתחילה בכלים אוטומטיים כמו WAVE, axe DevTools ו-Lighthouse שסורקים את האתר ומזהים בעיות נגישות אתרים בסיסיות.
לאחר הבדיקה האוטומטית, חיוני לבצע בדיקה ידנית: ניווט באתר עם מקלדת בלבד, בדיקה עם קורא מסך, והערכת ניגודיות צבעים.
במולטינט אנחנו מבצעים בדיקות נגישות אתרים מקיפות שכוללות גם בדיקה אוטומטית וגם ידנית, כי אף כלי אוטומטי לא מזהה 100% מהבעיות.

האם תוסף נגישות מספיק כדי להפוך אתר לנגיש?

תוסף נגישות (Accessibility Widget) מספק שכבת נגישות אתרים בסיסית כמו הגדלת טקסט ושינוי ניגודיות, אך הוא לא פתרון מלא ולא מחליף בנייה נגישה מהיסוד.
גופים רגולטוריים ובתי משפט כבר קבעו שתוסף נגישות בלבד אינו מספיק כדי לעמוד בתקנות, ונדרשת הנגשה ברמת הקוד וה-HTML.
הפתרון הנכון הוא שילוב: בנייה נגישה מהשלב הראשון, הנגשת קוד, ותוסף נגישות כשכבה נוספת שמשלימה ולא מחליפה.

מה הקשר בין נגישות אתרים לקידום אורגני (SEO)?

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

מה החוק אומר על נגישות אתרים בישראל?

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

איך בוחרים בונה עמודים שתומך בנגישות?

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

מה זה WCAG ואיך זה קשור לנגישות אתרים?

WCAG (Web Content Accessibility Guidelines) הוא תקן בינלאומי שמגדיר את הדרישות לנגישות אתרים, עם שלוש רמות: A, AA ו-AAA.
רוב התקנות בישראל ובעולם דורשות עמידה ברמת AA של WCAG, שכוללת דרישות כמו ניגודיות צבעים מינימלית, ניווט מקלדת, תוויות לטפסים ותיאורי Alt.
נגישות אתרים לפי WCAG מתבססת על ארבעה עקרונות: נתפס (Perceivable), מופעל (Operable), מובן (Understandable), ועמיד (Robust).

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

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

מה הצעדים הראשונים להנגשת אתר קיים?

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