वेब डिज़ाइन तैयार करने में, मैं अक्सर यह सुनिश्चित करने की कोशिश करता हूं कि मेरी टाइपोग्राफी आनुपातिक और सुसंगत हो। हालाँकि, मैं कोई निश्चित लेख या संसाधन नहीं खोज पाया कि किस अनुपात और आकार का उपयोग किया जाए। विशेष रूप से, इसके लिए अनुशंसित या मानक अभ्यास क्या हैं:
कृपया अपने उत्तरों में पैराग्राफ और हेडर टेक्स्ट दोनों पर विचार करें। इसके अलावा, विभिन्न अनुपात या मैट्रिक्स की प्रभावशीलता पर कोई भी अध्ययन बहुत उपयोगी होगा।
जवाबों:
रोबर्ट ब्रिफहर्स्ट के एलिमेंट्स ऑफ़ टाइपोग्राफिक स्टाइल इस तरह की चीजों के लिए एक संपूर्ण और अद्भुत संदर्भ है। यह लंबा है लेकिन बहुत मूल्यवान है।
बहुत सारे डिज़ाइनर लाइनों के एक मानक ग्रिड की सलाह देते हैं ताकि एक लाइन + गद्दी हमेशा 16 पिक्सेल के भीतर फिट हो। तो इससे कम कुछ भी लाइन की ऊँचाई 16 होगी, ऊपर की सब कुछ लाइन की ऊँचाई 32 होगी।
पाठ पढ़ने के लिए एक पंक्ति की आदर्श लंबाई 45 अक्षरों से कुछ और 55-75 अन्य स्रोतों द्वारा आयोजित की जाती है।
यहाँ वेबसाइटों के कुछ सामान्य औसत हैं: टाइपोग्राफिक डिज़ाइन पैटर्न और सर्वश्रेष्ठ अभ्यास
मैं कहूंगा कि 16px पर पैराग्राफ के साथ शुरू करें और बाकी की गणना करने के लिए फाइबोनैचि अनुक्रम का उपयोग करें। ऐसा लगता है कि प्रमुख ब्राउज़र इस तर्क का उपयोग कर रहे हैं। रॉबर्ट फाइवहर्स्ट, हार्टले और मार्क्स के "द एलिमेंट्स ऑफ़ टाइपोग्राफिक स्टाइल: वर्जन 4.0" का उपयोग करते हुए भविष्य के अनुसंधान के साथ, 10 वीं फ़ॉन्ट के लिए अग्रणी को 12pt पर सेट किया गया था।
12pt को पिक्सल्स में बदलने से हमें 16px का बेस फॉन्ट मिलता है।
अधिकांश ब्राउज़र्स की डिफ़ॉल्ट शैलियाँ अपने पैराग्राफ के पाठ के लिए 16 पिक्सेल का उपयोग करती हैं, जैसा कि आप स्वयं DOM पर निरीक्षण कर सकते हैं या https://www.w3.org/TR/CSS21/sample.html और http: // सूचियों को पढ़कर कर सकते हैं । w3.org/Archives/Public/www-style/2008Jul/att-0124/defaultstyles.html
आज हमारे पास जो समस्या है वह ठीक है कि हम एक नए प्रकार की टाइपोग्राफी के बारे में बात कर रहे हैं। वर्तमान वेब टाइपोग्राफी जिसे विभिन्न उपकरणों में फिट करने की आवश्यकता है, वह पिछली अवधारणाओं से पूरी तरह से अलग है जैसे कि रोबर्ट ब्रिफहर्स्ट के एलिमेंट्स ऑफ़ टाइपोग्राफिक स्टाइल पर दर्शाया गया है। इसके बावजूद यह एक उत्कृष्ट पुस्तक है कि वास्तविकता यह है कि आधुनिक डिजाइनर को कोड की आवश्यकता है। मैं आमतौर पर मूल एच 1, एच 2, एच 3, एच 4, एच 5, एच 6, एच 6, पैराग्राफ, फुटर के साथ एक एचटीएमएल फाइल का एक कंकाल बनाकर प्रमुख ब्राउज़र स्टाइलशीट से एक मानक मैट्रिक्स पर विचार करता हूं। मैं मानक स्टाइल के आकार को समझने के लिए ब्राउज़र स्टाइलशीट का निरीक्षण करता हूं, जिसके शीर्षकों पर वे लाइन-ऊंचाई और पदानुक्रम का उपयोग करते हैं। वेब टाइपोग्राफी आकार से पहले धातु / लकड़ी जंगम प्रकार द्वारा विनियमित किया गया था लेकिन 1985 से, एडोब और एप्पल के बीच समझौते के साथ चीजों को बदलना शुरू हो गया। मुझे लगता है कि आज, टाइपोग्राफी अवधारणाओं के मुख्य नियामक हैं Apple, Safari, Windows, इंटरनेट एक्सप्लोरर, क्रोम, फ़ायरफ़ॉक्स के साथ ... आपको अपनी टाइपोग्राफी को देखने के लिए उनके ब्राउज़र स्टाइलशीट को देखना होगा कि वास्तव में क्या प्रस्तुत किया जाएगा और में विभिन्न उपकरणों। आपको अभी भी रोबर्ट ब्रिफहर्स्ट के एलिमेंट्स ऑफ़ टाइपोग्राफिक स्टाइल की प्रथाओं का पालन करना चाहिए, जो कि एक उत्कृष्ट पुस्तक है, या फाइबोनैचि सिस्टम प्रणाली का अनुसरण करती है। मैं आमतौर पर ब्राउज़र स्टाइलशीट में परिवर्तन की तारीख तक रहता हूं और यहां w3 विनिर्देशों को पढ़ता हूं: आपको अभी भी रोबर्ट ब्रिफहर्स्ट के एलिमेंट्स ऑफ़ टाइपोग्राफिक स्टाइल की प्रथाओं का पालन करना चाहिए, जो कि एक उत्कृष्ट पुस्तक है, या फाइबोनैचि सिस्टम प्रणाली का अनुसरण करती है। मैं आमतौर पर ब्राउज़र स्टाइलशीट में परिवर्तन की तारीख तक रहता हूं और यहां w3 विनिर्देशों को पढ़ता हूं: आपको अभी भी रोबर्ट ब्रिफहर्स्ट के एलिमेंट्स ऑफ़ टाइपोग्राफिक स्टाइल की प्रथाओं का पालन करना चाहिए, जो कि एक उत्कृष्ट पुस्तक है, या फाइबोनैचि सिस्टम प्रणाली का अनुसरण करती है। मैं आमतौर पर ब्राउज़र स्टाइलशीट में परिवर्तन की तारीख तक रहता हूं और यहां w3 विनिर्देशों को पढ़ता हूं:https://www.w3.org/TR/html401/struct/global.html#h-7.5.5 मुझे लगता है कि हालांकि, डिज़ाइन क्षेत्र को इस पर विचार करने की आवश्यकता है और मुझे लगता है कि अभ्यास में शिक्षा के साथ अद्यतन नहीं किया गया है वर्तमान वास्तविकताओं। आप यहाँ मेरे ब्लॉग पर अधिक पढ़ सकते हैं: https://road-to-resilience.blog/2019/11/21/the-typographic-thing/