इंटरैक्टिव एलिमेंट अपने मकसद और स्थिति के बारे में बताते हैं

लिंक और बटन जैसे इंटरैक्टिव एलिमेंट की स्थिति का पता चलना चाहिए. साथ ही, ये एलिमेंट नॉन-इंटरैक्टिव एलिमेंट से अलग होने चाहिए. विज़ुअल और स्क्रीन रीडर, दोनों तरह के टेस्ट का इस्तेमाल करके यह देखा जा सकता है कि इंटरैक्टिव एलिमेंट अपने मकसद और स्थिति को दिखाते हैं या नहीं.

विज़ुअल फ़ोकस को मैन्युअल तरीके से टेस्ट करने का तरीका

विज़ुअल फ़ोकस को मैन्युअल तरीके से टेस्ट करने के लिए, अपने पेज के ज़रिए TAB.

  • क्या हर इंटरैक्टिव एलिमेंट पर टैब किया जा सकता है?
  • जब आप किसी इंटरैक्टिव एलिमेंट पर जाते हैं, तो क्या कोई विज़ुअल संकेत दिखता है कि उपयोगकर्ता उससे इंटरैक्ट कर सकते हैं?
  • क्या हर इंटरैक्टिव एलिमेंट को चुनने पर, उसका लुक बदलता है?

हर इंटरैक्टिव एलिमेंट के लिए, फ़ोकस इंडिकेटर को स्टाइल देने के कई तरीके हैं. :focus का इस्तेमाल करना एक अच्छा तरीका है. :focus सूडो-क्लास की मदद से, किसी एलिमेंट पर एक जैसी स्टाइल लागू की जा सकती है. वह स्टाइल जब भी एलिमेंट पर फ़ोकस किया जाता है, तब लागू किया जाता है. इससे कोई फ़र्क़ नहीं पड़ता कि उसे फ़ोकस करने के लिए इनपुट डिवाइस या किस तरीके का इस्तेमाल किया गया है.

स्टाइल फ़ोकस में ज़्यादा जानें.

स्क्रीन रीडर की मदद से, मैन्युअल तरीके से टेस्ट करने का तरीका

स्क्रीन रीडर का इस्तेमाल करके, अपने पेज पर नेविगेट करें और देखें कि स्क्रीन रीडर हर इंटरैक्टिव कंट्रोल का नाम, उस कंट्रोल की भूमिका, और मौजूदा इंटरैक्टिव स्थिति के बारे में बता पा रहा है या नहीं. अगर किसी एलिमेंट की भूमिका साफ़ तौर पर नहीं बताई गई है और एलिमेंट की स्थिति के बारे में साफ़ तौर पर नहीं बताया गया है, तो आपको सही ARIA भूमिकाएं जोड़नी पड़ सकती हैं. कस्टम कंट्रोल में ARIA रोल हैं के बारे में ज़्यादा जानें.

इस बात पर भी खास ध्यान देना ज़रूरी है कि इंटरैक्टिव एलिमेंट को कैसे लेबल किया जाता है. स्क्रीन रीडर और अन्य सहायक टेक्नोलॉजी के उपयोगकर्ता, उस एलिमेंट के संदर्भ को समझने के लिए लेबल पर भरोसा करते हैं. अस्पष्ट लेबल सामान्य होते हैं और वे सामग्री को नेविगेट करने में उपयोगी नहीं होते हैं. लेबल और टेक्स्ट के विकल्पों को बेहतर बनाने का तरीका जानें.

यह क्यों मायने रखता है

विज़ुअल संकेत देकर बताएं कि कंट्रोल कैसे काम करेगा. इससे लोगों को आपकी साइट ऑपरेट और नेविगेट करने में मदद मिलेगी. इन संकेतों को अफ़र्नेंस कहा जाता है. खर्च की जानकारी देने से, लोग आपकी साइट को अलग-अलग तरह के डिवाइसों पर इस्तेमाल कर सकते हैं.

संसाधन

इंटरैक्टिव एलिमेंट के सोर्स कोड से उनके मकसद और स्थिति का पता चलता है ऑडिट