ਪਹੁੰਚਯੋਗਤਾ
ਬੂਟਸਟਰੈਪ ਦੀਆਂ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਅਤੇ ਪਹੁੰਚਯੋਗ ਸਮੱਗਰੀ ਦੀ ਸਿਰਜਣਾ ਲਈ ਸੀਮਾਵਾਂ ਦੀ ਇੱਕ ਸੰਖੇਪ ਜਾਣਕਾਰੀ।
ਬੂਟਸਟਰੈਪ ਰੈਡੀਮੇਡ ਸਟਾਈਲ, ਲੇਆਉਟ ਟੂਲਸ, ਅਤੇ ਇੰਟਰਐਕਟਿਵ ਕੰਪੋਨੈਂਟਸ ਦਾ ਇੱਕ ਆਸਾਨ-ਵਰਤਣ-ਯੋਗ ਫਰੇਮਵਰਕ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ, ਜਿਸ ਨਾਲ ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਵੈੱਬਸਾਈਟਾਂ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨਾਂ ਬਣਾਉਣ ਦੀ ਇਜਾਜ਼ਤ ਮਿਲਦੀ ਹੈ ਜੋ ਦਿੱਖ ਰੂਪ ਵਿੱਚ ਆਕਰਸ਼ਕ, ਕਾਰਜਸ਼ੀਲ ਤੌਰ 'ਤੇ ਅਮੀਰ, ਅਤੇ ਬਾਕਸ ਤੋਂ ਬਾਹਰ ਪਹੁੰਚਯੋਗ ਹਨ।
ਸੰਖੇਪ ਜਾਣਕਾਰੀ ਅਤੇ ਸੀਮਾਵਾਂ
ਬੂਟਸਟਰੈਪ ਨਾਲ ਬਣਾਏ ਗਏ ਕਿਸੇ ਵੀ ਪ੍ਰੋਜੈਕਟ ਦੀ ਸਮੁੱਚੀ ਪਹੁੰਚਯੋਗਤਾ ਲੇਖਕ ਦੇ ਮਾਰਕਅੱਪ, ਵਾਧੂ ਸਟਾਈਲਿੰਗ ਅਤੇ ਉਹਨਾਂ ਦੁਆਰਾ ਸ਼ਾਮਲ ਕੀਤੀ ਗਈ ਸਕ੍ਰਿਪਟਿੰਗ 'ਤੇ ਨਿਰਭਰ ਕਰਦੀ ਹੈ। ਹਾਲਾਂਕਿ, ਬਸ਼ਰਤੇ ਕਿ ਇਹਨਾਂ ਨੂੰ ਸਹੀ ਢੰਗ ਨਾਲ ਲਾਗੂ ਕੀਤਾ ਗਿਆ ਹੋਵੇ, ਬੂਟਸਟਰੈਪ ਨਾਲ ਵੈੱਬਸਾਈਟਾਂ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨਾਂ ਨੂੰ ਬਣਾਉਣਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸੰਭਵ ਹੋਣਾ ਚਾਹੀਦਾ ਹੈ ਜੋ WCAG 2.1 (A/AA/AAA), ਸੈਕਸ਼ਨ 508 , ਅਤੇ ਸਮਾਨ ਪਹੁੰਚਯੋਗਤਾ ਮਿਆਰਾਂ ਅਤੇ ਲੋੜਾਂ ਨੂੰ ਪੂਰਾ ਕਰਦੇ ਹਨ।
ਢਾਂਚਾਗਤ ਮਾਰਕਅੱਪ
ਬੂਟਸਟਰੈਪ ਦੀ ਸਟਾਈਲਿੰਗ ਅਤੇ ਲੇਆਉਟ ਨੂੰ ਮਾਰਕਅੱਪ ਢਾਂਚੇ ਦੀ ਵਿਸ਼ਾਲ ਸ਼੍ਰੇਣੀ 'ਤੇ ਲਾਗੂ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। ਇਸ ਦਸਤਾਵੇਜ਼ ਦਾ ਉਦੇਸ਼ ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਬੂਟਸਟਰੈਪ ਦੀ ਵਰਤੋਂ ਨੂੰ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ ਲਈ ਸਭ ਤੋਂ ਵਧੀਆ ਅਭਿਆਸ ਉਦਾਹਰਨਾਂ ਪ੍ਰਦਾਨ ਕਰਨਾ ਹੈ ਅਤੇ ਢੁਕਵੇਂ ਅਰਥ ਮਾਰਕਅੱਪ ਨੂੰ ਦਰਸਾਉਣਾ ਹੈ, ਜਿਸ ਵਿੱਚ ਸੰਭਾਵੀ ਪਹੁੰਚਯੋਗਤਾ ਸੰਬੰਧੀ ਚਿੰਤਾਵਾਂ ਨੂੰ ਹੱਲ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ।
ਇੰਟਰਐਕਟਿਵ ਕੰਪੋਨੈਂਟਸ
ਬੂਟਸਟਰੈਪ ਦੇ ਇੰਟਰਐਕਟਿਵ ਕੰਪੋਨੈਂਟ—ਜਿਵੇਂ ਕਿ ਮਾਡਲ ਡਾਇਲਾਗ, ਡ੍ਰੌਪਡਾਉਨ ਮੀਨੂ, ਅਤੇ ਕਸਟਮ ਟੂਲਟਿਪਸ—ਟਚ, ਮਾਊਸ, ਅਤੇ ਕੀਬੋਰਡ ਉਪਭੋਗਤਾਵਾਂ ਲਈ ਕੰਮ ਕਰਨ ਲਈ ਤਿਆਰ ਕੀਤੇ ਗਏ ਹਨ। ਸੰਬੰਧਿਤ WAI - ARIA ਭੂਮਿਕਾਵਾਂ ਅਤੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੀ ਵਰਤੋਂ ਦੁਆਰਾ, ਇਹ ਭਾਗ ਸਹਾਇਕ ਤਕਨਾਲੋਜੀਆਂ (ਜਿਵੇਂ ਕਿ ਸਕ੍ਰੀਨ ਰੀਡਰ) ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਸਮਝਣ ਯੋਗ ਅਤੇ ਸੰਚਾਲਿਤ ਹੋਣੇ ਚਾਹੀਦੇ ਹਨ।
ਕਿਉਂਕਿ ਬੂਟਸਟਰੈਪ ਦੇ ਭਾਗ ਜਾਣਬੁੱਝ ਕੇ ਕਾਫ਼ੀ ਆਮ ਹੋਣ ਲਈ ਤਿਆਰ ਕੀਤੇ ਗਏ ਹਨ, ਲੇਖਕਾਂ ਨੂੰ ਉਹਨਾਂ ਦੇ ਕੰਪੋਨੈਂਟ ਦੀ ਸਟੀਕ ਪ੍ਰਕਿਰਤੀ ਅਤੇ ਕਾਰਜਕੁਸ਼ਲਤਾ ਨੂੰ ਵਧੇਰੇ ਸਟੀਕਤਾ ਨਾਲ ਵਿਅਕਤ ਕਰਨ ਲਈ ਹੋਰ ARIA ਭੂਮਿਕਾਵਾਂ ਅਤੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੇ ਨਾਲ-ਨਾਲ JavaScript ਵਿਵਹਾਰ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨ ਦੀ ਲੋੜ ਹੋ ਸਕਦੀ ਹੈ। ਇਹ ਆਮ ਤੌਰ 'ਤੇ ਦਸਤਾਵੇਜ਼ਾਂ ਵਿੱਚ ਨੋਟ ਕੀਤਾ ਜਾਂਦਾ ਹੈ।
ਰੰਗ ਵਿਪਰੀਤ
ਰੰਗਾਂ ਦੇ ਕੁਝ ਸੰਜੋਗ ਜੋ ਵਰਤਮਾਨ ਵਿੱਚ ਬੂਟਸਟਰੈਪ ਦੇ ਡਿਫੌਲਟ ਪੈਲਅਟ ਨੂੰ ਬਣਾਉਂਦੇ ਹਨ — ਬਟਨ ਭਿੰਨਤਾਵਾਂ, ਚੇਤਾਵਨੀ ਭਿੰਨਤਾਵਾਂ, ਫਾਰਮ ਪ੍ਰਮਾਣਿਕਤਾ ਸੂਚਕਾਂ ਵਰਗੀਆਂ ਚੀਜ਼ਾਂ ��ਈ ਪੂਰੇ ਫਰੇਮਵਰਕ ਵਿੱਚ ਵਰਤੇ ਜਾਂਦੇ ਹਨ — ਨਾਕਾਫ਼ੀ ਰੰਗ ਵਿਪਰੀਤ ਹੋ ਸਕਦੇ ਹਨ (ਸਿਫਾਰਿਸ਼ ਕੀਤੇ 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ਕਲਾਸ ਦੀ ਵਰਤੋਂ ਕਰੋ। ਇਹ ਸੁਨਿਸ਼ਚਿਤ ਕਰੇਗਾ ਕਿ ਨਿਯੰਤਰਣ ਇੱਕ ਵਾਰ ਫੋਕਸ ਹੋਣ 'ਤੇ ਦਿਖਾਈ ਦਿੰਦਾ ਹੈ (ਦੇਖਣ ਵਾਲੇ ਕੀਬੋਰਡ ਉਪਭੋਗਤਾਵਾਂ ਲਈ)। ਧਿਆਨ ਰੱਖੋ, ਪਿਛਲੇ ਸੰਸਕਰਣਾਂ ਵਿੱਚ ਸਮਾਨ .sr-onlyਅਤੇ .sr-only-focusableਕਲਾਸਾਂ ਦੀ ਤੁਲਨਾ ਵਿੱਚ, Bootstrap 5's .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