Table of Contents
יצירת יישומי תוכנה נגישים חיונית כדי להבטיח שכל המשתמשים, ללא קשר ליכולות שלהם, יכולים להשתמש ביעילות בכלים דיגיטליים.עיצוב כולל לא רק מרחיב את הקהל שלך, אלא גם להפגין מחויבות לשוויון וכדאיות. נגישות אינה תכונה - זהו היבט בסיסי של הנדסת תוכנה איכותית.כאשר יישומים בנויים עם נגישות בראש, הם הופכים להיות יותר נגיש לכולם, כולל אנשים עם ליקויים זמניים (כמו שבר) או פתרונות ברורים של השמש, כדי לחקור באמת, כדי לפתח אסטרטגיות מפתח.
הבנה בפיתוח תוכנה
נגישות בפיתוח תוכנה פירושה תכנון ובנייה של יישומים שניתן להשתמש בהם על ידי אנשים עם מגוון רחב של יכולות ומוגבלות.זה כולל משתמשים עם ויזואלי, אודיטור, דיבור, או ליקויים קוגניטיביים. מעבר להספק, נגישות היא לעתים קרובות דרישה משפטית. מדינות ברחבי העולם חוק חקיקת חוקים כגון האמריקאים עם מוגבלות חוק (ADA), סעיף 508 לחוק שיקום, וחוק נגישות אירופי יכול לעתים קרובות לגרום נזק יקר להוביל לפגיעה ופגיעה.
המקרה העסקי של נגישות הוא חזק באותה מידה.על פי ארגון הבריאות העולמי, מעל מיליארד אנשים ברחבי העולם חווים צורה כלשהי של נכות.יתר על כן, עיצוב נגיש משפר את החוויה עבור כל המשתמשים.לדוגמה, כיתובות על קטעי וידאו מועילות לא רק למשתמשים חירשים, אלא גם אנשים צופים בסביבה רועשת או רמקולים לא-מתאים.מנועי חיפוש מעדיפים גם אתרי אינטרנט נגישים, שיפור ביצועים SEO.
כדי לבנות יישומים נגישים באמת, מפתחים חייבים לאמץ חשיבה של עיצוב אוניברסלי מההתחלה.התרעד נגישות מאוחר יותר הוא לעתים קרובות יקר יותר ופחות יעיל מאשר לבנות אותו מההתחלה.
ארבעת העקרונות של נגישות (סעיף)
הנחיות נגישות התוכן באינטרנט (WCAG) מגדירות ארבעה עקרונות ליבה שמשרתים כבסיס לנגישות.עקרונות אלה חלים על כל התוכן הדיגיטלי, כולל יישומי אינטרנט ונייד.
- (FLT:0) ניתן להציג את רכיבי ממשק המידע והמשתמש על מנת להציג למשתמשים בדרכים שהם יכולים לתפוס.זה אומר שאין מידע בלתי נראה לכל החושים של המשתמש.לדוגמה, לספק חלופות טקסט עבור תוכן שאינו טקסט, כגון טקסט אלט לתמונות או לכתוביות עבור אודיו.
- (FLT:0)Operable: FLT:1 רכיבי ממשק משתמש וניווט חייב להיות אופרות.משתמשים חייבים להיות מסוגלים לתקשר עם כל הפקדים לנווט את היישום באמצעות מגוון של שיטות קלט, כולל מקלדת, עכבר, מגע או קול.זה כולל הימנעות תוכן הגורם להתקפים (כמו אנימציה פלאש) ומספק מספיק זמן לקריאה ואינטראקציה עם תוכן.
- (FLT:0) ניתן להבין: מידע ופעולת ממשק המשתמש יש להבין.טקסט צריך להיות קריא וחיזוי.ממשקי המשתמש צריכים לתפקד בדרכים עקביות, וטעויות יש להסביר בבירור עם הצעות לתיקון.
- התוכן חייב להיות חזק מספיק כדי להיות מפרש באופן אמין על ידי מגוון רחב של סוכני משתמשים, כולל טכנולוגיות מסייעות.זה אומר שימוש בסימון סמנטי הולם, קוד תקף, ולהבטיח תאימות עם דפדפנים נוכחיים ועתידיים, קוראים ומכשירים אחרים. השתמש בטכנולוגיות אינטרנט סטנדרטיות ולהימנע מתכונות סודיות או קנייניות.
עקרונות אלה מתפרקים עוד יותר לרמות של קונפורציות: A (מינימום), AA (מעודכן), ו- AAA (גבוה ביותר) דרישות משפטיות וסטנדרטים בתעשייה מכוונים תאימות WCAG 2.1 רמה AA.
אסטרטגיות מעשיות לבניית יישומים נגישים
יישום נגישות דורש תכנון ודבקות מתחשבים לשיטות הטובות ביותר בתהליך הפיתוח.אסטרטגיות הבאות מטפלות במחסומים נפוצים נגישות והם חלים על רוב יישומי האינטרנט המודרניים.
שימוש ב-Smantic HTML
(ב) , ויקרא י"א, ויקרא י"א, ויקרא י"א, ויקרא י"א, ויקרא י"א, ו-[[1924]], [[1924]]]], [[1924]]]]]], [[1924]]]]]]]], [[1924]]]]]]]]]], [[1924]]]]]]]]]]]], [[1924]]]]]]]]]], [[1924]]]]]]]]]], [[1924]], [[1924]]]]]]]]]]]]]], [[1924]]]]]]]]]], [[1924]], [[1924]]]]]]]]]]]]]]]], [[1924]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]], [[1924]]]]]]]]
(ב) ב[[1924]], [[1924]]]], [[1924]]]]]], [[1924]]]]]], [[1924]]]]]], [[1924]]]]]]]]]]]], [[1924]]]]]]]], [[1924]]]]]]]]]]]], [[1924]]]]]]]], [[1924]]]]]]]]]], [[1924]]]]]]]]]]]]]], [[1924]]]]]], [[1924]]]], [[1924]]]]]]]]]]]]]]]], [[1924]]]]]]]]]]]]]]]]]]]], [[1924]]]]]]]]]]]], [[1924]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]
להימנע משימוש באלמנטים אינטראקטיביים (FLT:15 ו-FLT:16) עבור אלמנטים אינטראקטיביים.אם אתה חייב להשתמש באלמנטים שאינם-חומריים, להבטיח שיש להם את התפקידים והנכסים הנכונים , אבל תמיד מעדיף אלמנטים HTML Native תחילה.
לספק חלופות טקסט עבור תוכן לא-טקסט
כל תוכן שאינו טקסט, כגון תמונות, סמלים, תרשימים ומולטימדיה, צריך להיות חלופות טקסט תיאוריות.לתמונות, השתמש בתכונות של FLT:17 דקורטיביות שלא להעביר מידע לא צריך להיות בעל תפוצה 18 (מפס) כך שקוראים מסך להתעלם מהם. תמונות אינפורמטיביות צריך להיות טקסט תמציתי משמעותי המתאר את התוכן או הפונקציה עבור תמונות מורכבות כמו גרפים או טקסט נגיש יותר.
עבור סמלים המשמשים כלחצנים או בקרות, להבטיח שיש להם שמות נגישים.לדוגמה, אם סמל זכוכית מגדל משמש עבור כפתור חיפוש, ה- HTML צריך לכלול FLT:19 או טקסט מוסתר חזותית כמו FLT:20.
עבור תוכן אודיו ווידאו, לספק כיתולים, תמלילים ותיאורי אודיו. Captions הם חיוניים עבור משתמשים חירשים וקשה של הירר, בעוד תמלילים מועילים למשתמשים עם מוגבלויות קוגניטיביות או אלה המעדיפים לקרוא.
להבטיח נגישות Keyboard
(הופנה מהדף זה) עיצוב היישום שלך כך שכל פונקציות ניתן לגשת למקלדת בלבד.היתרונות האלה למשתמשים עם מוגבלויות מוטוריות שאינם יכולים להשתמש בעכבר, כמו גם משתמשים כוח המעדיפים קיצורי דרך (קישורים, כפתורים, בקרים, בקרים בצורת, שרביטים מותאמים אישית) חייבים להיות ממוקדים ואופרות באמצעות מקלדת סטנדרטית: FLT:0TLTFLTFalphirdirdirdirdr1 להזיז קדימה, 3.
להימנע מלכודות מקלדת שבו המיקוד נתקע על אלמנט.לדוגמה, דיאלוגים מודוליים חייבים למלכוד להתמקד בתוך הדיאלוג בזמן פתוח, אבל המשתמש חייב להיות מסוגל לסגור אותו ולחזור לדף הראשי.ספק אינדיקטורים גלויים (כמו קווי מתאר) כך שמשתמשים מקלדת יכולים לראות מי הוא עכשיו ממוקד.לעולם אל להסתיר את קווי המתאר מבלי לספק אלטרנטיבה.
בדוק את היישום שלך על ידי ניתוק העכבר וניווט לחלוטין עם המקלדת.אם אתה לא יכול להשלים את כל המשימות, יש בעיה מקלדת נגישות.
צבע וקונסטריט
ניגוד צבע רגיש הוא חיוני למשתמשים עם ראייה נמוכה או עיוורון צבעים. WCAG 2.1 רמה AA דורש יחס ניגוד של לפחות 4.5:1 עבור טקסט רגיל ו 3:1 עבור טקסט גדול (18px או 24px קבוע) שימוש בכלים כמו FLT:0WebAIM Contrast Checker CheckFLT:1 או בנוי-in למערכות מפתח כדי לאמת יחסי ניגודים.
אל תסמכו רק על צבע להעביר מידע.לדוגמה, אם שדה צורה הופך אדום כדי לציין שגיאה, כולל טקסט או סמל שמתקשר את השגיאה.טקסט הקישור צריך להיות underlined או יש אינדיקטורים אחרים שאינם צבעים כדי להבדיל אותו טקסט סביב.
ודא כי שילובי צבע נגישים למשתמשים עם סוגים שונים של עיוורון צבעים. השתמש בדפוסים, סמלים, ולייבלים בנוסף צבע. כלים כמו FLT:0.
« שימוש ב- RIT Roles and Properties בחוכמה
יישומי אינטרנט עשירים (RIT) מספקים מערך תכונות אשר מתווסף ל-HTML כדי לשפר את נגישות התוכן הדינמי ואת ממשק המשתמש המורכב שולטות.לדוגמה, FLT:21,FLT:22,FLT:23, FLT:23, FLT:24 ו-FLT:25 הם כלים חזקים.
כאשר בונים רכיבים מותאמים אישית (כמו למשל שקופיות או פאנל כרטיסיות), יש להבטיח כי יש להם את התפקידים הנכונים, מדינות ונכסים. השתמש ב-FLT:0WAI-RIT Authoring PracticesssveFLT:1 כמדריך.תמיד לבדוק את יישום 940 עם קוראי מסך.
יצירת טפסים נגישים
(ב) יש אחד המקורות הנפוצים ביותר של מחסומים נגישות (כל קלט צריך להיות מרכיב קשורה (FLT:26) תכונת ה- 27 של התווית חייב להתאים את ה-FLT:28 של הקלט. לחלופין, לעטוף את הקלט בתוך התווית.
לספק הודעות שגיאה ברורות המציינות כי שדה יש שגיאה וכיצד לתקן אותו. השתמש (FLT:31) כדי לקשר את הודעת השגיאה עם שדה קלט.
עבור צורות מורכבות, לשבור אותם בצעדים עם אינדיקטורים התקדמות ברורה. השתמש auto-focus בספאם ורק כאשר זה עוזר למשתמשים, כמו מיקוד נעים באופן בלתי צפוי יכול להסיט את משתמשי קורא המסך.
עיצוב ביקורתי ו Scalable Design
נגישות פירושה גם להבטיח כי תוכן פועל על פני גודל מסך שונה, רמות גן החיות, והעדפות המשתמשים עם ראייה נמוכה להגדיל את גנום הדפדפן עד 200% או יותר.עיצוב היישום שלך כך שהוא נשאר ניתן לקריאה ב 400% גן חיות ללא צורך לגלול אופקי (ICE Success קריטרון 1.4.10) השתמש ביחידות יחסיות כמו FLT:32 או FLT:33 עבור פונטו, ולא פיקסלים קבועים, במקום פיקסלים קבועים, כאשר משתמשים באופן הולם.
תמיכה בהגדרות נגישות מערכת הפעלה, כגון "חינוך תנועה" למשתמשים עם הפרעות קונבנציונאליות. השתמש בשאילתת התקשורת של 5.3 כדי להשבית אנימציה מיותרות.
בדוק את היישום שלך על מכשירים שונים, כולל טלפונים ניידים, טאבלטים ודפדפנים שונים, כדי להבטיח נגישות עקבית.
בדיקות ושיפור מתמשך
נגישות אינה משימה חד פעמית; היא דורשת בדיקות וזיקוק מתמשך לאורך מחזור חיי התוכנה.שילוב בדיקות נגישות לכל שלב, החל מעיצוב לפיתוח ל-QA. ישנם שלושה סוגים עיקריים של בדיקות: אוטומטיים, ידניים ובדיקת משתמשים.
כלי בדיקה אוטומטיים
כלים אוטומטיים יכולים לתפוס במהירות בעיות נגישות נפוצות רבות, כגון טקסט alt, ניגוד נמוך או מבנה כותרת לא מספיק.כלי כמו FLT:0axe Devtoolsof 1 ו-FLT:2WAVEFLT 3 משתלבים בדפדפנים ובצנרת CI/CD, בעוד כלים אוטומטיים יעילים, הם יכולים רק לזהות כ-20-30% של בעיות נגישות לא יכולים להעריך אם טקסט משמעותי אינו פועל כראוי.
המחאות נגישות אוטומטיות לתוך צינור האינטגרציה המתמשך שלך כדי לתפוס תוקפנות לפני שהם מגיעים לייצור. מסגרות בדיקות רבות, כמו Cypress ו Jest, יכול לשלב axe-core עבור ביקורות אוטומטיות.
בדיקה ידנית עם טכנולוגיות מסייעות
בדיקות ידניות כרוכות בשימוש באותה טכנולוגיות מסייעות שאנשים עם מוגבלויות משתמשים.הנפוצות ביותר הוא בדיקות עם קורא מסך. עבור Windows, השתמש ב- NVDA (חינם) או JAWS (מסחרי) ב- macOS, השתמש ב- VoiceOver (ב-in) עבור לינוקס, השתמש ב- Orca. למד את קיצורי קיצורי מקשי מקשי המסך כדי לנווט את תזרימות העבודה הנפוצות שלך.
ניווט מקלדת בדיקה ביסודיות: להבטיח שכל האלמנטים האינטראקטיביים ניתנים להשגה ואופרה עם המקלדת, וכי סדר המיקוד הגיוני.מבחן עם הדפדפן מאוחסן עד 200% ו -400%, ועם גופנים או צבעים מותאמים אישית (למשל, באמצעות מצב קוטרסט של Windows).
מעורבים משתמשים עם מוגבלויות
הבדיקות החשובות ביותר מגיעות ממשתמשים אמיתיים עם מוגבלויות.גיוס משתתפים המשתמשים בטכנולוגיות מסייעות שונות ויש להם מוגבלויות מגוונות.עיין כיצד הם מתקשרים עם היישום שלך ולאסוף את משובם.זה יכול לחשוף בעיות כי בדיקות אוטומטיות ומדריךיות מתגעגעות.ג'ר משוב מוקדם בתהליך העיצוב כדי להימנע מעבודה מחדש.אפילו מחקר קטן של משתמשים עם משתתפים עם 3-5 יכול לחשוף בעיות רגישות ביקורתית.
יצירת תרבות של עיצוב כולל בתוך הארגון שלך.ספק הכשרה עבור מעצבים, מפתחים וצוות QA על עקרונות נגישות ושיטות הטובות ביותר נגישות צריך להיות אחריות משותפת, לא ניתוק למומחה יחיד.
מסקנה
בניית יישומי תוכנה נגישים חיונית ליצירת חוויות משתמש בלעדיות.על ידי יישום עקרונות כמו HTML סימנטאלי, מתן חלופות טקסט, הבטחת נגישות מקלדת, ושמירה על ניגוד צבעים מספיק, מפתחים יכולים להפוך את היישומים שלהם נגישים על ידי כולם; זה מחויבות מתמשכת לשוויון וכדאיות. בדיקות מתמשך עם כלים אוטומטיים, הערכה ידנית, משוב אמיתי הם מפתח לשמירה על סטנדרטים נגישות.
התחל קטן: לבחור אחת האסטרטגיות המפורטות לעיל וליישם אותו בפרויקט הבא שלך.כפי שאתה בונה מיומנות, להרחיב את מאמציך.זכור כי נגישות מועילה לכל המשתמשים, וכל צעד לקראת אינטגרטיביות הופך את העולם הדיגיטלי למקום טוב יותר.