द यूनिवर्सल वेब

1.6 चुने हुए टाइपफ़ेस

टाइपफ़ेस नाम से नहीं, बल्कि मापने योग्य सुपाठ्यता कसौटियों — एक्स-हाइट, अपर्चर, वर्णों की पहचान, स्पेसिंग — के आधार पर चुनें, और 'सुगम्य फ़ॉन्ट' के विपणन दावों को सूचित संदेह के साथ देखें।

7 min read

इस पृष्ठ का अनुवाद AI की सहायता से किया गया है। अंग्रेज़ी मूल ही प्रामाणिक है।

इस अध्याय के 2005 के संस्करण ने वही किया जो उसके दौर की हर मार्गदर्शिका करती थी: नाम गिनाए। Verdana, Georgia और उनका दल — स्क्रीन के लिए कमीशन किए गए Microsoft के कोर वेब फ़ॉन्ट्स — तब बचाव-योग्य सिफ़ारिशें थीं, जब डिज़ाइनर केवल उपयोगकर्ताओं की मशीनों पर पहले से स्थापित फ़ॉन्ट्स पर निर्भर रह सकते थे। बीस साल बाद वह बाधा नहीं रही। वेब फ़ॉन्ट्स भरोसेमंद ढंग से लोड होते हैं, वेरिएबल फ़ॉन्ट्स (variable fonts) मुख्यधारा में हैं, और उपलब्ध टाइपफ़ेसों (typefaces) की सूची दर्जन भर से बढ़कर हज़ारों में पहुँच गई है। अब छोटी सूची के नाम गिनाना उपयोगी नहीं रहा। कसौटियाँ सिखाना उपयोगी है।

यह बदलाव अधिक ईमानदार भी है। पुरानी सूची इसलिए अच्छी नहीं थी कि वे फ़ॉन्ट्स जादुई थे, बल्कि इसलिए कि वे विशिष्ट, जाँचने योग्य गुणों के मूर्त रूप थे: उदार एक्स-हाइट (x-height), खुले अपर्चर (aperture), ढीला फ़िट, और ऐसे अक्षर-रूप जो मोटे रेंडरिंग में भी टिके रहें। वे गुण — मोटे तौर पर वही Boyarski-युग की कसौटियाँ जिनका मूल अध्याय ने हवाला दिया था — आज भी सही परीक्षा हैं, और किसी भी उम्मीदवार टाइपफ़ेस पर मिनटों में लागू की जा सकती हैं।

2005 के बाद क्या बदला

तीन चीज़ें। पहली, डिलीवरी की समस्या घुल गई: @font-face और WOFF2 संपीड़न ने चुने हुए टाइपफ़ेस को भेजना सामान्य बात बना दिया, जिससे "डिफ़ॉल्ट स्क्रीन फ़ॉन्ट" और "एम्बेडेड फ़ॉन्ट" अब अर्थपूर्ण रूप से अलग श्रेणियाँ नहीं रहीं, और लाइसेंसिंग की जो चिंता मूल अध्याय ने जताई थी, वह वेब-लाइसेंसिंग के मानदंडों और ओपन-सोर्स टाइप में काफ़ी हद तक समा गई है।

दूसरी, उद्देश्य-निर्मित "सुगम्य टाइपफ़ेसों" की एक विधा उभरी। कुछ गंभीर प्रयास हैं: Braille Institute द्वारा कमीशन किया गया Atkinson Hyperlegible कम दृष्टि वाले पाठकों के लिए प्रायः भ्रमित होने वाले वर्णों के बीच के अंतर को बढ़ा-चढ़ाकर दिखाता है। Lexend इस परिकल्पना के इर्द-गिर्द डिज़ाइन किया गया कि चौड़ी स्पेसिंग और विशिष्ट अनुपात पठन-प्रवाह सुधारते हैं। APHont को American Printing House for the Blind ने कम-दृष्टि प्रिंट और स्क्रीन उपयोग के लिए विकसित किया। Luciole फ़्रांस में विशेष रूप से दृष्टिबाधित पाठकों के लिए डिज़ाइन किया गया। ये उन लोगों की वास्तविक परियोजनाएँ हैं जिन्होंने समस्या का अध्ययन किया।

तीसरी — और यही आवश्यक चेतावनी है — प्रमाणों का आधार विपणन की रफ़्तार से नहीं बढ़ा। पठन-गति और बोधगम्यता के स्वतंत्र अध्ययन आम तौर पर पाते हैं कि पाठकों के बीच के वैयक्तिक अंतर, समुचित टाइपफ़ेसों के बीच के अंतर पर भारी पड़ते हैं, और परिचितता स्वयं सुपाठ्यता (legibility) का एक कारक है। विशेष रूप से डिस्लेक्सिया-विशिष्ट फ़ॉन्ट्स के बहुप्रचारित दावे नियंत्रित अध्ययनों में बार-बार दोहराए नहीं जा सके: ऐसे अध्ययनों में डिस्लेक्सिया वाले पाठक विशेष डिस्लेक्सिया फ़ॉन्ट्स में सामान्य, अच्छी स्पेसिंग वाले टाइप से तेज़ नहीं पढ़ते, और अक्सर परिचित टाइपफ़ेसों को ही पसंद करते हैं। "सुगम्यता के लिए डिज़ाइन किया गया" एक डिज़ाइन इरादा है, परिणाम की गारंटी नहीं। लेबल पर नहीं, दिखने वाले, जाँचने योग्य गुणों पर चुनें।

जो कसौटियाँ मायने रखती हैं

संस्करण 1 की सूची उल्लेखनीय रूप से खरी उतरती है; यह रही, अद्यतन और परीक्षण-योग्य रूप में।

  • वर्णों की पहचान। Il1 लिखकर देखें, फिर 0O, फिर m के बगल में rn, फिर d के बगल में cl। बड़ा I, छोटा l और अंक 1 एक नज़र में अलग पहचाने जाने चाहिए — सेरिफ़ (serif), पूँछ वाले l, या सपाट शीर्ष वाले 1 के ज़रिए। यह सबसे तेज़ अयोग्यता-परीक्षा है, और कई लोकप्रिय ज्यामितीय सैंस-सेरिफ़ इसमें विफल रहते हैं।
  • खुले अपर्चर। a, c, e और s के खुले हिस्से चौड़े होने चाहिए। बंद अपर्चर धुँधलेपन, छोटे आकार या कम दृष्टि में e को o की ओर ढहा देते हैं।
  • उदार एक्स-हाइट, संयम के भीतर। बड़ी एक्स-हाइट अक्षर के उस हिस्से को बड़ा करती है जो सबसे अधिक पहचान वहन करता है। अति उलटी पड़ती है: जब एक्स-हाइट एसेंडरों को घेरने लगती है, तो h और n मिलने लगते हैं, और d तथा a का अलगाव खोने लगता है।
  • सहज फ़िट। टेक्स्ट आकारों पर थोड़ी ढीली स्पेसिंग, फ़ैशनेबल कसी हुई स्पेसिंग से बेहतर है। यह भी जाँचें कि टाइपफ़ेस उपयोगकर्ता द्वारा बढ़ाई गई letter-spacing (WCAG 1.4.12) को बिखरे बिना सह लेता है।
  • मध्यम स्ट्रोक कंट्रास्ट और मज़बूत जोड़। उच्च-कंट्रास्ट आधुनिक शैलियाँ छोटे आकारों और कम रिज़ॉल्यूशन पर अपने पतले स्ट्रोक खो देती हैं। मध्यम, लगभग एकसार वज़न भरोसेमंद ढंग से रेंडर होते हैं।
  • दो-मंज़िला a, पहचाना जा सकने वाला g, असंदिग्ध रूप। अक्षर-रूप बनावट से भिन्न होने चाहिए, केवल बारीकी से नहीं। दर्पण-युग्मों (b/d, p/q) को असममित विवरणों से लाभ होता है।
  • एक असली इटैलिक और एक उपयोगी बोल्ड। अध्याय 1.3 और 1.4 के अनुसार, आपको ईमानदार ज़ोर-शैलियों की ज़रूरत होगी; जिस परिवार में वे न हों, वह कृत्रिम संश्लेषण के लिए मजबूर करता है।
वैसे, सेरिफ़ बनाम सैंस-सेरिफ़ का सवाल अब भी बराबरी पर छूटता है। शोध की आम सहमति है कि आधुनिक स्क्रीनों पर किसी भी श्रेणी को सामान्य सुपाठ्यता-लाभ नहीं है; ऊपर के गुण इस विभाजन के आर-पार जाते हैं। Georgia इनमें से अधिकांश परीक्षाएँ पास करता है; एक अच्छी तरह बना ह्यूमनिस्ट सैंस भी।

सिस्टम स्टैक और परिचितता का लाभांश

आधुनिक सिस्टम फ़ॉन्ट स्टैक — Apple प्लेटफ़ॉर्मों पर San Francisco, Windows पर Segoe UI, Android पर Roboto, font-family: system-ui के ज़रिए — विशेष प्रशंसा का पात्र है। ये टाइपफ़ेस अपने प्लेटफ़ॉर्म की रेंडरिंग के लिए इंजीनियर किए गए, पूरे वज़न-रेंज और असली इटैलिक के साथ आते हैं, लोड करने में कुछ ख़र्च नहीं होता (एक प्रदर्शन-लाभ जो धीमे कनेक्शनों पर स्वयं सुगम्यता-लाभ है), और यही वे टाइपफ़ेस हैं जिन्हें पाठक दिन भर देखते हैं। परिचितता मापने योग्य सुपाठ्यता-पूँजी है। सिस्टम स्टैक कभी रोमांचक विकल्प नहीं होता, लेकिन ऐप्लिकेशन UI और उपयोगितावादी टेक्स्ट के लिए यह लगभग निर्विवाद है।

संपादकीय स्वर के लिए ईमानदार स्थिति यह है कि कई साधारण, अच्छी तरह बने टेक्स्ट टाइपफ़ेस — ह्यूमनिस्ट सैंस-सेरिफ़ और मज़बूत टेक्स्ट सेरिफ़ दोनों — ऊपर की हर कसौटी पर खरे उतरते हैं। पहले नामित सुगम्यता-केंद्रित टाइपफ़ेस भी समुचित उम्मीदवार हैं, ख़ास तौर पर Atkinson Hyperlegible वहाँ, जहाँ कम दृष्टि वाले पाठक प्रमुख दर्शक हों। मायने यह रखता है कि चुनाव को इन कसौटियों पर और आपके वास्तविक रेंडरिंग लक्ष्यों पर, आपके वास्तविक आकारों में परखा जाए।

Georgia, Verdana और Tahoma में सेट Handgloves 123 — सिस्टम टाइपफ़ेसों की लागत शून्य बाइट है, वे कोई फ़ॉन्ट स्वैप नहीं कराते, और हर पाठक के लिए परिचित हैं।

CSS में

/* Criteria first, then names: distinct Il1/0O, open apertures */
body {
  font-family: "Atkinson Hyperlegible", Seravek, Verdana,
    system-ui, sans-serif;
  font-size-adjust: 0.53;   /* keep fallback x-heights consistent */
}

सिफ़ारिशें

  • नाम या "सुगम्य" ब्रांडिंग से नहीं, कसौटियों से चुनें: Il1, 0O, rn/m, अपर्चर का खुलापन और फ़िट स्वयं परखें।
  • विशेष सुगम्यता फ़ॉन्ट्स को ऐसे उम्मीदवार मानें जिन्हें वही परीक्षाएँ पास करनी होंगी — कई (Atkinson Hyperlegible, Lexend, APHont, Luciole) विश्वसनीय हैं; कोई भी रामबाण नहीं।
  • डिस्लेक्सिया-फ़ॉन्ट के दावों पर संदेह रखें; नियंत्रित अध्ययनों ने पठन-गति के लाभों का समर्थन नहीं किया है, और अच्छी स्पेसिंग वाला साधारण टाइप तुलनीय प्रदर्शन करता है।
  • सवाल सेरिफ़ बनाम सैंस-सेरिफ़ का नहीं है; बनावट की गुणवत्ता का है।
  • UI और उपयोगितावादी टेक्स्ट के लिए सिस्टम फ़ॉन्ट स्टैक आत्मविश्वास से उपयोग करें — परिचितता और रेंडरिंग गुणवत्ता वास्तविक लाभ हैं।
  • जिस भी परिवार को अपनाएँ, उसमें एक असली इटैलिक और कम से कम एक ठोस बोल्ड अनिवार्य रखें।
  • प्रतिबद्ध होने से पहले जाँचें कि आपका चुनाव WCAG टेक्स्ट-स्पेसिंग समायोजनों, 200% ज़ूम और आपके सबसे छोटे उत्पादन-आकार में टिकता है।
  • टाइपफ़ेस, रेंडरिंग वातावरण या दर्शक बदलने पर दोबारा परखें — कसौटियाँ स्थिर हैं, लेकिन उत्तीर्णों की सूची नहीं।

आगे पढ़ें