သုံးစွဲနိုင်မှု
အသုံးပြု၍ရနိုင်သောအကြောင်းအရာဖန်တီးမှုအတွက် Bootstrap ၏အင်္ဂါရပ်များနှင့် ကန့်သတ်ချက်အကျဉ်းချုပ်။
Bootstrap သည် အဆင်သင့်လုပ်ထားသော စတိုင်များ၊ အပြင်အဆင်တူးလ်များနှင့် အပြန်အလှန်အကျိုးပြုသော အစိတ်အပိုင်းများပါရှိသော အသုံးပြုရလွယ်ကူသော မူဘောင်ကို ပံ့ပိုးပေးကာ ဆော့ဖ်ဝဲအင်ဂျင်နီယာများသည် အမြင်အာရုံဆွဲဆောင်မှုရှိသော၊ လုပ်ဆောင်နိုင်မှုကြွယ်ဝပြီး ကွက်လပ်အတွင်းမှ ဝင်ရောက်နိုင်သော ဝဘ်ဆိုက်များနှင့် အပလီကေးရှင်းများကို ဖန်တီးနိုင်စေမည်ဖြစ်သည်။
ခြုံငုံသုံးသပ်ချက်နှင့် ကန့်သတ်ချက်များ
Bootstrap ဖြင့်တည်ဆောက်ထားသော မည်သည့်ပရောဂျက်၏ အလုံးစုံဝင်ရောက်နိုင်မှုမှာ စာရေးသူ၏ အမှတ်အသား၊ အပိုဆောင်းပုံစံနှင့် ၎င်းတို့ပါရှိသော ဇာတ်ညွှန်းပေါ်တွင် များစွာမူတည်ပါသည်။ သို့သော်၊ ၎င်းတို့ကို မှန်ကန်စွာအကောင်အထည်မဖော်ပါက WCAG 2.1 (A/AA/AAA)၊ ပုဒ်မ 508 နှင့် အလားတူအသုံးပြုနိုင်မှု စံနှုန်းများနှင့် လိုအပ်ချက်များကို ဖြည့်ဆည်းပေးသည့် Bootstrap ဖြင့် ဝဘ်ဆိုက်များနှင့် အပလီကေးရှင်းများကို ဖန်တီးနိုင်မည်ဖြစ်သည်။
ဖွဲ့စည်းပုံ စျေးတက်ခြင်း။
Bootstrap ၏ပုံစံနှင့် အပြင်အဆင်ကို ကျယ်ပြန့်သော markup တည်ဆောက်ပုံများတွင် အသုံးချနိုင်သည်။ ဤစာရွက်စာတမ်းသည် Bootstrap ကိုယ်တိုင်အသုံးပြုမှုကို သရုပ်ပြရန်နှင့် ဖြစ်နိုင်ချေရှိသော သုံးစွဲနိုင်မှုဆိုင်ရာ စိုးရိမ်မှုများကို ဖြေရှင်းနိုင်သည့်နည်းလမ်းများအပါအဝင် သင့်လျော်သောအသုံးအနှုန်းများကို သရုပ်ပြရန်အတွက် developer များအား အကောင်းဆုံးအလေ့အကျင့်နမူနာများပေးရန် ရည်ရွယ်ပါသည်။
အပြန်အလှန်အကျိုးပြုသော အစိတ်အပိုင်းများ
Bootstrap ၏ အပြန်အလှန်အကျိုးပြုသော အစိတ်အပိုင်းများ—ဥပမာ modal dialogs, dropdown menus, and custom tooltips—touch, mouse နှင့် keyboard အသုံးပြုသူများအတွက် အလုပ်လုပ်ရန် ဒီဇို��်းထုတ်ထားပါသည်။ သက်ဆိုင်ရာ WAI - ARIA အခန်းကဏ္ဍများနှင့် ရည်ညွှန်းချက်များကို အသုံးပြုခြင်းအားဖြင့်၊ ဤအစိတ်အပိုင်းများသည် အထောက်အကူပြုနည်းပညာများ (ဖန်သားပြင်ဖတ်သူများကဲ့သို့) ကို အသုံးပြု၍ နားလည်နိုင်ပြီး လုပ်ဆောင်နိုင်သင့်ပါသည်။
Bootstrap ၏ အစိတ်အပိုင်းများကို သာလွန်ကောင်းမွန်စေရန် ရည်ရွယ်ပြီး ဒီဇိုင်းထုတ်ထားခြင်းဖြစ်သောကြောင့် စာရေးဆရာများသည် ၎င်းတို့၏ အစိတ်အပိုင်း၏ သဘောသဘာဝနှင့် လုပ်ဆောင်နိုင်စွမ်းကို ပိုမိုတိကျစွာဖော်ပြရန် နောက်ထပ် ARIA အခန်းကဏ္ဍများနှင့် အရည်အချင်းများအပြင် JavaScript အပြုအမူများပါ ထည့်သွင်းရန် လိုအပ်ပါသည်။ ဒါကို အများအားဖြင့် စာတမ်းမှာ မှတ်သားထားပါတယ်။
အရောင်ခြားနားမှု
လက်ရှိ Bootstrap ၏ ပုံသေ palette တွင် ပါဝင်သည့် အရောင်အချို့ ပေါင်းစပ်မှုများသည် ခလုတ်ပြောင်းလဲမှုများ၊ သတိပေးချက်မျိုးကွဲများ၊ ပုံစံအတည်ပြုခြင်းဆိုင်ရာ ညွှန်ကိန်းများကဲ့သို့သော အရာများအတွက် မူဘောင်တစ်လျှောက်တွင် အသုံးပြုသည်— မလုံလောက်သော အရောင်ခြားနားမှုကို ဖြစ်ပေါ်စေနိုင်သည် (အကြံပြုထားသော WCAG 2.1 ၏ 4.5:1 စာသားအရောင်ခြားနားမှုအချိုး အောက်တွင် နှင့် WCAG 2.1 သည် စာသားမဟုတ်သော အရောင်ခြားနားမှုအချိုး 3:1 ) ) အထူးသဖြင့် အလင်းတန်းနောက်ခံကို အသုံးပြုသည့်အခါ။ စာရေးသူများသည် ၎င်းတို့၏ သီးခြားအရောင်အသုံးပြုမှုများကို စမ်းသပ်ရန် တွန်းအားပေးပြီး လိုအပ်ပါက၊ လုံလောက်သော အရောင်ခြားနားမှုအချိုးများကို သေချာစေရန် ဤပုံသေအရောင်များကို ကိုယ်တိုင်ပြုပြင်/ချဲ့ထွင်ရန် လိုအပ်ပါသည်။
အမြင်အာရုံ ဝှက်ထားသော အကြောင်းအရာ
အမြင်ဖြင့် ဝှက်ထားသင့်သော်လည်း စခရင်ဖတ်သူများကဲ့သို့ အထောက်အကူနည်းပညာများတွင် ဆက်လက်အသုံးပြုနိုင်မည့် အကြောင်းအရာကို .visually-hidden
အတန်းကို အသုံးပြု၍ ပုံစံသတ်မှတ်နိုင်သည်။ အမြင်အာရုံမဟုတ်သောအသုံးပြုသူများထံသို့ ထပ်လောင်းမြင်သာသောအချက်အလက်များ သို့မဟုတ် အရိပ်အမြွက်များ (အရောင်အသုံးပြုခြင်းအားဖြင့် အဓိပ္ပာယ်ဖော်ပြခြင်းကဲ့သို့သော) သည် အမြင်အာရုံမဟုတ်သောအသုံးပြုသူများကိုလည်း ပေးပို့ရန်လိုအပ်သည့်အခြေအနေများတွင် ၎င်းသည် အသုံးဝင်ပါသည်။
<p class="text-danger">
<span class="visually-hidden">Danger: </span>
This action is not reversible
</p>
သမားရိုးကျ “skip” လင့်ခ်များကဲ့သို့ အမြင်အာရုံဖြင့် ဝှက်ထားသော အပြန်အလှန်အကျိုးသက်ရောက်မှု ထိန်းချုပ်မှုများအတွက်၊ .visually-hidden-focusable
အတန်းကို အသုံးပြုပါ။ ၎င်းသည် ထိန်းချုပ်မှုကို အာရုံစိုက်ပြီးသည်နှင့် (မြင်ရသည့် ကီးဘုတ်အသုံးပြုသူများအတွက်) ကို သေချာစေမည်ဖြစ်သည်။ ယခင်ဗားရှင်းများ နှင့် ညီမျှသော အတန်းများနှင့် နှိုင်းယှဉ်ပါက Bootstrap 5's သည် သီးခြားလူတန်းစားဖြစ်ပြီး အတန်းအစားနှင့် တွဲ၍ အသုံးမပြုရပါ ။.sr-only
.sr-only-focusable
.visually-hidden-focusable
.visually-hidden
<a class="visually-hidden-focusable" href="#content">Skip to main content</a>
လှုပ်ရှားမှုကို လျှော့ချပါ။
prefers-reduced-motion
Bootstrap တွင် မီဒီယာအင်္ဂါရပ်အတွက် အထောက်အပံ့ ပါဝင်သည် ။ လျှော့ချထားသောရွေ့လျားမှုအတွက် အသုံးပြုသူအား ၎င်းတို့၏ဦးစားပေးကို သတ်မှတ်ခွင့်ပြုသည့် ဘရောက်ဆာ/ပတ်ဝန်းကျင်များတွင်၊ Bootstrap ရှိ CSS အသွင်ကူးပြောင်းမှုအကျိုးသက်ရောက်မှုများ (ဥပမာ၊ modal ဒိုင်ယာလော့ဂ်ကိုဖွင့်သည့်အခါ သို့မဟုတ် ပိတ်သည့်အခါ သို့မဟုတ် အဝိုင်းလေးထဲတွင် လျှောကျနေသော ကာတွန်းများ) ကို ပိတ်လိုက်မည်ဖြစ်ပြီး အဓိပ္ပါယ်ရှိသော ကာတွန်းများ (ဥပမာ၊ spinner ကဲ့သို့သော) နှေးကွေးလိမ့်မည်။
ပံ့ပိုးပေးသည့်ဘရောက်ဆာများတွင် prefers-reduced-motion
၊ အသုံးပြုသူသည် လျှော့ချထားသောရွေ့လျားမှုကို နှစ်သက်ကြောင်း အတိအလင်းအချက်ပြခြင်းမရှိသည့်နေရာ (ဆိုလိုသည်မှာ ) Bootstrap သည် ပိုင်ဆိုင်မှု prefers-reduced-motion: no-preference
ကို အသုံးပြု၍ ချောမွေ့စွာ လှိမ့်နိုင် စေသည်။scroll-behavior
နောက်ထပ်အရင်းအမြစ်များ
- ဝဘ်အကြောင်းအရာ ဝင်ရောက်နိုင်မှု လမ်းညွှန်ချက်များ (WCAG) 2.1
- A11Y ပရောဂျက်
- MDN သုံးစွဲနိုင်မှု စာရွက်စာတမ်း
- Tenon.io Accessibility Checker
- အရောင် အလင်းအမှောင် ခွဲခြမ်းစိတ်ဖြာမှု (CCA)
- အများသုံးစွဲနိုင်မှုဆိုင်ရာ ပြဿနာများကို ဖော်ထုတ်ရန်အတွက် “HTML Codesniffer” စာအုပ်စာတန်း
- Microsoft Accessibility Insights
- Deque Ax စမ်းသပ်ကိရိယာများ
- ဝဘ်အသုံးပြုနိုင်မှုဆိုင်ရာ နိဒါန်း