इस पृष्ठ का अनुवाद AI की सहायता से किया गया है। अंग्रेज़ी मूल ही प्रामाणिक है।
चौड़ाई टाइप-अक्षों में सबसे शांत है। पाठक उसे सचेत रूप से शायद ही कभी नोटिस करते हैं, फिर भी वह उन दो संसाधनों पर शासन करती है जिन पर सुपाठ्यता (legibility) निर्भर है: अक्षरों के भीतर का काउंटर-स्थान और एक पंक्ति में समाने वाले वर्णों की संख्या। 2005 का निष्कर्ष था कि रेगुलर से हल्की संघनित चौड़ाइयाँ सबसे सुपाठ्य होती हैं — विस्तारित (extended) फ़ेस अक्षर-रूपों को सहज पहचान से परे फैला देते हैं, और भारी संघनित फ़ेस उन काउंटरों का दम घोंट देते हैं जो e को c से या o से अलग करते हैं। वह निष्कर्ष अच्छी तरह टिका है। जो बदला है वह है तंत्र: चौड़ाई अब किसी फ़ॉन्ट फ़ाइल की स्थिर विशेषता नहीं, बल्कि एक सतत, स्क्रिप्ट-योग्य डिज़ाइन अक्ष है।
2005 के बाद क्या बदला
2005 में "कंडेंस्ड" फ़ॉन्ट एक अलग फ़ाइल था — अगर वह मौजूद भी हो — और वेब डिज़ाइनरों के पास प्रायः न वैसे फ़ॉन्ट थे, न उन्हें पहुँचाने की व्यवस्था। दो घटनाक्रमों ने इसे बदल दिया। वेब फ़ॉन्ट डिलीवरी (आधुनिक @font-face युग, लगभग 2010 से) ने असली संघनित और विस्तारित कट उपलब्ध कराए। फिर OpenType वेरिएबल फ़ॉन्ट (2016 के बाद) ने wdth को एक मानक अक्ष के रूप में पंजीकृत किया, जो CSS में font-stretch के माध्यम से — अब औपचारिक रूप से font-width के उपनाम से — उपलब्ध है, condensed (75%) और semi-condensed (87.5%) जैसे कीवर्ड मानों के साथ, या उस सीमा का समर्थन करने वाले फ़ॉन्ट्स पर मनचाहे प्रतिशतों के साथ।
डिज़ाइन किए गए चौड़ाई-अक्ष की निर्णायक विशेषता यह है कि वह स्केलिंग नहीं है। जब कोई वेरिएबल फ़ॉन्ट wdth के अनुदिश संकरा होता है, तो डिज़ाइनर का इंटरपोलेशन खड़े स्ट्रोकों का वज़न सुसंगत रखता है, ज्यामिति जितना अनुमति दे उतना काउंटरों को खुला रखता है, और स्पेसिंग को फिर से बिठाता है। क्षैतिज स्केलिंग — transform: scaleX(0.8) या उसके पूर्वज — ठीक उल्टा करती है: वह खड़े स्ट्रोकों को आड़ों की तुलना में पतला करती है, वक्रों को विकृत करती है, और स्पेसिंग को आनुपातिक रूप से दबा देती है। असली कंडेंस्ड और नक़ली कंडेंस्ड का भेद ठीक वही भेद है जो असली इटैलिक और तिरछे किए गए रोमन का है — और वह उन्हीं अल्प दृष्टि (low vision) वाले पाठकों के लिए मायने रखता है।
दूसरा परिवर्तन वैचारिक है। रिस्पॉन्सिव डिज़ाइन ने हमें सिखाया कि उपयोगकर्ता वास्तव में जिस चर का अनुभव करते हैं वह फ़ॉन्ट-चयन नहीं, पंक्ति-लंबाई है — और चौड़ाई अब उसे प्रबंधित करने का एक उपकरण है। जो शीर्षक संकरे व्यूपोर्ट पर बेढंगे ढंग से लिपटता है, वह पठनीय आकार से नीचे सिकुड़ने के बजाय कुछ चौड़ाई-इकाइयाँ कस सकता है। यह वाक़ई एक नई क्षमता है, और इसके साथ ग़लती करने के वाक़ई नए तरीक़े भी आते हैं।
चौड़ाई और काउंटर-बजट
संस्करण 1 की सुपाठ्यता-यांत्रिकी इस लेन-देन का अब भी सही वर्णन करती है। विस्तारित चौड़ाइयाँ अक्षर-रूपों को कोई विभेदक जानकारी जोड़े बिना क्षैतिज रूप से बड़ा करती हैं; पठन-आकारों पर वे पहचान को थोड़ा धीमा करती हैं और पंक्ति-लंबाई बर्बाद करती हैं। तीव्र संघनित चौड़ाइयाँ काउंटर बंद करती हैं और भ्रमित करने वाले युग्मों के बीच स्थानिक अंतर घटा देती हैं — किसी कसे हुए कंडेंस्ड में o, e और c एक-दूसरे में मिल जाते हैं, और minimum जैसे शब्दों में खड़ी रेखाओं की लय बाड़ के डंडों जैसी हो जाती है।
सतत पाठ के लिए सुरक्षित पट्टी अब भी संकरी है: सामान्य चौड़ाई का लगभग 90% से 100% — सामान्य से लेकर सेमी-कंडेंस्ड से ठीक ऊपर तक। कंडेंस्ड और उससे संकरे कट डिस्प्ले उपकरण हैं — शीर्षक, लेबल, डेटा-सघन तालिकाएँ, जहाँ डिज़ाइन किया गया कंडेंस्ड सिकोड़े गए रेगुलर से वास्तव में बेहतर प्रदर्शन करता है। विस्तारित कट ब्रांडिंग उपकरण हैं। अनुच्छेदों में दोनों की जगह नहीं है।
वज़न चौड़ाई के साथ क्रिया करता है। बोल्ड फ़ेस को संघनित करना काउंटरों को दोहरा बंद करता है; यदि संघनित करना ही पड़े, तो रेगुलर या उससे हल्के वज़न पर रहें। आकार भी क्रिया करता है: जो चौड़ाई 40px के शीर्षक-आकार पर काम करती है, उसे 16px के बॉडी-आकार पर ढीला करना पड़ता है। कुछ वेरिएबल फ़ॉन्ट wdth के साथ एक ऑप्टिकल साइज़ अक्ष (opsz) जोड़ते हैं जो इसे आंशिक रूप से सँभालता है; अधिकांश इसे आप पर छोड़ देते हैं।
ज़ूम, आवर्धन और अल्प दृष्टि
जिस आबादी को उदार चौड़ाइयों की सबसे अधिक ज़रूरत है, वही आबादी संघनित टाइप से बदतरीन परिस्थितियों में मिलने की सबसे अधिक संभावना रखती है। स्क्रीन मैग्निफ़ायर उपयोगकर्ता बड़े किए गए पृष्ठ पर एक छोटी खिड़की देखते हैं: आवर्धित संघनित टाइप अपनी बंद काउंटरों और कसे फ़िट को पूरी पंक्ति के क्षतिपूरक संदर्भ के बिना उघाड़ देता है। 200% ब्राउज़र ज़ूम — जिस स्तर को झेलना WCAG 2.2 का Resize Text मानदंड (1.4.4) अनिवार्य करता है — इस्तेमाल करने वाले पाठक आपके संकरे-व्यूपोर्ट लेआउट सक्रिय कर देंगे, और यही वह जगह है जहाँ डिज़ाइनर अब चीज़ें समाने के लिए टाइप संघनित करने को ललचाते हैं।
बॉडी टेक्स्ट के लिए उस प्रलोभन का प्रतिरोध करें। यदि कोई लेआउट 200% ज़ूम पर केवल अक्षर-रूपों को निचोड़कर ही काम करता है, तो समस्या लेआउट है। WCAG 1.4.10 (Reflow) सही दिशा दिखाता है: सामग्री को दबने के बजाय एक ही स्तंभ में रीफ़्लो होना चाहिए। रीफ़्लो में शीर्षकों के लिए चौड़ाई-समायोजन वैध है; अनुच्छेदों पर लागू हो तो वह ख़तरे का संकेत है।
टेक्स्ट-स्पेसिंग अनुकूलन यहाँ भी मायने रखते हैं। WCAG 1.4.12 अपेक्षा करता है कि उपयोगकर्ता द्वारा बढ़ाई गई अक्षर- और शब्द-स्पेसिंग सामग्री को न तोड़े। कसे फ़िट पर निर्भर संघनित टाइप तब दृश्य रूप से बिखर जाता है जब कोई अल्प दृष्टि वाला उपयोगकर्ता letter-spacing जोड़ता है — सतत पाठ को सामान्य चौड़ाई के निकट रखने का एक और कारण, जहाँ जोड़ी गई ट्रैकिंग (tracking) शालीनता से समायोजित हो जाती है।
नक़ली-कंडेंस्ड से बचना
नक़ली संघनन तीन रूपों में अब भी प्रचलन में है: टेक्स्ट पर CSS ट्रांसफ़ॉर्म, बिना चौड़ाई-अक्ष वाले फ़ॉन्ट्स पर लगाया गया पुराना font-stretch (जिसे ब्राउज़र सही ही अनदेखा करते हैं, पर डिज़ाइनर कभी-कभी ट्रांसफ़ॉर्म से "ठीक" कर देते हैं), और SVG या कैनवस में असमान रूप से स्केल किया गया टेक्स्ट। तीनों वही पतले-खड़े-स्ट्रोकों वाली विकृति पैदा करते हैं जिसे किसी टाइप डिज़ाइनर ने मंज़ूर नहीं किया। यदि किसी डिज़ाइन को वाक़ई संकरा टाइप चाहिए, तो विकल्प हैं: असली wdth अक्ष वाला वेरिएबल फ़ॉन्ट, अलग से डिज़ाइन किया गया कंडेंस्ड कट, या कोई भिन्न लेआउट। कोई चौथा विकल्प नहीं है जो पाठक का सम्मान करता हो।
जब आप wdth अक्ष का उपयोग करें, तो कच्ची font-variation-settings के बजाय उच्च-स्तरीय font-stretch/font-width प्रॉपर्टी को प्राथमिकता दें ताकि ब्राउज़र विरासत और फ़ॉलबैक को समझदारी से सँभाल सके, और फ़ॉलबैक सत्यापित करें: जिन सिस्टमों पर वेरिएबल फ़ॉन्ट लोड नहीं होता, वहाँ फ़ॉलबैक स्टैक के विरुद्ध कंडेंस्ड अनुरोध को सामान्य चौड़ाई पर उतरना चाहिए, संश्लेषित निचोड़ पर नहीं।
CSS में
/* Width belongs to the wdth axis — never to transforms */
body { font-stretch: 100%; }
.compact-table { font-stretch: 92%; } /* slightly condensed floor */
/* Anti-pattern — distorts stroke contrast and spacing:
.squeezed { transform: scaleX(0.8); } */सिफ़ारिशें
- सतत पाठ को सामान्य चौड़ाई के लगभग 90% और 100% के बीच रखें; 2005 का निष्कर्ष क़ायम है।
- डिज़ाइन किए गए कंडेंस्ड कटों को शीर्षकों, लेबलों और स्थान-संकट वाली डिस्प्ले सेटिंग्स के लिए आरक्षित रखें; विस्तारित कटों को ब्रांडिंग के लिए।
- चौड़ाई कभी नक़ली न बनाएँ: कोई scaleX ट्रांसफ़ॉर्म नहीं, SVG या कैनवस में टेक्स्ट की कोई असमान स्केलिंग नहीं।
- वेरिएबल wdth अक्ष का उपयोग font-stretch (font-width) के माध्यम से करें, और फ़ॉन्ट लोड न होने पर शालीन फ़ॉलबैक की पुष्टि करें।
- 200% ज़ूम या संकरे व्यूपोर्ट झेलने के लिए बॉडी टेक्स्ट को संघनित न करें — WCAG 1.4.10 के अनुसार रीफ़्लो करें।
- सत्यापित करें कि उपयोगकर्ता के अक्षर- और शब्द-स्पेसिंग बढ़ाने पर टेक्स्ट अक्षुण्ण रहे (WCAG 1.4.12); कसी हुई कंडेंस्ड सेटिंग्स प्रायः इसमें सबसे पहले विफल होती हैं।
- संघनित चौड़ाई को बोल्ड वज़न या छोटे आकारों के साथ मिलाने से बचें; काउंटर-बजट उतना नहीं खिंचता।