टाइपाेग्राफ़ी

आसानी से पढ़े जा सकने वाले कॉन्टेंट को बनाने और डिज़ाइन करने के लिए, सिर्फ़ आसानी से पढ़े जा सकने वाला फ़ॉन्ट चुनना ही काफ़ी नहीं है. सुलभ फ़ॉन्ट फ़ैमिली का इस्तेमाल करने पर भी, कम दृष्टि, kognitive, भाषा, और सीखने से जुड़ी दिव्यांगता वाले लोगों को टेक्स्ट को प्रोसेस करने में मुश्किल हो सकती है. ऐसा, फ़ॉन्ट के वैरिएशन, साइज़, स्पेसिंग, और कर्निंग जैसे अन्य एलिमेंट की वजह से होता है.

इस मॉड्यूल में, डिज़ाइन से जुड़ी बुनियादी बातों पर ध्यान दिया जाता है, ताकि आपका कॉन्टेंट ज़्यादा लोगों के लिए हो और ज़्यादा से ज़्यादा लोगों तक पहुंच सके.

टाइपफ़ेस

टाइपफ़ेस, कॉपी को ऐक्सेस करने की सुविधा पर काफ़ी असर डाल सकता है. टाइपफ़ेस और स्टाइल की आपकी पसंद से, किसी भी पेज के डिज़ाइन को बेहतर या खराब किया जा सकता है.

डिसलेक्सिया और अटेंशन-डेफ़िसिट हाइपरएक्टिविटी डिसऑर्डर (एडीएचडी) जैसी पढ़ने, सीखने, और ध्यान से जुड़ी समस्याओं वाले लोगों के साथ-साथ, कम दिखने वाले लोगों को भी ऐक्सेस किए जा सकने वाले टाइपफ़ेस का इस्तेमाल करने से फ़ायदा मिल सकता है.

आम तौर पर इस्तेमाल होने वाले टाइपफ़ेस चुनें ऐक्सेस किए जा सकने वाले डिज़ाइन बनाने का सबसे तेज़ तरीका, आम तौर पर इस्तेमाल होने वाला टाइपफ़ेस चुनना है. जैसे, Arial, Times New Roman, Calibri, Verdana वगैरह.

टाइपफ़ेस से जुड़ी कई स्टडी में, दिव्यांग लोगों की जांच की गई है. इनसे पता चला है कि सामान्य टाइपफ़ेस की तुलना में, असामान्य टाइपफ़ेस से पढ़ने की रफ़्तार तेज़ होती है और कॉन्टेंट को समझने में ज़्यादा समय लगता है. आम टाइपफ़ेस, दूसरे टाइपफ़ेस के मुकाबले ज़्यादा ऐक्सेस नहीं किए जा सकते. हालांकि, दिव्यांग कुछ लोगों को इन्हें पढ़ने में आसानी होती है, क्योंकि उन्हें इन टाइपफ़ेस के साथ काम करने का काफ़ी अनुभव होता है.

सामान्य टाइपफ़ेस चुनने के साथ-साथ, अलंकृत या लिखावट वाले टाइपफ़ेस का इस्तेमाल न करें. साथ ही, ऐसे टाइपफ़ेस का इस्तेमाल न करें जिनमें सिर्फ़ एक तरह के वर्णों का इस्तेमाल किया गया हो. उदाहरण के लिए, सिर्फ़ बड़े अक्षर. इटैलिक डिज़ाइन, अजीब आकार या पतली लाइनों जैसी कलात्मक सुविधाओं वाले ये खास टाइपफ़ेस अच्छे लग सकते हैं. हालांकि, सामान्य टाइपफ़ेस की तुलना में, इनका इस्तेमाल करने वाले कुछ लोगों को इन्हें पढ़ने में ज़्यादा मुश्किल होती है.

अक्षरों की विशेषताएं और कर्निंग

इस बात पर कोई रिसर्च नहीं की गई है कि serif या sans serif टाइपफ़ेस में से किसको पढ़ना आसान है. हालांकि, कुछ संख्याएं, अक्षर या कॉम्बिनेशन, भाषा से जुड़ी सीखने और समझने की समस्याओं वाले लोगों को भ्रमित कर सकते हैं. इस तरह की दिव्यांगता वाले लोगों के लिए, हर अक्षर और संख्या को साफ़ तौर पर दिखाया जाना चाहिए. साथ ही, उनमें अलग-अलग विशेषताएं होनी चाहिए, ताकि अक्षरों को संख्याओं से न भ्रमित किया जा सके.

आम तौर पर, अंग्रेज़ी के बड़े अक्षर "I" (भारत), छोटे अक्षर "l" (सलाद), और संख्या "1" को पढ़ने में मुश्किल होती है. इसी तरह, कुछ पाठकों के लिए b/d, p/q, f/t, i/j, m/w, और n/u जैसे अक्षर जोड़े कभी-कभी बाईं से दाईं या ऊपर से नीचे की ओर फ़्लिप हो सकते हैं.

अक्षरों के बीच का स्पेस या वर्णों के बीच का अंतर बहुत कम होने पर भी, कॉपी को पढ़ने में मुश्किल होती है. वर्णों के बीच के अंतर पर खास ध्यान दें. खास तौर पर, समस्या वाले अक्षर जोड़े r/n के बीच के अंतर पर. ऐसा न करने पर, "धागा" जैसे शब्द "आलू" में बदल सकते हैं या "स्टर्न" "स्टेम" में बदल सकते हैं. इससे कॉपी का मतलब पूरी तरह से बदल जाता है.

Google Fonts जैसे ओपन सोर्स टाइपफ़ेस कलेक्शन की मदद से, अपने अगले डिज़ाइन के लिए सबसे बेहतर टाइपफ़ेस चुना जा सकता है. Adobe के प्रॉडक्ट का इस्तेमाल करने पर, फ़ाउंड्री पार्टनर के ऐक्सेस किए जा सकने वाले फ़ॉन्ट फ़ैमिली को सीधे अपने डिज़ाइन में जोड़ा जा सकता है. इनमें कुछ Google Fonts भी शामिल हैं.

अपना अगला टाइपफ़ेस चुनते समय, इन बातों पर खास ध्यान दें:

  • जब भी हो सके, आम तौर पर इस्तेमाल होने वाले फ़ॉन्ट का इस्तेमाल करें.
  • जटिल या हाथ से लिखे गए फ़ॉन्ट का इस्तेमाल करने से बचें. साथ ही, ऐसे फ़ॉन्ट का इस्तेमाल न करें जिनमें सिर्फ़ एक कैरेक्टर केस हो.
  • कोई ऐसा टाइपफ़ेस चुनें जिसमें खास विशेषताएं हों. साथ ही, अंग्रेज़ी के बड़े अक्षर I, छोटे अक्षर l, और 1 पर खास ध्यान दें.
  • कुछ अक्षरों के कॉम्बिनेशन की समीक्षा करके पक्का करें कि वे एक-दूसरे के बिलकुल उलट न हों.
  • वर्णों के बीच के अंतर की जांच करें. खास तौर पर, r और n अक्षरों के बीच के अंतर की जांच करें.

फ़ॉन्ट का साइज़ और टाइपोग्राफ़ी स्टाइल

अक्सर लोग यह मान लेते हैं कि सुलभ फ़ॉन्ट फ़ैमिली चुनने पर, सभी के लिए कॉन्टेंट बनाया जा सकता है. हालांकि, फ़ॉन्ट साइज़ और पेज पर टेक्स्ट के स्टाइल को भी ध्यान में रखना ज़रूरी है.

उदाहरण के लिए, कम दृष्टि या रंगों को पहचानने में समस्या वाले लोग, कॉपी को पढ़ने के लिए ब्राउज़र ज़ूम जैसे एटी का इस्तेमाल कर सकते हैं. हालांकि, अगर कॉपी बहुत छोटी है, तो हो सकता है कि वे कुछ कॉपी न पढ़ पाएं. अन्य उपयोगकर्ताओं को इटैलिक टेक्स्ट पढ़ने में परेशानी हो सकती है. जैसे, डिस्लेक्सिया या पढ़ने में समस्या वाले लोग. स्क्रीन रीडर अक्सर बोल्ड और इटैलिक जैसे स्टाइल के तरीकों को अनदेखा करते हैं. इसलिए, इन स्टाइल का मकसद, अंधे या कम दृष्टि वाले उपयोगकर्ताओं को नहीं बताया जाता.

यह न करें
h2 {font-size: 16px;}
यह करें
h2 {font-size: 1rem;}

हर उपयोगकर्ता की ज़रूरतों का अनुमान नहीं लगाया जा सकता. इसलिए, अपनी वेबसाइटों और वेब ऐप्लिकेशन में फ़ॉन्ट जोड़ते समय, इन दिशा-निर्देशों का ध्यान रखें:

  • फ़ॉन्ट के बेस साइज़ को रिलेटिव वैल्यू (%, rem या em) के साथ तय किया जाना चाहिए, ताकि साइज़ बदला जा सके.
  • टेक्स्ट को आसानी से पढ़ा जा सके, इसके लिए फ़ॉन्ट के वैरिएशन की संख्या कम करें. जैसे, रंग, बोल्ड, अंग्रेज़ी के बड़े अक्षर, और इटैलिक. इसके बजाय, अपनी कॉपी में शब्दों पर ज़ोर देने के लिए, तारे, डैश या किसी एक शब्द को हाइलाइट करने जैसे तरीकों का इस्तेमाल करें.
  • जहां भी हो सके, इमेज पर टेक्स्ट के बजाय मार्कअप का इस्तेमाल करें. स्क्रीन रीडर, इमेज में जोड़े गए टेक्स्ट को नहीं पढ़ सकते. इसके लिए, अतिरिक्त कोड जोड़ना ज़रूरी है. साथ ही, कम दृष्टि वाले लोग इमेज को बड़ा करके देखने पर, जोड़ा गया टेक्स्ट पिक्सलेट वाला हो सकता है.

स्ट्रक्चर और लेआउट

ऐक्सेस किए जा सकने वाले टाइपोग्राफ़ी के लिए, टाइपफ़ेस, फ़ॉन्ट साइज़, और टाइपोग्राफ़ी स्टाइल अहम हैं. हालांकि, किसी पेज पर कॉपी का स्ट्रक्चर और लेआउट भी उपयोगकर्ता के लिए उतना ही अहम हो सकता है.

जटिल लेआउट, कमज़ोर नज़र और पढ़ने में परेशानी वाले लोगों के लिए एक बड़ी समस्या हो सकते हैं. साथ ही, अमेरिका में एडीएचडी से पीड़ित 6.1 करोड़ लोगों के लिए भी ये समस्याएं पैदा कर सकते हैं. इस तरह की समस्याओं की वजह से, लोगों को कॉन्टेंट पर बने रहने और कॉपी के फ़्लो को समझने में ज़्यादा मुश्किल होती है. ऐसा इसलिए होता है, क्योंकि कॉन्टेंट में साफ़ तौर पर लीनियर पाथवे नहीं होते, हेडिंग मौजूद नहीं होतीं, और एलिमेंट को ग्रुप में नहीं बांटा जाता.

सुलभ लेआउट डिज़ाइन का एक अहम पहलू यह है कि अहम एलिमेंट को एक-दूसरे से अलग किया जाए और मिलते-जुलते एलिमेंट को एक साथ ग्रुप किया जाए. अगर एलिमेंट एक-दूसरे के बहुत करीब हैं, तो यह पता लगाना मुश्किल हो सकता है कि एक एलिमेंट कहां से शुरू होता है और कहां खत्म होता है. खास तौर पर, अगर उनकी स्टाइल एक जैसी है.

अपनी कॉपी को आउटलाइन पर मौजूद अलग-अलग बुलेट पॉइंट के कलेक्शन के तौर पर देखें. इससे आपको पेज के पूरे स्ट्रक्चर को प्लान करने में मदद मिलेगी. साथ ही, ज़रूरत पड़ने पर हेडिंग, सब-हेडिंग, और सूचियों का इस्तेमाल करने में भी मदद मिलेगी.

स्पेसिंग

पैराग्राफ़, वाक्य, और शब्द के बीच की जगह से, पाठकों को कॉपी पर फ़ोकस बनाए रखने में मदद मिलती है. साथ ही, इससे पेज को बेहतर तरीके से समझने में भी मदद मिलती है. कॉपी की लंबी लाइनें, दिव्यांग पाठकों के लिए एक समस्या हो सकती हैं. ऐसा इसलिए, क्योंकि उन्हें कॉपी में अपनी जगह बनाए रखने और कॉपी के फ़्लो को समझने में परेशानी होती है.

कॉपी का छोटा ब्लॉक होने पर, पाठकों के लिए अगली लाइन पर जाना आसान हो जाता है.

कॉन्टेंट अलाइनमेंट

दिव्यांग लोगों को जस्टिफ़ाइड कॉपी पढ़ने में भी परेशानी होती है. दोनों ओर अलाइन की गई कॉपी में शब्दों के बीच अलग-अलग स्पेस होने की वजह से, पेज पर "स्पेस की नदियां" बन सकती हैं. इससे कॉपी को पढ़ना मुश्किल हो जाता है.

टेक्स्ट को अलाइन करने की वजह से, शब्दों को एक साथ इकट्ठा किया जा सकता है या उन्हें अजीब तरीके से खिंचा जा सकता है. इससे, पाठकों को शब्दों की सीमाओं का पता लगाने में मुश्किल हो सकती है.

शुक्र है कि स्पेसिंग और टूल के बारे में साफ़ तौर पर दिशा-निर्देश मौजूद हैं. जैसे, अच्छी लाइन-हाइट और गोल्डन रेशियो कैलकुलेटर. इनकी मदद से, अपनी कॉपी को ज़्यादा सुलभ बनाया जा सकता है. इन दिशा-निर्देशों को शामिल करने से, ध्यान देने की समस्या, पढ़ने, और आंखों से जुड़ी दिव्यांगता से जूझ रहे लोगों को कॉपी पर ज़्यादा और लेआउट पर कम फ़ोकस करने में मदद मिलती है.

स्ट्रक्चर और लेआउट के लिए सबसे सही तरीके

स्ट्रक्चर और लेआउट चुनते समय, इन बातों का ध्यान रखें:

  • पेज को सेक्शन में बांटने के लिए, हेडर, सब-हेडिंग, सूचियों, नंबर, कोट ब्लॉक, और अन्य विज़ुअल ग्रुपिंग जैसे एलिमेंट का इस्तेमाल करें.
  • साफ़ तौर पर समझ आने वाले पैराग्राफ़, वाक्य, और शब्दों के बीच स्पेस का इस्तेमाल करें.
  • कॉपी के ऐसे कॉलम बनाएं जिनकी चौड़ाई 80 वर्णों से कम हो (लोगोग्राम के लिए 40 वर्णों से कम).
  • पैराग्राफ़ को अलाइन करने से बचें. इससे कॉपी में "स्पेस की नदियां" बन जाती हैं.

सुलभ टाइपोग्राफ़ी से जुड़ी अहम बातें

उपयोगकर्ताओं की ज़रूरतों के बारे में जानकारी के आधार पर, डिज़ाइन के सामान्य विकल्पों को ऐक्सेस किए जा सकने वाले टाइपोग्राफ़ी में बदला जा सकता है. कॉन्टेंट डिज़ाइन और तैयार करते समय, इस मॉड्यूल को ध्यान में रखें. इससे आपको ज़्यादा से ज़्यादा लोगों तक अपनी बात साफ़ तौर पर पहुंचाने में मदद मिलेगी.

देखें कि आपको क्या समझ आया

सुलभता को मेज़र करने के बारे में अपनी जानकारी की जांच करना

आसानी से पढ़ी जा सकने वाली कॉपी के लिए, मुझे कॉपी और बैकग्राउंड के बीच हमेशा ज़्यादा कंट्रास्ट का इस्तेमाल करना चाहिए.

सही.
ज़्यादा कंट्रास्ट वाले कॉन्टेंट का इस्तेमाल, आंखों से जुड़ी कुछ समस्याओं वाले लोगों के लिए फ़ायदेमंद हो सकता है. हालांकि, कुछ लोगों को ऐसी समस्याएं हो सकती हैं जिनकी वजह से ज़्यादा कंट्रास्ट वाले कॉन्टेंट को पढ़ना मुश्किल हो जाता है.
गलत.
अगर कॉन्टेंट का कंट्रास्ट बहुत ज़्यादा है, तो विकलांग कुछ लोग उसे पढ़ नहीं पाएंगे. अगर हो सके, तो उपयोगकर्ता के ऑपरेटिंग सिस्टम की सेटिंग को कंट्रास्ट तय करने की अनुमति दें.

सुलभता के लिए कौनसे फ़ॉन्ट सबसे अच्छे हैं?

Arial और Verdana जैसे सिस्टम फ़ॉन्ट.
आम टाइपफ़ेस की तुलना में, असामान्य टाइपफ़ेस से पढ़ने की रफ़्तार तेज़ होती है और कॉन्टेंट को समझने के लेवल में भी बढ़ोतरी होती है.
सुलभ टाइपफ़ेस.
Adobe Fonts पर Google फ़ाउंड्री जैसे सुलभ टाइपफ़ेस कलेक्शन का इस्तेमाल करके, अपने अगले डिज़ाइन के लिए सबसे बेहतर टाइपफ़ेस चुना जा सकता है.
कोई बात नहीं.
फ़ॉन्ट चुनने से, टेक्स्ट को पढ़ने में आसानी या मुश्किल हो सकती है. ज़्यादा सजावटी स्क्रिप्ट और आर्ट फ़ॉन्ट इस्तेमाल करने से बचें.