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

2.0 शब्द

स्क्रीन-पठन के लिए शब्द-स्तरीय पठनीयता — केस, स्पेसिंग, पंक्ति-लंबाई, पदानुक्रम और सरल लेखन — इस आधुनिक समझ पर आधारित कि आँखें और मन वास्तव में कैसे पढ़ते हैं।

7 min read

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

खंड 1.0 सुपाठ्यता (legibility) से संबंधित था — यानी क्या व्यक्तिगत अक्षर-रूप सुलझाए जा सकते हैं। यह खंड एक स्तर ऊपर, पठनीयता (readability) की ओर बढ़ता है: क्या शब्द, पंक्तियाँ और अनुच्छेद सहजता, गति और बोध के साथ पढ़े जा सकते हैं। यह भेद इसलिए मायने रखता है कि कोई पृष्ठ अक्षर-रूप की हर परीक्षा पास करके भी तंग स्पेसिंग, मैराथन-लंबी पंक्तियों, सपाट पदानुक्रम या अपनी बात छिपाने वाले गद्य से पाठक को थका सकता है। सुपाठ्यता टाइप की विशेषता है; पठनीयता समूचे पठन-अनुभव की विशेषता है, और वास्तविक दुनिया की अधिकांश विफलताएँ यहीं घटित होती हैं।

2005 के संस्करण ने इस क्षेत्र को अच्छी तरह संगठित किया था — केस, स्पेसिंग, पंक्ति-लंबाई, पदानुक्रम, लेखन-गुणवत्ता — और उसकी व्यावहारिक सलाह को उसके सिद्धांत की तुलना में कम संशोधन चाहिए। सबसे अधिक जो बदला है वह है पठन-प्रक्रिया की हमारी तस्वीर, और वह तस्वीर प्रस्तुत करने लायक़ है क्योंकि वही समझाती है कि व्यावहारिक नियम क्यों काम करते हैं।

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

2005 में बहुत-सी टाइपोग्राफ़िक (typography) सलाह शब्द-आकृति मॉडल पर टिकी थी: यह विचार कि कुशल पाठक शब्दों को उनके समग्र छायाचित्र से पहचानते हैं — एसेंडर और डिसेंडर का वह पैटर्न जो "बूमा आकृति (Bouma shape)" बनाता है। वह मॉडल अब अप्रचलित हो चुका है। पठन-विज्ञान की सहमति, जिसे Kevin Larson की मनोवैज्ञानिक साहित्य की 2004 की समीक्षा ने प्रभावशाली ढंग से प्रतिपादित किया और बाद के दो दशकों के काम ने पुष्ट किया, है समानांतर अक्षर-पहचान (parallel letter recognition): पाठक शब्द के घटक अक्षरों को एक साथ पहचानते हैं, और शब्द-पहचान उसी अक्षर-स्तरीय साक्ष्य से निर्मित होती है। शब्द-आकृति का योगदान नगण्य है; अक्षर-पहचान का योगदान लगभग सब कुछ है। अध्याय 2.1 शब्द-केस के लिए इसके परिणामों को विस्तार से उठाता है।

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

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

एक वाक्य जिसमें फ़िक्सेशन-बिंदु — फ़ोविया — पर केवल सात से नौ अक्षर तीक्ष्ण हैं, जबकि पैराफ़ोविया अगली सैकेड के लिए स्थूल पूर्वावलोकन देता है।

स्पेसिंग, पंक्ति-लंबाई और अद्यतन आँकड़े

संस्करण 1 का मार्गदर्शन समायोजनों के साथ क़ायम है।

  • शब्द-स्पेसिंग। इसे समान रखें; वेब पर पूर्ण जस्टिफ़िकेशन से बचें, जहाँ हाइफ़नेशन और जस्टिफ़िकेशन इंजन अब भी अपरिष्कृत हैं। यदि जस्टिफ़िकेशन आवश्यक ही हो, तो हाइफ़नेशन सक्षम करें और संकरी चौड़ाइयों पर परिणाम जाँचें।
  • अक्षर-स्पेसिंग। छोटे आकारों और कैपिटल अक्षरों के लिए हल्की ट्रैकिंग (tracking) बढ़ाने का 2005 का सुझाव क़ायम है, लेकिन बॉडी आकारों पर आधुनिक टेक्स्ट फ़ेस अपने डिज़ाइनरों द्वारा सही स्पेस किए होते हैं — अधिक महत्वपूर्ण अपेक्षा है सहनशीलता: WCAG 2.2 का टेक्स्ट स्पेसिंग मानदंड (1.4.12) अपेक्षा करता है कि सामग्री उपयोगकर्ता द्वारा बढ़ाई गई अक्षर, शब्द, पंक्ति और अनुच्छेद स्पेसिंग को झेल सके। ऐसा डिज़ाइन करें कि ये ओवरराइड लेआउट न तोड़ें।
  • पंक्ति-अंतराल। बॉडी टेक्स्ट के लिए टाइप-आकार का लगभग 1.4 से 1.6 गुना; लंबी पंक्तियों को ऊपरी छोर चाहिए। WCAG का अपना संदर्भ-बिंदु अनुच्छेदों के भीतर कम से कम 1.5 का पंक्ति-अंतराल है।
  • पंक्ति-लंबाई (measure)। 2005 का 55–65 वर्ण-प्रति-पंक्ति लक्ष्य आज भी एक ठोस केंद्र है; लगभग 45 से 75 वर्ण तक कुछ भी आराम से पढ़ा जाता है। आधुनिक परिष्कार है अनुक्रियाशीलता: पंक्ति-लंबाई को ch-आधारित या सामग्री-आधारित इकाइयों में सेट करें ताकि वह हर व्यूपोर्ट पर टिकी रहे, और याद रखें कि 200% ज़ूम (WCAG 1.4.4) और रीफ़्लो स्थितियों (1.4.10) में आपकी पंक्ति-लंबाई को ढहने के बजाय शालीनता से सिमटना चाहिए।

पदानुक्रम और सूचना की आकृति

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

प्रिंट की इंडेंटेशन और स्पेसिंग परिपाटियाँ अब भी काम की हैं: अनुच्छेदों को या तो इंडेंट करें या उनके बीच स्थान दें, दोनों नहीं, और संकेत को सुसंगत रखें ताकि पाठक की आँख उसे एक ही बार में सीख ले।

लेखन भी टाइपोग्राफ़ी है

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

CSS में

p {
  max-width: 65ch;        /* measure, set in characters */
  text-align: left;       /* ragged right keeps word spacing even */
  text-wrap: pretty;      /* better rag, fewer orphans */
}

सिफ़ारिशें

  • पठनीयता को एक तंत्र मानें: टाइप-चयन, स्पेसिंग, पंक्ति-लंबाई, पदानुक्रम और गद्य-गुणवत्ता साथ ही विफल या सफल होते हैं।
  • बॉडी की पंक्ति-लंबाई 45–75 वर्णों के आसपास, आदर्शतः 55–65, रखें और उसे ज़ूम व रीफ़्लो के दौरान अनुक्रियाशील रूप से बनाए रखें।
  • पंक्ति-अंतराल टाइप-आकार का 1.4–1.6 गुना रखें; लंबी पंक्तियों के लिए अधिक।
  • रैग्ड-राइट संरेखण अपनाएँ; वेब पर पूर्ण जस्टिफ़िकेशन से बचें।
  • सुनिश्चित करें कि लेआउट WCAG 1.4.12 के अनुसार उपयोगकर्ता स्पेसिंग ओवरराइड झेल लें।
  • पदानुक्रम आकार, वज़न और रिक्त स्थान से, सिमैंटिक शीर्षक-संरचना पर बनाएँ; शीर्षकों और लिंक में मुख्य शब्द आगे रखें।
  • सरल लिखें: सामान्य शब्द, छोटे वाक्य, मुख्य बात पहले।
  • निर्णय के मौक़ों पर पठन-मॉडल को मार्गदर्शक बनने दें — जो कुछ भी सैकेड-लक्ष्यों को अधिक पूर्वानुमेय और अक्षरों को पहचानने में आसान बनाता है, वह पाठक के साथ काम कर रहा है, उसके विरुद्ध नहीं।

आगे पढ़ें