دەستڕاگەیشتن

کورتەیەک لە تایبەتمەندییەکان و سنوورەکانی Bootstrap بۆ دروستکردنی ناوەڕۆکی دەستڕاگەیشتن.

بووتستراپ چوارچێوەیەکی ئاسان بۆ بەکارهێنان لە ستایلە ئامادەکراوەکان، ئامرازەکانی نەخشە و پێکهاتە کارلێککەرەکان دابین دەکات، ڕێگە بە گەشەپێدەران دەدات ماڵپەڕ و بەرنامە دروست بکەن کە لە ڕووی بینراوەوە سەرنجڕاکێش بن، لە ڕووی کاراییەوە دەوڵەمەند بن و لە دەرەوەی سندوقەکە دەستیان پێ بگات.

تێڕوانینێکی گشتی و سنووردارکردنەکان

دەستڕاگەیشتن بە گشتی هەر پرۆژەیەک کە بە Bootstrap دروست بکرێت بە بەشێکی زۆر بەندە بە نیشاندانی نووسەر، ستایلکردنی زیادە و سکریپت کە ئەوان لەخۆیان گرتووە. بەڵام بە مەرجێک ئەمانە بە دروستی جێبەجێ بکرێن، دەبێ بە تەواوی بتوانرێت ماڵپەڕ و بەرنامەکان بە Bootstrap دروست بکرێت کە WCAG 2.0 (A/AA/AAA)، بەشی 508 و ستاندارد و پێداویستییەکانی دەستڕاگەیشتنێکی هاوشێوە بەدی بهێنن.

مارکاپی پێکهاتەیی

دەتوانرێت ستایل و شێوازی Bootstrap بۆ کۆمەڵێک پێکهاتەی مارکاپ بەکاربهێنرێت. ئەم بەڵگەنامەیە ئامانجی ئەوەیە کە باشترین نموونەی پراکتیک بە گەشەپێدەران بدات بۆ نیشاندانی بەکارهێنانی خودی بووتستراپ و وێناکردنی نیشانەکردنی ماناسازی گونجاو، لەوانەش ڕێگاکانی چارەسەرکردنی نیگەرانییە ئەگەرییەکانی دەستڕاگەیشتن.

پێکهاتە کارلێکەکان

پێکهاتە کارلێککەرەکانی بووتستراپ- وەک دیالۆگەکانی مۆداڵی، مینیوی دابەزین و ئامرازە تایبەتەکان- بۆ بەکارهێنەرانی تاچ، ماوس و کیبۆرد دیزاین کراون. لە ڕێگەی بەکارهێنانی ڕۆڵ و تایبەتمەندییە پەیوەندیدارەکانی WAI - ARIA ، ئەم پێکهاتانە دەبێ بە بەکارهێنانی تەکنەلۆژیای یارمەتیدەر (وەک خوێنەری شاشە) تێبگەین و کاربکەن.

لەبەر ئەوەی پێکهاتەکانی بووتستراپ بە مەبەست دیزاین کراون بۆ ئەوەی تا ڕادەیەک گشتی بن، ڕەنگە نووسەران پێویستیان بە ڕۆڵ و تایبەتمەندی زیاتری ARIA هەبێت، هەروەها هەڵسوکەوتی جاڤاسکڕێپت، بۆ ئەوەی بە وردی سروشتی و کارایی وردی پێکهاتەکەیان بگەیەنن. بەزۆری ئەمە لە بەڵگەنامەکاندا ئاماژەی پێکراوە.

کۆنتراستی ڕەنگەکان

زۆربەی ڕەنگەکان کە لە ئێستادا پالێتی پێشوەختەی Bootstrap پێکدەهێنن- کە لە سەرانسەری چوارچێوەکەدا بەکاردەهێنرێت بۆ شتەکانی وەک گۆڕانی دوگمە، گۆڕانکارییەکانی ئاگادارکردنەوە، نیشاندەری ڕەچاوکردنی فۆڕم- دەبێتە هۆی کۆنتراستی ڕەنگی ناتەواو (لە خوار ڕێژەی کۆنتراستی ڕەنگی پێشنیارکراوی WCAG 2.0 کە 4.5:1 ) کاتێک لە دژی بەکاردەهێنرێت پاشبنەمایەکی ڕووناک. نووسەران پێویستە بە دەست دەستکاری/درێژکردنەوەی ئەم ڕەنگە پێشوەختانە بکەن بۆ دڵنیابوون لە ڕێژەی کۆنتراستی ڕەنگی گونجاو.

ناوەڕۆکێک کە پێویستە بە شێوەیەکی بینراو بشاردرێتەوە، بەڵام بە تەکنەلۆژیا یارمەتیدەرەکانی وەک خوێنەری شاشە دەستڕاگەیشتن بمێنێتەوە، دەتوانرێت بە بەکارهێنانی .sr-onlyپۆلەکە ستایل بکرێت. ئەمە دەتوانێت لەو بارودۆخانەدا بەسوود بێت کە زانیاری یان ئاماژەی بینراوی زیادە (وەک مانا کە لە ڕێگەی بەکارهێنانی ڕەنگەوە دیاری دەکرێت) پێویستە بگەیەنرێتە بەکارهێنەرانی غەیرە بینراو.

<p class="text-danger">
  <span class="sr-only">Danger: </span>
  This action is not reversible
</p>

بۆ کۆنتڕۆڵە کارلێککەرەکانی شاراوەی بینراو، وەک بەستەری تەقلیدی "بازدان"، .sr-onlyدەتوانرێت لەگەڵ .sr-only-focusableپۆلەکەدا تێکەڵ بکرێت. ئەمەش دڵنیای دەدات لەوەی کە کۆنتڕۆڵەکە کاتێک فۆکەس دەکرێت، دیار دەبێت (بۆ بەکارهێنەرانی کیبۆرد کە بینراون).

<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>

کەمکردنەوەی جووڵە

بووتستراپ پشتگیری لە prefers-reduced-motionتایبەتمەندی میدیا لەخۆدەگرێت . لە وێبگەڕەکان/ژینگەیەکدا کە ڕێگە بە بەکارهێنەر دەدەن کە ئارەزووی خۆی بۆ کەمکردنەوەی جووڵە دیاری بکات، زۆربەی کاریگەرییەکانی گواستنەوەی CSS لە Bootstrap (بۆ نموونە، کاتێک دیالۆگێکی مۆداڵی دەکرێتەوە یان دادەخرێت) لەکاردەخرێن. لە ئێستادا پشتگیری تەنها لە سەفاری لەسەر macOS و iOS سنووردارە.