Source

ਪਹੁੰਚਯੋਗਤਾ

ਬੂਟਸਟਰੈਪ ਦੀਆਂ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਅਤੇ ਪਹੁੰਚਯੋਗ ਸਮੱਗਰੀ ਦੀ ਸਿਰਜਣਾ ਲਈ ਸੀਮਾਵਾਂ ਦੀ ਇੱਕ ਸੰਖੇਪ ਜਾਣਕਾਰੀ।

ਬੂਟਸਟਰੈਪ ਰੈਡੀਮੇਡ ਸਟਾਈਲ, ਲੇਆਉਟ ਟੂਲਸ, ਅਤੇ ਇੰਟਰਐਕਟਿਵ ਕੰਪੋਨੈਂਟਸ ਦਾ ਇੱਕ ਆਸਾਨ-ਵਰਤਣ-ਯੋਗ ਫਰੇਮਵਰਕ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ, ਜਿਸ ਨਾਲ ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਵੈੱਬਸਾਈਟਾਂ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨਾਂ ਬਣਾਉਣ ਦੀ ਇਜਾਜ਼ਤ ਮਿਲਦੀ ਹੈ ਜੋ ਦਿੱਖ ਰੂਪ ਵਿੱਚ ਆਕਰਸ਼ਕ, ਕਾਰਜਸ਼ੀਲ ਤੌਰ 'ਤੇ ਅਮੀਰ, ਅਤੇ ਬਾਕਸ ਤੋਂ ਬਾਹਰ ਪਹੁੰਚਯੋਗ ਹਨ।

ਸੰਖੇਪ ਜਾਣਕਾਰੀ ਅਤੇ ਸੀਮਾਵਾਂ

ਬੂਟਸਟਰੈਪ ਨਾਲ ਬਣਾਏ ਗਏ ਕਿਸੇ ਵੀ ਪ੍ਰੋਜੈਕਟ ਦੀ ਸਮੁੱਚੀ ਪਹੁੰਚਯੋਗਤਾ ਲੇਖਕ ਦੇ ਮਾਰਕਅੱਪ, ਵਾਧੂ ਸਟਾਈਲਿੰਗ ਅਤੇ ਉਹਨਾਂ ਦੁਆਰਾ ਸ਼ਾਮਲ ਕੀਤੀ ਗਈ ਸਕ੍ਰਿਪਟਿੰਗ 'ਤੇ ਨਿਰਭਰ ਕਰਦੀ ਹੈ। ਹਾਲਾਂਕਿ, ਬਸ਼ਰਤੇ ਕਿ ਇਹਨਾਂ ਨੂੰ ਸਹੀ ਢੰਗ ਨਾਲ ਲਾਗੂ ਕੀਤਾ ਗਿਆ ਹੋਵੇ, ਬੂਟਸਟਰੈਪ ਨਾਲ ਵੈੱਬਸਾਈਟਾਂ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨਾਂ ਨੂੰ ਬਣਾਉਣਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸੰਭਵ ਹੋਣਾ ਚਾਹੀਦਾ ਹੈ ਜੋ WCAG 2.0 (A/AA/AAA), ਸੈਕਸ਼ਨ 508 ਅਤੇ ਸਮਾਨ ਪਹੁੰਚਯੋਗਤਾ ਮਿਆਰਾਂ ਅਤੇ ਲੋੜਾਂ ਨੂੰ ਪੂਰਾ ਕਰਦੇ ਹਨ।

ਢਾਂਚਾਗਤ ਮਾਰਕਅੱਪ

ਬੂਟਸਟਰੈਪ ਦੀ ਸਟਾਈਲਿੰਗ ਅਤੇ ਲੇਆਉਟ ਨੂੰ ਮਾਰਕਅੱਪ ਢਾਂਚੇ ਦੀ ਵਿਸ਼ਾਲ ਸ਼੍ਰੇਣੀ 'ਤੇ ਲਾਗੂ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। ਇਸ ਦਸਤਾਵੇਜ਼ ਦਾ ਉਦੇਸ਼ ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਬੂਟਸਟਰੈਪ ਦੀ ਵਰਤੋਂ ਨੂੰ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ ਲਈ ਸਭ ਤੋਂ ਵਧੀਆ ਅਭਿਆਸ ਉਦਾਹਰਨਾਂ ਪ੍ਰਦਾਨ ਕਰਨਾ ਹੈ ਅਤੇ ਢੁਕਵੇਂ ਅਰਥ ਮਾਰਕਅੱਪ ਨੂੰ ਦਰਸਾਉਣਾ ਹੈ, ਜਿਸ ਵਿੱਚ ਸੰਭਾਵੀ ਪਹੁੰਚਯੋਗਤਾ ਸੰਬੰਧੀ ਚਿੰਤਾਵਾਂ ਨੂੰ ਹੱਲ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ।

ਇੰਟਰਐਕਟਿਵ ਕੰਪੋਨੈਂਟਸ

ਬੂਟਸਟਰੈਪ ਦੇ ਇੰਟਰਐਕਟਿਵ ਕੰਪੋਨੈਂਟ—ਜਿਵੇਂ ਕਿ ਮਾਡਲ ਡਾਇਲਾਗਸ, ਡ੍ਰੌਪਡਾਉਨ ਮੀਨੂ ਅਤੇ ਕਸਟਮ ਟੂਲਟਿਪਸ—ਟਚ, ਮਾਊਸ ਅਤੇ ਕੀਬੋਰਡ ਉਪਭੋਗਤਾਵਾਂ ਲਈ ਕੰਮ ਕਰਨ ਲਈ ਤਿਆਰ ਕੀਤੇ ਗਏ ਹਨ। ਸੰਬੰਧਿਤ WAI - ARIA ਭੂਮਿਕਾਵਾਂ ਅਤੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੀ ਵਰਤੋਂ ਦੁਆਰਾ, ਇਹ ਭਾਗ ਸਹਾਇਕ ਤਕਨਾਲੋਜੀਆਂ (ਜਿਵੇਂ ਕਿ ਸਕ੍ਰੀਨ ਰੀਡਰ) ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਸਮਝਣ ਯੋਗ ਅਤੇ ਸੰਚਾਲਿਤ ਹੋਣੇ ਚਾਹੀਦੇ ਹਨ।

ਕਿਉਂਕਿ ਬੂਟਸਟਰੈਪ ਦੇ ਭਾਗ ਜਾਣਬੁੱਝ ਕੇ ਕਾਫ਼ੀ ਆਮ ਹੋਣ ਲਈ ਤਿਆਰ ਕੀਤੇ ਗਏ ਹਨ, ਲੇਖਕਾਂ ਨੂੰ ਉਹਨਾਂ ਦੇ ਕੰਪੋਨੈਂਟ ਦੀ ਸਟੀਕ ਪ੍ਰਕਿਰਤੀ ਅਤੇ ਕਾਰਜਕੁਸ਼ਲਤਾ ਨੂੰ ਵਧੇਰੇ ਸਟੀਕਤਾ ਨਾਲ ਵਿਅਕਤ ਕਰਨ ਲਈ ਹੋਰ ARIA ਭੂਮਿਕਾਵਾਂ ਅਤੇ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੇ ਨਾਲ-ਨਾਲ JavaScript ਵਿਵਹਾਰ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨ ਦੀ ਲੋੜ ਹੋ ਸਕਦੀ ਹੈ। ਇਹ ਆਮ ਤੌਰ 'ਤੇ ਦਸਤਾਵੇਜ਼ਾਂ ਵਿੱਚ ਨੋਟ ਕੀਤਾ ਜਾਂਦਾ ਹੈ।

ਰੰਗ ਵਿਪਰੀਤ

ਜ਼ਿਆਦਾਤਰ ਰੰਗ ਜੋ ਵਰਤਮਾਨ ਵਿੱਚ ਬੂਟਸਟਰੈਪ ਦੇ ਡਿਫੌਲਟ ਪੈਲੈਟ ਨੂੰ ਬਣਾਉਂਦੇ ਹਨ — ਬਟਨ ਪਰਿਵਰਤਨ, ਚੇਤਾਵਨੀ ਭਿੰਨਤਾਵਾਂ, ਫਾਰਮ ਪ੍ਰਮਾਣਿਕਤਾ ਸੂਚਕਾਂ ਵਰਗੀਆਂ ਚੀਜ਼ਾਂ ਲਈ ਪੂਰੇ ਫਰੇਮਵਰਕ ਵਿੱਚ ਵਰਤੇ ਜਾਂਦੇ ਹਨ — ਜਦੋਂ ਇਸਦੇ ਵਿਰੁੱਧ ਵਰਤੇ ਜਾਂਦੇ ਹਨ ਤਾਂ ਨਾਕਾਫ਼ੀ ਰੰਗ ਵਿਪਰੀਤ (ਸਿਫਾਰਿਸ਼ ਕੀਤੇ 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 ਪਰਿਵਰਤਨ ਪ੍ਰਭਾਵ (ਉਦਾਹਰਨ ਲਈ, ਜਦੋਂ ਇੱਕ ਮੋਡਲ ਡਾਇਲਾਗ ਖੋਲ੍ਹਿਆ ਜਾਂ ਬੰਦ ਕੀਤਾ ਜਾਂਦਾ ਹੈ) ਅਸਮਰੱਥ ਹੋ ਜਾਣਗੇ। ਵਰਤਮਾਨ ਵਿੱਚ, ਸਹਾਇਤਾ macOS ਅਤੇ iOS 'ਤੇ Safari ਤੱਕ ਸੀਮਿਤ ਹੈ।

ਵਾਧੂ ਸਰੋਤ