टेक्स्ट स्पेसिंग एक्सेसिबिलिटी कैलकुलेटर

टेक्स्ट स्पेसिंग एक्सेसिबिलिटी कैलकुलेटर

यह कैलकुलेटर क्या करता है

यह जांचता है कि आपकी CSS टेक्स्ट स्पेसिंग — लाइन हाइट, लेटर स्पेसिंग, वर्ड स्पेसिंग और पैराग्राफ स्पेसिंग — WCAG 2.1 सफलता मानदंड 1.4.12 (टेक्स्ट स्पेसिंग, लेवल AA) द्वारा तय की गई न्यूनतम आवश्यकताओं को पूरा करती है या नहीं। यह मानदंड इसलिए मौजूद है क्योंकि कम दृष्टि या पढ़ने/संज्ञानात्मक अक्षमता वाले कई उपयोगकर्ता ब्राउज़र एक्सटेंशन या यूज़र स्टाइलशीट का उपयोग करके किसी साइट की टेक्स्ट स्पेसिंग को बदलकर सामग्री को पढ़ने में आसान बनाते हैं। कोई साइट 1.4.12 का अनुपालन तभी करती है जब उपयोगकर्ता द्वारा इन अधिक उदार स्पेसिंग मानों को लागू करने पर कोई सामग्री या कार्यक्षमता न खोए — जिसका व्यावहारिक अर्थ है कि साइट की अपनी डिफ़ॉल्ट स्पेसिंग पहले से ही इन न्यूनतम मानों के बराबर या उससे अधिक होनी चाहिए, या कम से कम इन्हें बढ़ाने पर टूटनी नहीं चाहिए।

चार न्यूनतम आवश्यकताएँ

सभी चार न्यूनतम आवश्यकताएँ एलिमेंट के अपने फ़ॉन्ट साइज़ के गुणक के रूप में व्यक्त की जाती हैं:

$$\text{line height} \geq 1.5 \times \text{font size}$$ $$\text{letter spacing} \geq 0.12 \times \text{font size}$$ $$\text{word spacing} \geq 0.16 \times \text{font size}$$ $$\text{spacing following paragraphs} \geq 2 \times \text{font size}$$

इसका उपयोग कैसे करें

1. अपने एलिमेंट का फ़ॉन्ट साइज़ पिक्सल में दर्ज करें।
2. अपनी वर्तमान लाइन हाइट, लेटर स्पेसिंग, वर्ड स्पेसिंग और पैराग्राफ स्पेसिंग (पैराग्राफ के नीचे की जगह, जैसे margin-bottom) भी पिक्सल में दर्ज करें।
3. सबमिट करने पर आपको एक पास/फेल चेकलिस्ट और आपके मानों की तुलना आपके फ़ॉन्ट साइज़ के लिए आवश्यक न्यूनतम मानों से करने वाली तालिका दिखेगी।

उदाहरण

एक पैराग्राफ जिसकी स्टाइलिंग font-size: 16px, line-height: 22px, letter-spacing: 0px, word-spacing: 0px, और margin-bottom: 24px है:

$$\text{required line height} = 1.5 \times 16 = 24\text{px} \Rightarrow 22\text{px fails}$$ $$\text{required letter spacing} = 0.12 \times 16 = 1.92\text{px} \Rightarrow 0\text{px fails}$$ $$\text{required word spacing} = 0.16 \times 16 = 2.56\text{px} \Rightarrow 0\text{px fails}$$ $$\text{required paragraph spacing} = 2 \times 16 = 32\text{px} \Rightarrow 24\text{px fails}$$

इस पैराग्राफ को 1.4.12 का अनुपालन करने के लिए अधिक ऊँची लाइन हाइट, जोड़ी गई लेटर/वर्ड स्पेसिंग, और नीचे अधिक जगह की आवश्यकता होगी।

यह क्यों महत्वपूर्ण है

WCAG 1.4.12 एक लेवल AA मानदंड है, यानी अधिकांश एक्सेसिबिलिटी अनुपालन लक्ष्यों (जिसमें व्यापक रूप से संदर्भित WCAG 2.1 AA बेसलाइन शामिल है) में इसकी आवश्यकता होती है। अनुपालन से परे, उदार टेक्स्ट स्पेसिंग वास्तव में डिस्लेक्सिया, कम दृष्टि, और कुछ संज्ञानात्मक अक्षमताओं वाले पाठकों को टेक्स्ट की पंक्तियों को ट्रैक करने और अलग-अलग शब्दों को पहचानने में मदद करती है — जबकि यह अन्य किसी के लिए पठनीयता को शायद ही कभी नुकसान पहुँचाती है।