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

परिचय

यूनिवर्सल वेब दिशानिर्देशों का बीस-वर्षीय पुनरीक्षण: 2005 के दौर के टाइपोग्राफ़िक सुगम्यता निष्कर्षों को उच्च-घनत्व डिस्प्ले, वेरिएबल फ़ॉन्ट, WCAG 2.2 और आधुनिक रिस्पॉन्सिव वेब की कसौटी पर फिर से परखना।

6 min read

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

2005 में यूनिवर्सल वेब प्रोजेक्ट एक व्यावहारिक प्रश्न का उत्तर खोजने निकला था: स्क्रीन पर टेक्स्ट को कैसे सजाया जाए कि अल्प दृष्टि (low vision) वाले लोग — और उनके साथ-साथ हर कोई — उसे वास्तव में पढ़ सकें? मूल दिशानिर्देश बीसवीं सदी के ग्राफ़िक डिज़ाइन सिद्धांतों और उस समय की डिस्प्ले तकनीक पर आधारित थे: मोटे पिक्सेल वाले CRT और शुरुआती LCD पैनल, स्क्रीन के लिए अनुकूलित मुट्ठी भर टाइपफ़ेस (typeface), और ऐसे ब्राउज़र जो टाइप के आकार को बमुश्किल एक सुझाव भर मानते थे।

दो दशक बाद, उस शोध की लगभग हर बुनियादी धारणा बदल चुकी है। यह दूसरा संस्करण हर निष्कर्ष को फिर से परखता है, जो टिका रहा उसे बनाए रखता है, और जो नहीं टिका उसे संशोधित करता है।

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

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

मूल दिशानिर्देश ऐसी स्क्रीनों के लिए लिखे गए थे जो टाइप को लगभग 96 पिक्सेल प्रति इंच पर रेंडर करती थीं, जहाँ किसी अक्षर-रूप (letterform) के पास काम करने के लिए मुश्किल से एक दर्जन पिक्सेल होते थे। उन परिस्थितियों में शोध ने मज़बूत सैंस-सेरिफ़ (sans serif), उदार आकारों और रक्षात्मक सादगी का पक्ष लिया था। चार घटनाक्रमों ने इस सोच पर पुनर्विचार अनिवार्य कर दिया।

पहला, डिस्प्ले घनत्व। हाई-DPI पैनल — आमतौर पर प्रति CSS पिक्सेल दो से तीन डिवाइस पिक्सेल — अक्षर-रूपों को प्रिंट के स्तर के विवरण के साथ रेंडर करते हैं। महीन सेरिफ़ (serif), स्ट्रोक की सूक्ष्म मॉड्युलेशन, और असली इटैलिक अब स्क्रीन पर उस तरह टिके रहते हैं जैसा 2005 में संभव ही नहीं था। मूल सिफ़ारिशों में से कई ऐसी रेंडरिंग सीमाओं की भरपाई कर रही थीं जो अधिकांश उपयोगकर्ताओं के लिए अब मौजूद नहीं हैं — हालाँकि सभी के लिए नहीं।

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

तीसरा, मानकों का परिदृश्य। वेब कंटेंट एक्सेसिबिलिटी गाइडलाइंस 2.0, 2.1 और 2.2 से होते हुए परिपक्व हुईं, जिन्होंने हमें टेक्स्ट रीसाइज़िंग (1.4.4), रीफ़्लो (1.4.10), टेक्स्ट स्पेसिंग (1.4.12) और कंट्रास्ट (1.4.3 और 1.4.11) के लिए परीक्षण-योग्य सफलता मानदंड दिए। इस बीच WCAG 3.0 का मसौदा और उसके पीछे का APCA कंट्रास्ट शोध इस पर नए सिरे से विचार कर रहे हैं कि कंट्रास्ट, आकार और वज़न आपस में कैसे क्रिया करते हैं — एक ऐसा प्रश्न जिसकी ओर 2005 के दिशानिर्देश केवल संकेत भर कर सकते थे।

चौथा, CSS परिपक्व हो गई। उपयोगकर्ता की डिफ़ॉल्ट सेटिंग का सम्मान करने वाली rem-आधारित साइज़िंग, clamp() के साथ फ़्लुइड टाइप, इकाई-रहित line-height, ch-आधारित पंक्ति-लंबाई, font-size-adjust, text-wrap, और prefers-color-scheme तथा prefers-reduced-motion जैसी मीडिया क्वेरीज़ डिज़ाइनरों को उन अनुकूलनों के लिए सीधे, मानक-आधारित उपकरण देती हैं जिनकी मूल परियोजना केवल सैद्धांतिक रूप से सिफ़ारिश कर सकती थी।

2005 से 2026 तक की समय-रेखा: मोटे CRT पिक्सेल, WCAG 2.0 का 4.5:1 अनुपात, वेब फ़ॉन्ट, हाई-DPI डिस्प्ले, वेरिएबल फ़ॉन्ट, WCAG 2.1 टेक्स्ट स्पेसिंग, WCAG 2.2, और APCA / WCAG 3 मसौदा।

क्या टिका रहा

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

जो बदला है वह है तर्क। 2005 में हमने सैंस-सेरिफ़ की सिफ़ारिश मुख्यतः इसलिए की थी कि सेरिफ़ ख़राब रेंडर होते थे; आज सेरिफ़/सैंस का प्रश्न एक्स-हाइट और अक्षर-भेद की तुलना में कहीं कम मायने रखता है। हमने 14 पॉइंट की सिफ़ारिश इसलिए की थी कि मोटे पिक्सेल वाली स्क्रीनों पर उससे छोटा टेक्स्ट बिखर जाता था; आज 16px की न्यूनतम सीमा का तर्क पिक्सेल ग्रिड पर नहीं, बल्कि उपयोगकर्ता की डिफ़ॉल्ट सेटिंग, ज़ूम व्यवहार और WCAG अनुपालन पर टिका है। जहाँ कोई सिफ़ारिश बची रहती है, वहाँ यह संस्करण उसे उसका आधुनिक औचित्य देने की कोशिश करता है — क्योंकि जिस दिशानिर्देश का तर्काधार समाप्त हो चुका हो, वह प्रायः ग़लत ढंग से लागू किया जाता है।

यह संस्करण कैसे संगठित है

संरचना मूल संस्करण की तरह सबसे छोटी इकाई से सबसे बड़ी की ओर बढ़ती है, एक जोड़ के साथ।

भाग 1, अक्षर (The Letter), व्यक्तिगत अक्षर-रूपों की सुपाठ्यता को कवर करता है: शैली, आकार, वज़न, तिरछापन, चौड़ाई और स्पेसिंग — उच्च-घनत्व रेंडरिंग और वेरिएबल फ़ॉन्ट तकनीक के लिए अद्यतन।

भाग 2, शब्द (The Word), सतत पाठ में शब्दों की पहचान की ओर बढ़ता है: केस, स्पेसिंग, पंक्ति-लंबाई और पठन की यांत्रिकी, जहाँ नेत्र-गति शोध ने हमारी कई धारणाओं को परिष्कृत किया है।

भाग 3, पृष्ठ (The Page), इस संस्करण में नया है। 2005 में पृष्ठ-स्तरीय नियंत्रण इतना स्थूल था कि उसे मानकीकृत नहीं किया जा सकता था। आज रिस्पॉन्सिव लेआउट, फ़्लुइड टाइप स्केल, उपयोगकर्ता-वरीयता मीडिया क्वेरीज़, डार्क मोड और रीफ़्लो आवश्यकताएँ पृष्ठ को एक प्रथम श्रेणी की सुगम्यता-सतह बना देती हैं, और वह अपने अलग अध्याय का हक़दार है।

CSS में

/* The reading defaults every page can start from */
html { font-size: 100%; }   /* honor the reader's browser setting */
body {
  font-size: 1rem;          /* never below the 16px default */
  line-height: 1.5;
}
article { max-width: 65ch; }

सिफ़ारिशें

  • 2005 के दिशानिर्देशों को ऐतिहासिक रूप से सुदृढ़ किंतु रेंडरिंग-विशिष्ट मानें; लागू करने से पहले हर एक को वर्तमान डिस्प्ले पर परखें।
  • परीक्षण-योग्य न्यूनतम आधार के रूप में WCAG 2.2 सफलता मानदंडों के अनुसार निर्माण करें, और यह देखने के लिए WCAG 3.0 मसौदे तथा APCA शोध पर नज़र रखें कि कंट्रास्ट मार्गदर्शन किस दिशा में जा रहा है।
  • अनुकूलनों को स्क्रिप्ट में नए सिरे से गढ़ने के बजाय प्लेटफ़ॉर्म की सुगम्यता-प्रणाली — rem इकाइयाँ, उपयोगकर्ता-वरीयता मीडिया क्वेरीज़, रीफ़्लो-अनुकूल लेआउट — का उपयोग करें।
  • अपने पाठक-वर्ग को याद रखें: जो चीज़ अधिकांश पाठकों के लिए अब वैकल्पिक परिष्कार है, वह अल्प दृष्टि वाले पाठकों के लिए आज भी अनिवार्य बुनियादी ढाँचा है।

आगे पढ़ें