תבניות, רכיבים ומערכות תכנון

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

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

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

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

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

חשיבה ביקורתית

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

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

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

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

משאבים קיימים

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

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

• רכיבים נגישים
• ספריית ARIA של Deque University
• Gov.UK Design System
• רכיבים כוללים
• MagentaA11y
• U.S. Web Design System (USWDS), שנוצר עבור הממשלה הפדרלית של ארצות הברית
• רשימה של דוגמאות נגישות מ-Smashing Magazine

בספריות JavaScript, המשאבים הבאים נגישים למדי כברירת מחדל או ניתנים להתאמה לצורך נגישות:

• When CSS Isn't Enough: JavaScript Requirements For Accessible Components
• React
  • ReachUI
  • Reakit
  • Chakra
• ‫Angular: Material library
• ‫Vue: ‏ Vuetensils

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

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

תמיכה בדפדפנים ובטכנולוגיה מסייעת (AT)

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

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

התמיכה בדפדפנים היא בדרך כלל מסובכת, והדברים נעשים מורכבים עוד יותר כשמוסיפים למשוואה מכשירי AT ומפרטי ARIA.

אבל לא הכול חדשות רעות. למזלנו, יש מקורות מידע מצוינים כמו HTML5 Accessibility,‏ Accessibility Support ו-Custom Control Accessible Development Checklist של WCAG, שעוזרים לנו להבין טוב יותר את התמיכה הנוכחית בדפדפנים ובמכשירי AT, ואפילו מתי כדאי להשתמש ב-ARIA.

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

שיקולים נוספים

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

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

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

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

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

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