पहुँच

बुटस्ट्र्यापका सुविधाहरू र पहुँचयोग्य सामग्रीको सिर्जनाको लागि सीमितताहरूको संक्षिप्त सिंहावलोकन।

यस पृष्ठमा

बुटस्ट्र्यापले तयार शैलीहरू, लेआउट उपकरणहरू, र अन्तर्क्रियात्मक घटकहरूको प्रयोग गर्न-गर्न-सजिलो ढाँचा प्रदान गर्दछ, जसले विकासकर्ताहरूलाई दृश्यात्मक रूपमा आकर्षक, कार्यात्मक रूपमा धनी, र बाकस बाहिर पहुँचयोग्य वेबसाइटहरू र अनुप्रयोगहरू सिर्जना गर्न अनुमति दिन्छ।

अवलोकन र सीमाहरू

बुटस्ट्र्यापसँग निर्मित कुनै पनि परियोजनाको समग्र पहुँच लेखकको मार्कअप, अतिरिक्त स्टाइल, र तिनीहरूले समावेश गरेको स्क्रिप्टिङमा ठूलो अंशमा निर्भर गर्दछ। यद्यपि, यिनीहरूलाई सही रूपमा लागू गरिएको छ भने, WCAG 2.1 (A/AA/AAA), खण्ड 508 , र समान पहुँच स्तर र आवश्यकताहरू पूरा गर्ने बुटस्ट्र्यापसँग वेबसाइटहरू र अनुप्रयोगहरू सिर्जना गर्न पूर्ण रूपमा सम्भव हुनुपर्छ ।

संरचनात्मक मार्कअप

बुटस्ट्र्यापको स्टाइल र लेआउट मार्कअप संरचनाहरूको विस्तृत दायरामा लागू गर्न सकिन्छ। यस कागजातले विकासकर्ताहरूलाई बुटस्ट्र्यापको प्रयोग प्रदर्शन गर्न र सम्भावित पहुँच सरोकारहरूलाई सम्बोधन गर्न सकिने तरिकाहरू सहित उपयुक्त सिमान्टिक मार्कअप चित्रण गर्नका लागि उत्तम अभ्यास उदाहरणहरू प्रदान गर्ने लक्ष्य राख्छ।

अन्तरक्रियात्मक घटक

बुटस्ट्र्यापको अन्तरक्रियात्मक कम्पोनेन्टहरू-जस्तै मोडल संवादहरू, ड्रपडाउन मेनुहरू, र अनुकूलन टूलटिपहरू—टच, माउस, र किबोर्ड प्रयोगकर्ताहरूका लागि काम गर्न डिजाइन गरिएका छन्। सान्दर्भिक WAI - ARIA भूमिका र विशेषताहरूको प्रयोगद्वारा, यी कम्पोनेन्टहरू पनि सहायक प्रविधिहरू (जस्तै स्क्रिन रिडरहरू) प्रयोग गरेर बुझ्न सकिने र सञ्चालनयोग्य हुनुपर्छ।

किनभने बुटस्ट्र्यापका कम्पोनेन्टहरू उद्देश्यपूर्वक सामान्य रूपमा डिजाइन गरिएको हुनाले, लेखकहरूले थप ARIA भूमिकाहरू र विशेषताहरू, साथै जाभास्क्रिप्ट व्यवहारहरू समावेश गर्न आवश्यक हुन सक्छ, उनीहरूको कम्पोनेन्टको सटीक प्रकृति र कार्यक्षमतालाई अझ सही रूपमा व्यक्त गर्न। यो सामान्यतया दस्तावेज मा उल्लेख छ।

रंग कन्ट्रास्ट

रङका केही संयोजनहरू जसले हाल बुटस्ट्र्यापको पूर्वनिर्धारित प्यालेट बनाउँदछ — बटन भिन्नताहरू, सतर्कता भिन्नताहरू, फारम प्रमाणीकरण सूचकहरू जस्ता चीजहरूको लागि फ्रेमवर्कमा प्रयोग गरिन्छ — अपर्याप्त रङ कन्ट्रास्ट हुन सक्छ (सिफारिस गरिएको 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>

परम्परागत "छोड्नुहोस्" लिङ्कहरू जस्ता दृश्यात्मक रूपमा लुकेका अन्तरक्रियात्मक नियन्त्रणहरूको लागि, .visually-hidden-focusableकक्षा प्रयोग गर्नुहोस्। यसले सुनिश्चित गर्नेछ कि नियन्त्रण एक पटक केन्द्रित भएपछि (दृश्य किबोर्ड प्रयोगकर्ताहरूको लागि) देखिने छ। सावधान रहनुहोस्, विगतका संस्करणहरूमा बराबर र कक्षाहरूको तुलनामा , बुटस्ट्र्याप 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बुटस्ट्र्यापले मिडिया सुविधाको लागि समर्थन समावेश गर्दछ । ब्राउजर/वातावरणहरूमा जसले प्रयोगकर्तालाई कम गतिको लागि आफ्नो प्राथमिकता निर्दिष्ट गर्न अनुमति दिन्छ, बुटस्ट्र्यापमा अधिकांश CSS संक्रमण प्रभावहरू (उदाहरणका लागि, जब मोडल संवाद खोलिएको वा बन्द हुन्छ, वा क्यारोसेलमा स्लाइडिङ एनिमेसन) असक्षम हुनेछ, र अर्थपूर्ण एनिमेसनहरू ( जस्तै स्पिनरहरू) ढिलो गरिनेछ।

समर्थन गर्ने ब्राउजरहरूमा prefers-reduced-motion, र जहाँ प्रयोगकर्ताले स्पष्ट रूपमा सङ्केत नगरेको छ कि उनीहरूले कम गतिलाई प्राथमिकता दिन्छन् (जस्तै जहाँ ), बुटस्ट्र्यापले गुण prefers-reduced-motion: no-preferenceप्रयोग गरेर सहज स्क्रोलिङ सक्षम गर्दछ ।scroll-behavior