מבט לתוך אריה אינטרנט תקנים & HTML Apps נגישות
אינטרנט פתוח ופתוח לחלוטין זקוק לטכנולוגיות המאפשרות למשתמשים מושבתים להסתמך על טכנולוגיות מסייעות כדי ליהנות מתוכן אינטרנט דינמי ויישומי אינטרנט מודרניים. תקני רשת האינטרנט של W3C מאפשרים לאכלס את האינטרנט באמצעות יישומי אינטרנט עשירים נגישים (ARIA) שמשתמשים בעלי מוגבלויות יכולים להשתמש ביעילות.
ARIA היא אחת מתקני נגישות רבים והנחיות שפורסמו על ידי Web Accessibility Intitiative (WAI). הוא מספק סימון נוסף שניתן להוסיף בקלות למסמכי HTML. WAI-ARIA הוא פתרון חוצה-מכשירים המכוון לפלטפורמת האינטרנט הפתוחה, ולכן לא רק לחשוב על אתרים, אלא גם על משחקים, בידור דיגיטלי, שירותי בריאות, ניידים וסוגים אחרים של יישומים.
במאמר זה נסקור כיצד ניתן להוסיף נגישות למסמכי HTML שלך בעזרת תקני WAI-ARIA.
מסגרת ARIA
התחביר של HTML לא תמיד מאפשר למפתחים לתאר אלמנטים כראוי, לזהות את התפקידים שלהם, ולציין את היחסים ביניהם. אמנם זה רק לעתים רחוקות בעיה עבור המבקרים אשר ברשותם מלא החושים שלהם, זה יכול לעכב משתמשי טכנולוגיה מסייעת מהבנת מה שקורה על המסך לבחון את האפשרויות שלהם.
זוהי הנקודה שבה ARIA מגיע לעזרתנו, כפי שהוא מאפשר להגדיר את המטרה של אלמנטים שונים בעזרת תפקידים ציון דרך, ומתארים את טבעם אריה-קידומת תכונות. למאפיינים בעלי הקידומת של אריה יש שני סוגים: נכסים המתארים תכונות שיש פחות סיכוי לשנות במהלך מחזור החיים של הדף, וכן מדינות המספקים מידע על דברים שעלולים להשתנות לעתים קרובות עקב אינטראקציה עם המשתמש.
תפקידים לנדמרק
תפקידים לנדמרק הם הצורות הידועות ביותר של תפקידים של ARIA מודל (אחרים הם תפקידים מופשטים, תפקידים יישומון, ואת תפקידים מבנה המסמך). תפקידים לנדמרק מאפשרים למפתחים לזהות גדולים אזורים נתפסים בדף האינטרנט שבו משתמשים בטכנולוגיה מסייעת ירצו לגשת במהירות.
ישנם 8 סוגים של תפקידים ARIA ציון, והם צריכים להיות מתווספים כתכונות של תגי HTML קשורים.
תפקיד =”כרזה”
תפקיד הבאנר נועד לשמש בעיקר תוכן הקשור לאתר כולו, לא רק לדפים בודדים. זה בדרך כלל הוסיף כתכונה לכותרת הראשית של האתר עבור הלוגו ומידע חשוב אחר באתר כולו. חשוב שתוכל להשתמש בתפקיד הבאנר רק פעם אחת בכל מסמכי HTML או אפליקציות.
תפקיד =”ראשי”
התפקיד הראשי של ציון הדרך קשור לתוכן הראשי של המסמך. לא ניתן להשתמש בו יותר מפעם אחת בכל דף HTML. זה בדרך כלל בעקבות תפקיד הניווט נועד לשמש להצגת אזור המכיל רכיבי ניווט כגון קישורים ורשימות באתר. התפקיד המשלים של ציון הדרך מתאר תוכן נוסף הקשור לתוכן הראשי של האתר. זה צריך להיות ממוקם ברמה דומה בהיררכיה DOM כמו התפקיד contentinfo מודיע לסוכני משתמשים על נוכחות אזור שבו ניתן למצוא סוגים שונים של מטא נתונים, כגון מידע על זכויות יוצרים, הצהרות משפטיות ופרטיות. זה בדרך כלל משמש עבור תחתונה של האתר. התבנית של טופס ציון מציין טופס מחכה קלט משתמש. עבור טופסי חיפוש שבהם אתה משתמש תפקיד החיפוש הוא די מובן מאליו, הוא נועד לסייע לטכנולוגיות מסייעות לזהות את פונקציונליות החיפוש של אתר אינטרנט. תוכל להשתמש בתפקיד ציון דרך של אפליקציה עבור אזור שברצונך להכריז עליו כעל יישום אינטרנט, במקום במסמך אינטרנט. לא מומלץ לכלול אותו באתרים מסורתיים, שכן הוא רומז לטכנולוגיות מסייעות כדי לעבור ממצב גלישה רגיל למצב גלישה של יישומים. אתה צריך רק להשתמש בתפקיד זה ציון עם טיפול רב. בעוד שהתפקידים מאפשרים לך להגדיר את המשמעות של תגי HTML, מדינות ומאפיינים מספקים למשתמש מידע נוסף על אופן האינטראקציה איתם. שתי המדינות והמאפיינים מסומנים ב- אריה-קידומת תכונות עם התחביר אריה- *. המאפיינים הידועים ביותר של אריה הם ככל הנראה המאפיין הדרוש לאריה והמצב שבדק את האריה. אריה נדרש הוא נכס כי זה תכונה קבועה של רכיב קלט (כלומר, המשתמש צריך למלא אותו), בעוד אריה בדק הוא מדינה כי תיבת סימון עשויה לעתים קרובות לשנות את הערך שלה עקב אינטראקציה עם המשתמש. מדינות ונכסים לפעמים לוקחים ערכי אסימון (קבוצה מוגדרת של ערכים מוגדרים מראש), לדוגמה, המאפיין לחיות אריה יכול להיות בעל שלושה ערכים שונים: כבוי, מנומס, אסרטיבי. התחביר בדוגמה זו נראה כך: במקרים אחרים, הערכים של תכונות מקודדות באריה מיוצגים על ידי מחרוזות, מספרים, מספרים שלמים, הפניות מזהה או אמת שקר ערכים. השתמש במאפייני הקשר כדי לציין יחסים בין אלמנטים שונים באתר שלך, שלא ניתן לקבוע אחרת ממבנה המסמך. לדוגמה לאחר שתגדיר תפקיד של ציון ARIA עבור אזור הניתן לתפיסה בדף ה- HTML שלך, הוא יוכל לסייע לטכנולוגיות מסייעות במידה רבה אם תשנה את המצבים והתכונות המוקדדים של ARIA ומאפיינים של רכיבי ילדים בהתאם לאירועים המתרחשים על המסך. זה יכול להיות קריטי שבו המשתמשים צריכים לקיים אינטראקציה עם האתר, למשל מילוי טופס או הפעלת שאילתת חיפוש. כלל האצבע של עיצוב הנגישות הוא שהמצב הנוכחי של ממשק המשתמש תמיד צריך להיות נתפס על ידי טכנולוגיות מסייעות. לדוגמה, אם המשתמש בוחר אפשרות בטופס, הוא צריך להופיע גם עבור טכנולוגיות מסייעות. זה יכול להיות מושגת בקלות על ידי ניצול המדינה שנבחרה אריה עם התחביר הבא: W3C של WAI-ARIA תרגול הנחיות קו מנחה יכול לתת לך רעיונות גדולים אחרים על איך כראוי הרמוניה חזותית הממשקים נגישים של האתר שלך. שימוש בתפקידים ובמאפיינים של ARIA עשוי לעיתים להיות מיותר. כאשר אתה משתמש בתגים סמנטיים של HTML5 כגון לדוגמה, אין צורך להשתמש טופס תפקיד מרכזי להגדיר את אז אם כבר הוספת את מוסתר תכונה HTML לקלט טופס, אין צורך להוסיף את אריה מוסתרים , מכיוון שהדפדפן כולל את זה כברירת מחדל.. זה האחרון נוספה מפרט W3C במטרה מיפוי ראשי ARIA ציון תפקיד אלמנט HTML סמנטי.
תפקיד =”ניווט”
תפקיד =”משלימה”
תפקיד = "main"
. הודעות קשורות, מאמרים פופולריים, הערות אחרונות הן דוגמאות אופייניות לתוכן משלים אוטונומי.תפקיד =”תוכן”
תפקיד =”טופס”
תפקיד = "חיפוש"
במקום זאת.תפקיד =”לחפש”
תפקיד =”יישום”
מדינות ונכסים
התחביר של תכונות מקדימות של אריה
כיצד לעשות שימוש של ARIA מדינות ונכסים
1. בניית קשרים בין אלמנטים עם תכונות היחסים
אריה - מדומה
המאפיין מזהה את הרכיב שמייצר את הרכיב הנוכחי.אריה - מדומה
- בין דברים רבים אחרים - יכול לקשור כותרות לאזורים ARIA ציון דרך הבאה:זה הוא כותרת
תוכן עיקרי… 2. לסנכרן מדינות ונכסים עם מחזור החיים של אלמנט
3. התאם את חזותית ואת הממשקים נגישים
.
לא overuse ARIA
או
, דפדפני אינטרנט מודרניים מוסיפים את הסמנטיקה המתאימה של ARIA כברירת מחדל. במקרה זה אין טעם להגדיר בנפרד את התפקידים ARIA ציון.
אלמנט. במקום ה
תחביר זה בהחלט מספיק כדי להשתמש רק
. כמו כן, אין צורך להשתמש בתכונות המקוריות של HTML יחד עם התכונה המתאימה של ARIA.