הנגשת אתר וורדפרס מבוסס אלמנטור

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

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

 

מהו אלמנטור?

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

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

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

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

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

 

נגישות אתר וורדפרס מבוסס אלמנטור

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

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

 

האם השימוש באלמנטור יכול לספר את הנגישות באתר שלכם?

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

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

להלן מספר שאלות שנתייחס אליהם בהמשך:

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

הנגשת תמונות ועיצובים גרפיים שאינם טקסט באתר

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

 מצורפת תמונה להמחשה.

 

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

 

 

קביעת גודל הגופן ואופן היישום באתר

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

במסגרת שימוש באלמנטור, הפונט הדיפולטיבי (הראשוני) לרוב הקיים באתרים וורדפרס הוא פונט נגיש – ARIEL . במידה והחלטתם לשנות את הפונט, ודאו שבחרתם בפונט נגיש. מעוניינים לדעת עוד אודות פונט נגיש?  

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

דרך נוספת שתאפשר לכם להפוך את גודל הטקסט לנגיש יותר, השתדלו להשתמש ב- REM תחת גודל הפונט במקום ב-PX כלומר בגודל פיקסלים. הסיבה שעומדת מאחורי זה שאותו משתמש יכול לשנות את גודל טקסט בהתאם לרמת ראייתו. אם אנו משתמשים באתר באמצעות יחידת מידע PX – פיקסל, אנו מורידים את היכולת של אותו משתמש לשלוט בגודל הטקסט המתאים עבורו. לדוגמה במקום להגדיר את הכותרת תחת רמה H1 בגודל של 20 פיקסלים, ניתן להגדיר אותה כ-REM1.25. זה נכון שהמטרה שלנו שהכותרת תהיה בדיוק בגודל שאנו רוצים אנו רוצים, אם זאת למשתמש יש זכות לראות את הטקסט בגודל המתאים לו ביותר. ישנם ברשת האינטרנט מספר רב של כלים שיאפשרו לכם לחשב את גודל REM לעומת הגודל בפיקסלים. פשוט חפשו PIXELS TO REM CONVERTOR בגוגל ותקבלו אינספור כלים אינטרנטיים מהירים ופשוטים לשימוש.

 

שינוי גודל פונט נגיש לREM

 

תיוג נכון של כותרת לפי סדר היררכי

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

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

 

קביעת תגית כותרת מתאימה

 

 

קביעת ניגודיות צבעונית באתר

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

 

קביעת צבע טקסט לניגוד חזותי

 

 

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

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

 

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

 

 

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

מעוניינים לדעת עוד אודות הנגשת אתרי וורדפרס? צרו עימי קשר ואני מבטיח לחזור בשעות הקרובות!

שתפו פוסט זה

Share on facebook
Share on whatsapp
Share on linkedin
Share on twitter
Share on email

פוסטים נוספים בנושא הנגשת אתרים

איך כותבים הצהרת נגישות בהתאם להנחיות הנגישות

איך כותבים הצהרת נגישות

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

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

השאר פרטים ואנו מבטיחים לחזור אליך בשעות הקרובות

web-a הנגשת אתרים

חזרו אליי בבקשה לגבי
נגישות באינטרנט