इस पृष्ठ का अनुवाद AI की सहायता से किया गया है। अंग्रेज़ी मूल ही प्रामाणिक है।
लाइन की लंबाई — पारंपरिक शब्दों में माप (measure) — अक्षरों में गिनी गई पाठ-स्तंभ की चौड़ाई है। 2005 संस्करण ने प्रति पंक्ति 55–65 अक्षरों, यानी लगभग दस से बारह शब्दों, की अनुशंसा की थी, और चेताया था कि स्क्रीन पर पढ़ना प्रिंट से अधिक थकाऊ है, इसलिए छोटी पंक्तियाँ और छोटे अनुच्छेद अधिक सुरक्षित हैं। मूल अनुसंधान की सभी बातों में यह अनुशंसा सबसे बेहतर टिकी है। आरामदायक माप पर टाइपोग्राफ़िक सहमति प्रिंट-व्यवहार की एक सदी से अधिक समय से स्थिर रही है और स्क्रीनों के लिए बार-बार पुनःपुष्ट हुई है। जो बदला है वह संख्या नहीं, बल्कि उसके इर्द-गिर्द की मशीनरी है: वेब के पास अब ऐसी इकाइयाँ हैं जो माप को सीधे व्यक्त करती हैं, मानक हैं जो उसे सीमांकित करते हैं, और ऐसे व्यूपोर्ट हैं जिनकी मूल संस्करण कल्पना भी नहीं कर सकता था।
2005 के बाद क्या बदला
2005 में लाइन की लंबाई सीमित करने का मतलब था औसत अक्षर से अंदाज़े लगाकर तय की गई स्थिर पिक्सेल चौड़ाइयाँ। आधुनिक CSS माप को पाठ की अपनी भाषा में व्यक्त करता है: ch इकाई वर्तमान फ़ॉन्ट में शून्य (0) ग्लिफ़ की अग्रगति-चौड़ाई के बराबर होती है, जो उसे औसत अक्षर-चौड़ाई का काम-चलाऊ प्रतिनिधि बनाती है। एक अकेली घोषणा — max-width: 65ch — इस अध्याय की मूल अनुशंसा को कोड में उतार देती है, और फ़ॉन्ट, आकार या उपयोगकर्ता-वरीयता बदलने पर स्वतः अनुकूलित होती है। यह सुगम्यता से जुड़ी CSS की वह एक पंक्ति है जो कोई डिज़ाइनर लिख सकता है — सबसे उपयोगी। ध्यान रहे कि ch एक सन्निकटन है: आनुपातिक पाठ में 65ch का स्तंभ सामान्यतः 65 से कुछ अधिक वास्तविक अक्षर देता है, क्योंकि शून्य औसत से चौड़ा होता है। इसे लक्ष्य मानें, गारंटी नहीं, और असली अनुच्छेदों की जाँच करें।
मानक अब इस सीमा को दोनों ओर से बाँधते हैं। WCAG का सफलता मानदंड 1.4.8 Visual Presentation (स्तर AAA) निर्दिष्ट करता है कि ऐसा तंत्र उपलब्ध होना चाहिए जिससे पाठ-खंड 80 अक्षरों (CJK लिपियों के लिए 40) से अधिक चौड़े न हों। अस्सी छत है, लक्ष्य नहीं — यह मानदंड परिभाषित करता है कि पठनीयता की हानि कहाँ सुगम्यता की चिंता बन जाती है, जबकि 55–65 का क्षेत्र वही है जहाँ आराम चरम पर होता है। लगभग 65–70ch पर अधिकतम होने वाला स्तंभ दिशानिर्देश और पुरानी शिल्प-सहमति — दोनों को संतुष्ट करता है।
दूसरी नई बाधा विपरीत दिशा में चलती है। सफलता मानदंड 1.4.10 Reflow (स्तर AA, WCAG 2.1 और 2.2) अपेक्षा करता है कि सामग्री 320 CSS-पिक्सेल चौड़े व्यूपोर्ट — यानी 400% ज़ूम किए गए डेस्कटॉप पेज — पर द्वि-आयामी स्क्रॉलिंग के बिना रीफ़्लो हो। 2005 में जोखिम था बहुत लंबी पंक्तियाँ; 2026 में बराबर का जोखिम वे लेआउट हैं जो छोटा होने से इनकार करते हैं। स्थिर-चौड़ाई स्तंभ, अगल-बगल के लेआउट जो कभी नहीं सजते, और कठोर न्यूनतम चौड़ाई वाले तत्व — सब 320px पर क्षैतिज स्क्रॉलिंग थोपते हैं, जो अनुरूपता-विफलता भी है और वास्तविक बाधा भी: हर पंक्ति पर बग़ल में स्क्रॉल करके पढ़ना निम्न-दृष्टि उपयोगकर्ताओं द्वारा बताए गए सबसे यातनापूर्ण अनुभवों में से है। 320px पर 16px बॉडी टेक्स्ट के साथ पंक्तियाँ लगभग 30–40 अक्षरों की रहती हैं। यह आराम-क्षेत्र से नीचे है, और यह ठीक है — छोटी पंक्तियाँ पढ़ने को थोड़ा धीमा करती हैं पर तोड़ती नहीं, जबकि क्षैतिज स्क्रॉलिंग उसे पूरी तरह तोड़ देती है। माप को हमेशा अधिकतम के रूप में डिज़ाइन करें, न्यूनतम के रूप में कभी नहीं।
यह सीमा काम क्यों करती है
55–65 की अनुशंसा की स्थिरता पढ़ने की यांत्रिकी को दर्शाती है। लंबी पंक्तियाँ वापसी-छलाँग (return sweep) — अगली पंक्ति की शुरुआत तक आँख की उछाल — को लंबा करती हैं और डबलिंग की त्रुटियाँ बढ़ाती हैं, जहाँ पाठक गलत पंक्ति पर उतर जाता है; क्षतिपूर्ति के लिए वे अतिरिक्त लीडिंग माँगती हैं। बहुत छोटी पंक्तियाँ हर दृष्टि-स्थिरीकरण के पूर्वावलोकन में बहुत कम शब्द लाती हैं, लगातार पंक्ति-परिवर्तन थोपती हैं, और वाक्यांशों को उनकी व्याकरणिक संरचना के विरुद्ध काटती हैं। सुपाठ्यता-अनुसंधान इस चित्र को एक रोचक ढंग से जटिल बनाता है: कुछ स्क्रीन अध्ययनों में पाया गया कि लंबी पंक्तियाँ तेज़ पठन-गति दे सकती हैं, संभवतः महँगी वापसी-छलाँगों की संख्या घटाकर — फिर भी पाठक लगातार मध्यम पंक्तियों को प्राथमिकता देते हैं और उन्हें अधिक आरामदायक आँकते हैं, और आराम ही तय करता है कि लोग पढ़ते रहेंगे या नहीं। दीर्घकालिक पठन के लिए वरीयता और घटी हुई थकान मध्यम माप के पक्ष में तर्क देती हैं, और यही इस अध्याय की निरंतर अनुशंसा है।
पिछले अध्याय में वर्णित लीडिंग के साथ परस्पर-निर्भरता एक नियम के रूप में दोहराने योग्य है: यदि माप लंबा रखना ही पड़े, तो लाइन हाइट बढ़ाएँ। 1.6 की line-height पर 75-अक्षर की पंक्ति पठनीय रहती है; वही पंक्ति 1.3 पर डबलिंग को न्योता देती है।
व्यवहार में उत्तरदायी माप
आधुनिक पैटर्न तीन सामग्रियाँ जोड़ता है। लगभग 60–70ch की max-width वाला सामग्री-स्तंभ बड़ी स्क्रीनों पर आदर्श माप स्थापित करता है। तरल क्षैतिज पैडिंग स्तंभ को संकरे व्यूपोर्ट तक साँस लेने देती है, क्षैतिज स्क्रॉल कभी उत्पन्न किए बिना। और यदि फ़्लूइड टाइप चल रहा है — clamp() के ज़रिये व्यूपोर्ट के साथ स्केल होते फ़ॉन्ट आकार — तो याद रखें कि माप अक्षरों में गिना जाता है, पिक्सेल में नहीं: चूँकि ch फ़ॉन्ट आकार के साथ चलता है, ch-आधारित max-width टाइप के साथ बढ़ती है और अक्षर-गणना लगभग स्थिर रखती है — ठीक वही व्यवहार जो आप चाहते हैं।
मूल पाठ से एक उलटफेर: 2005 संस्करण बॉडी टेक्स्ट में हाइफ़नेशन से बचने की सलाह देता था। उदार मापों पर रैग्ड-राइट सेटिंग के साथ हाइफ़नेशन वाक़ई अनावश्यक है। लेकिन जिन संकरे मापों की रीफ़्लो माँग करता है, उन पर बिना हाइफ़न वाले पाठ के लंबे शब्द बदसूरत खाइयाँ बनाते हैं या सिरे से बाहर बह जाते हैं। hyphens: auto सक्षम करना (सही lang एट्रिब्यूट के साथ, क्योंकि हाइफ़नेशन शब्दकोश-चालित है) अब उस बॉडी टेक्स्ट के लिए अच्छा व्यवहार है जिसे संकरे स्तंभों में जीवित रहना है। जहाँ समर्थित हो, बेहतर विच्छेद-निर्णयों के लिए इसके साथ text-wrap: pretty जोड़ें।
अंत में, अनुच्छेद-लंबाई पर मूल की सलाह अब भी क़ायम है और उसे दाँत भी मिल गए हैं: छोटे अनुच्छेद उस दिशा-बोध में मदद करते हैं जिस पर स्क्रीन रीडर, सरसरी पाठक, और ध्यान या स्मृति की कठिनाइयों वाले पाठक — सभी निर्भर करते हैं। WCAG 1.4.12 इसके अतिरिक्त अपेक्षा करता है कि सामग्री उपयोगकर्ता द्वारा बढ़ाई गई अनुच्छेद-दूरी को सहन करे, इसलिए ऐसे लेआउट से बचें जो मानते हों कि अनुच्छेद ठीक किसी निश्चित ऊँचाई में समाएँगे।
CSS में
article {
max-width: 65ch; /* 45–75 characters; ~65 is the sweet spot */
margin-inline: auto;
padding-inline: 1rem; /* fluid gutter at every width */
}
/* Test at a 320px viewport: no horizontal scrolling (WCAG 1.4.10) */अनुशंसाएँ
- बॉडी टेक्स्ट के लिए प्रति पंक्ति 55–65 अक्षरों का लक्ष्य रखें; WCAG 1.4.8 के अनुसार 80 को बाहरी सीमा मानें।
- माप को सामग्री-स्तंभ पर ch इकाइयों में max-width से लागू करें (लगभग 60–70ch)।
- सुनिश्चित करें कि सामग्री 320px व्यूपोर्ट पर बिना क्षैतिज स्क्रॉलिंग के रीफ़्लो हो (WCAG 1.4.10); न्यूनतम माप कभी सेट न करें।
- माप लंबा चलने पर लाइन हाइट बढ़ाएँ; दोनों सेटिंग्स एक ही निर्णय हैं।
- सही lang एट्रिब्यूट के साथ hyphens: auto सक्षम करें ताकि संकरे स्तंभ साफ़ टूटें, और जहाँ समर्थित हो वहाँ text-wrap: pretty जोड़ें।
- फ़्लूइड टाइप के साथ माप को अक्षर-सापेक्ष इकाइयों में रखें ताकि फ़ॉन्ट आकार स्केल होने पर लाइन की लंबाई स्थिर रहे।
- अनुच्छेद छोटे रखें; सत्यापित करें कि लेआउट WCAG 1.4.12 के अंतर्गत बढ़ी हुई अनुच्छेद-दूरी सहन करते हैं।