जबकि छवियों पर आने पर छवियों को बहुत अधिक प्यार मिलता है, यह लिखित शब्द है जो खोज इंजनों को अपील करता है और अधिकांश साइटों की सामग्री को आगे बढ़ाता है। इस प्रकार, टाइपोग्राफ़िक डिज़ाइन वेबसाइट डिज़ाइन का एक महत्वपूर्ण रूप से महत्वपूर्ण हिस्सा है। किसी साइट के टेक्स्ट के महत्व के साथ यह सुनिश्चित करने की आवश्यकता होती है कि यह अच्छा दिखता है और पढ़ने में आसान है। यह सीएसएस (कैस्केडिंग स्टाइल शीट्स) स्टाइल के साथ किया जाता है।
आधुनिक वेब डिज़ाइन मानक के बाद, जब आप किसी वेबसाइट की टेक्स्ट सामग्री के रूप को निर्देशित करना चाहते हैं, तो आप सीएसएस का उपयोग करके ऐसा करेंगे। यह उस पृष्ठ की HTML संरचना से उस सीएसएस शैली को अलग करता है। उदाहरण के तौर पर, यदि आप किसी पृष्ठ का फ़ॉन्ट "एरियल" पर सेट करना चाहते हैं, तो आप निम्न सीएसएस नियम को अपने सीएसएस में जोड़कर ऐसा कर सकते हैं (नोट - यह संभवतः बाहरी सीएसएस स्टाइल शीट में किया जाएगा जो शैलियों को शक्ति देता है वेबसाइट पर हर पृष्ठ के लिए):
शरीर {फ़ॉन्ट-परिवार: एरियल; }यह फ़ॉन्ट "बॉडी" के लिए सेट है, इसलिए सीएसएस कैस्केड पृष्ठ के सभी अन्य तत्वों को शैली लागू करेगा। ऐसा इसलिए है क्योंकि हर दूसरे एचटीएमएल तत्व "बॉडी" तत्व का बच्चा है, सीएसएस शैलियों जैसे फ़ॉन्ट परिवार या रंग माता-पिता से बच्चे के तत्व में कैस्केड होंगे। यह तब तक होगा जब तक कुछ तत्वों के लिए एक और विशिष्ट शैली नहीं जोड़ा जाता है। इस सीएसएस के साथ एकमात्र समस्या यह है कि केवल एक ही फ़ॉन्ट निर्दिष्ट है। यदि वह फ़ॉन्ट किसी कारण से नहीं पाया जा सकता है, तो ब्राउज़र दूसरे स्थान पर स्थानांतरित करेगा। यह बुरा है क्योंकि आपके पास किस फ़ॉन्ट का उपयोग किया जाता है, इस पर आपका कोई नियंत्रण नहीं है - ब्राउज़र आपके लिए चुनता है, और आपको यह पसंद नहीं आया कि उसने इसका उपयोग करने का फैसला किया है! वह जगह है जहां एक फ़ॉन्ट स्टैक आता है।
एक फ़ॉन्ट स्टैक सीएसएस फ़ॉन्ट-पारिवारिक घोषणा में फोंट की एक सूची है। फोंट को वरीयता के क्रम में सूचीबद्ध किया गया है कि आप उन्हें फ़ॉन्ट पर लोड होने जैसी समस्या के मामले में साइट पर दिखाना चाहते हैं। एक फ़ॉन्ट स्टैक एक डिज़ाइनर को वेब पेज पर फोंट के रूप को नियंत्रित करने की अनुमति देता है भले ही कंप्यूटर के पास प्रारंभिक फ़ॉन्ट न हो जिसे आपने बुलाया हो।
तो फ़ॉन्ट स्टैक कैसे दिखता है? यहाँ एक उदाहरण है:
शरीर {फ़ॉन्ट-परिवार: जॉर्जिया, "टाइम्स न्यू रोमन", सेरिफ़; }यहां ध्यान देने योग्य कुछ चीजें हैं।
सबसे पहले, आप देखेंगे कि हमने विभिन्न फ़ॉन्ट नामों को अल्पविराम से अलग किया है। प्रत्येक के बीच आप जितना चाहें उतने फोंट जोड़ सकते हैं, जब तक कि वे अल्पविराम से अलग हो जाएं। ब्राउज़र पहले निर्दिष्ट पहले फ़ॉन्ट को लोड करने का प्रयास करेगा। यदि यह विफल हो जाता है, तो यह प्रत्येक फ़ॉन्ट को आज तक चलने वाली रेखा को चलाएगा जब तक कि वह इसका उपयोग न कर सके। इस उदाहरण में हम वेब सुरक्षित फोंट का उपयोग कर रहे हैं, और "जॉर्जिया" साइट पर जा रहे व्यक्ति के कंप्यूटर पर पाए जाएंगे (नोट - ब्राउज़र पृष्ठ पर निर्दिष्ट फ़ॉन्ट्स के लिए आपके कंप्यूटर पर दिखता है, इसलिए साइट वास्तव में कह रही है कंप्यूटर जो आपके सिस्टम से लोड करने के लिए फ़ॉन्ट्स)। अगर किसी कारण से फ़ॉन्ट नहीं मिला, तो यह ढेर को नीचे ले जायेगा और निर्दिष्ट अगले फ़ॉन्ट को आजमाएगा।
उस अगले फ़ॉन्ट के संदर्भ में, ध्यान दें कि यह ढेर में कैसे लिखा गया है। "टाइम्स न्यू रोमन" का नाम डबल कोट्स में लगाया गया है। ऐसा इसलिए है क्योंकि फ़ॉन्ट नाम में कई शब्द हैं। किसी भी फोंट नामों में एक से अधिक शब्द (ट्रेबुचेट एमएस, कूरियर न्यू इत्यादि) के नाम का नाम डबल कोट्स में होना चाहिए ताकि ब्राउजर जानता हो कि वे सभी शब्द एक फ़ॉन्ट नाम का हिस्सा हैं।
अंत में, हम "सेरिफ़" के साथ फ़ॉन्ट स्टैक को समाप्त करते हैं, जो एक सामान्य फ़ॉन्ट वर्गीकरण है। संभावना नहीं है कि आपके स्टैक में आपके द्वारा नामित फ़ॉन्ट्स में से कोई भी उपलब्ध नहीं है, ब्राउज़र को केवल एक फ़ॉन्ट मिलेगा जो कम से कम उचित वर्गीकरण में आपके द्वारा चुने गए वर्गीकरण में आता है। उदाहरण के लिए, यदि आप "सैन्स-सेरिफ़" के वर्गीकरण के साथ एक फ़ॉन्ट स्टैक को समाप्त करने की तुलना में एरियल और वर्दाना जैसे सैन्स-सेरिफ़ फोंट का उपयोग कर रहे हैं, तो लोड लोड होने पर कम से कम उस परिवार में फ़ॉन्ट को बनाए रखा जाएगा। माना जाता है कि, यह बहुत दुर्लभ होना चाहिए कि ब्राउज़र को स्टैक में सूचीबद्ध किसी भी फोंट को नहीं मिल सकता है और इसके बजाय इस सामान्य वर्गीकरण का उपयोग करना है, यह किसी भी तरह से इसे दोगुना सुरक्षित रखने के लिए सबसे अच्छा अभ्यास है।
फ़ॉन्ट स्टैक और वेब फ़ॉन्ट्स
कई वेबसाइटें आज वेब फोंट का उपयोग करती हैं जिन्हें या तो अन्य संसाधनों (जैसे साइट की छवियों, जावास्क्रिप्ट फ़ाइल इत्यादि) के साथ साइट पर शामिल किया गया है या Google फ़ॉन्ट्स या टाइपकिट जैसे ऑफ़साइट फ़ॉन्ट स्थान से लिंक किया गया है। हालांकि इन फोंट को लोड करना चाहिए क्योंकि आप फ़ाइलों से खुद को जोड़ रहे हैं, फिर भी आप यह सुनिश्चित करने के लिए एक फ़ॉन्ट स्टैक का उपयोग करना चाहते हैं कि आपके पास उत्पन्न होने वाले किसी भी मुद्दे पर कुछ नियंत्रण हो। वही बात "वेब सुरक्षित" फ़ॉन्ट्स के लिए जाती है जो कि किसी के कंप्यूटर पर होनी चाहिए (ध्यान दें कि हमने इस आलेख में उदाहरण के रूप में उपयोग किए गए फ़ॉन्ट्स, एरियल, वेरडाना, जॉर्जिया और टाइम्स न्यू रोमन समेत सभी वेब सुरक्षित फोंट हैं किसी व्यक्ति के कंप्यूटर पर)। भले ही एक फ़ॉन्ट गायब होने की संभावना बहुत कम है, एक फ़ॉन्ट स्टैक निर्दिष्ट करने से साइट के टाइपोग्राफ़िक डिज़ाइन को जितना संभव हो बुलेटप्रूफ में मदद मिलेगी।
जेनिफर क्रिनिन द्वारा मूल लेख। जेरेमी गिरार्ड द्वारा 8/9/17 को संपादित किया गया