एगो प्रोजेक्ट पूरा कइला के बाद जवना में हमरा सीएसएस आ एसवीजी एनीमेशन के बारे में हर संभव जानकारी होखे के रहे, हम ई सीरीज स्मैशिंग एनीमेशन आ “हाउ क्लासिक कार्टून मॉडर्न सीएसएस के प्रेरित करे वाला” के बारे में लिखे लगनी। एह साल के गोल करे खातिर हम रउरा सभे के देखावल चाहत बानी कि आधुनिक सीएसएस के इस्तेमाल कइसे कइल जा सकेला कि ऊ तत्व बनावल जा सके जवन टून टाइटिल के अतना प्रभावशाली बनावेला: ओकर टाइपोग्राफी. शीर्षक कलाकृति डिजाइन के बा 1920 के दशक आ ’30 के दशक के शुरुआत के मौन दौर में कवनो फिल्म के टाइटिल कार्ड के टाइपोग्राफी एगो मिजाज पैदा कर देत रहे, दृश्य सेट करत रहे आ दर्शकन के ओह तरह के फिल्म के याद दिलावत रहे जवना के ऊ लोग देखे खातिर पइसा देले रहे.
कार्टून के टाइटिल कार्ड भी ब्रांडिंग, मूड, आ सीन-सेटिंग के रहे, सब एके में लुढ़क गइल रहे। सुरुआती सालन में जब प्रमुख स्टूडियो के बजट बड़ होखे तब ई टाइटिल कार्ड अक्सर सचित्र आ चित्रकारी के रूप में होखे लें।
बाकिर जब 1950 के दशक में टेलीविजन के तेजी आइल त बजट में गिरावट आइल आ लॉरेंस “आर्ट” गोबल जइसन कलाकारन के डिजाइन कइल कार्ड एगो नया दृश्य भाषा अपना लिहले जवना से ऊ अधिका ग्राफिक, स्टाइलिश आ कम जटिल हो गइल. नोट: लॉरेंस “आर्ट” गोबल मध्य सदी के अमेरिकी एनीमेशन के अक्सर अनदेखी कइल जाए वाला नायकन में से एक हउवें. ऊ मुख्य रूप से 1950 आ 1960 के दशक के सभसे परभावशाली सालन में हान्ना-बारबेरा खातिर काम कइलें। गोबल कवनो किरदार एनिमेटर ना रहले. इनके भूमिका माहौल बनावे के रहल, एह से ऊ द फ्लिंटस्टोन्स, हकलबेरी हाउंड, क्विक ड्रॉ मैकग्रा, आ योगी बियर खातिर माहौल डिजाइन कइलें आ साथ ही साथ शुरुआती टाइटिल कार्ड भी डिजाइन कइलें जे टोन सेट कइलें। उनकर टाइटिल कार्ड, जवना में लोगो ओवरलेड वाला पेंटिंग देखावल गइल रहे, हान्ना-बारबेरा के प्रतिष्ठित लुक के परिभाषित करे में मदद कइलस। क्विक ड्रॉ मैकग्रा आ योगी बियर जइसन किरदारन खातिर गोबल के कलाकृति छोट टीवी स्क्रीन पर प्रभावी रहे. कार्टून से एगो स्टिल के रिप्रोड्यूस करे के बजाय ऊ एगो एकल, मजबूत बिचार पेश करे पर फोकस कइलें — अक्सर सिल्हूट में — जे एकर सार के कैप्चर करे। “द बज़िन’ बियर” में योगी हेलीकाप्टर में गुंजायमान होके गुजरत बाड़न. ऊ हाथ में पिक-ए-निक टोकरी लेके उछल के चल जाला, “बियर ऑन ए पिकनिक” में, आ अपना “प्राइज फाइट फ्राइट” खातिर योगी टाइटिल टेक्स्ट के बॉक्स में डाल देला।
भरोसा करे के गति कम भा कवनो गति ना होखला का चलते गोबल के एकल फ्रेम में एगो मिजाज बनावे के पड़ी, दृश्य सेट करे के पड़ी आ कवनो कहानी के वर्णन करे के पड़ी. ई लोग ई काम सपाट रंग, ग्राफिक आकृति आ टाइपोग्राफी के इस्तेमाल से कइल जे अक्सर कलाकृति में एकीकरण कइल जात रहे।
वेब पर काम करे वाला डिजाइनर के रूप में टून टाइटिल हमनी के बहुत कुछ सिखा सकेला कि कइसे कवनो ब्रांड के व्यक्तित्व के संप्रेषण कइल जा सकेला, पहिला छाप बनावल जा सकेला, आ कवनो उत्पाद भा वेबसाइट के इस्तेमाल से केहू के अनुभव खातिर उम्मीद तय कइल जा सकेला. हमनी के कलाकारन के तकनीक से सीख सकेनी जा कि प्रभावी बैनर, लैंडिंग-पेज हेडर, आ इहाँ तक कि बढ़िया ओल’ फैशन के स्पलैश स्क्रीन भी बनावल जा सकेला. टून टाइटल टाइपोग्राफी के बारे में बतावल गइल बा कार्टून टाइटिल कार्ड सभ से पता चले ला कि कइसे बिम्ब के साथ टाइप के मर्ज कइला से हेडर भा हीरो के जरूरत के पंच मिले ला। मुट्ठी भर टेक्स्ट-शैडो, टेक्स्ट-स्ट्रोक, आ ट्रांसफॉर्म ट्रिक के साथ, आधुनिक सीएसएस रउआँ के ओही ऊर्जा के टैप करे के सुविधा देला।
टून टेक्स्ट टाइटल जनरेटर के बा एह लेख के लिखे के आधा रास्ता में हमरा एहसास भइल कि हमरा बहुते प्यार करे वाला कार्टून टाइटिल जइसन टेक्स्ट स्टाइल के टेक्स्ट जेनरेट करे खातिर एगो टूल होखल उपयोगी होई. त हम एगो बनवनी। माई टून टेक्स्ट टाइटल जनरेटर रउआँ के रंग, स्ट्रोक, आ कई गो टेक्स्ट शैडो के प्रयोग करे के सुविधा देला। रउआँ पेंट के क्रम समायोजित क सकत बानी, अक्षर के अंतराल लागू क सकत बानी, नमूना फॉन्ट सभ के चयन में आपन टेक्स्ट के पूर्वावलोकन क सकत बानी आ फिर जेनरेट कइल CSS के सीधे अपना क्लिपबोर्ड पर कॉपी क के प्रोजेक्ट में इस्तेमाल क सकत बानी। टून टाइटल सीएसएस के बा रउआँ बस ओह CSS के कॉपी-पेस्ट कर सकेनी जवन टून टेक्स्ट टाइटल जनरेटर रउआँ के देला। बाकिर एकरा के गहिराह से देखल जाव कि ई का करेला. पाठ छाया के बा ऑगी डॉगी के एपिसोड “युक-युक डक” के एह टाइटिल में टाइप देखीं, जवना के पीयर पीला अक्षर आ गहिराह, कड़ा, ऑफसेट छाया बा जवन एकरा के बैकग्राउंड से उठा के गहराई के भ्रम पैदा करेला.
रउआँ शायद पहिले से जानत होखीं कि टेक्स्ट-शैडो चार गो मान स्वीकार करे ला: (1) क्षैतिज आ (2) ऊर्ध्वाधर ऑफसेट, (3) धब्बा, आ (4) अइसन रंग जे ठोस भा अर्ध-पारदर्शी हो सके ला। ऊ ऑफसेट मान सकारात्मक भा नकारात्मक हो सकेला, एहसे हम नीचे आ दाहिने ओर खींच के कड़ा छाया के इस्तेमाल से “युक-युक डक” के नकल कर सकेनी: रंग: # f7f76d के बा; पाठ-छाया: 5px 5px 0 # 1e1904 के बा;
दोसरा तरफ एह “पिंट जाइंट” टाइटिल के नकारात्मक अर्ध-नरम छाया के साथे एगो अलगे एहसास बा: रंग: # c2a872 के बा; पाठ-छाया के बा: -7px 5px 0 # b100e, 1000 के बा। 0 -5px 10px # 546c6f के बा;
अतिरिक्त गहराई जोड़े आ अउरी रोचक इफेक्ट बनावे खातिर हम कई गो छाया के लेयर कर सकेनी। “लेट’स डक आउट” खातिर हम चार गो छाया के संयोजन कइले बानी: पहिला एगो ठोस छाया के साथे नकारात्मक क्षैतिज ऑफसेट के साथ पाठ के पृष्ठभूमि से उठावे खातिर, ओकरा बाद प्रगतिशील रूप से नरम छाया के साथ ओकरा चारों ओर धब्बा पैदा करे खातिर: रंग: # 6F4D80 के बा; पाठ-छाया के बा: -5px के बा5px 0 #260e1e, /* छाया 1 */ के बा। 0 0 15px #e9ce96, /* छाया 2 */ के बा। 0 0 30px # e9ce96, /* छाया 3 */ के बा। 0 0 30px # e9ce96 के बा; /* छाया 4 के बा */
ई छाया बतावेला कि टेक्स्ट-शैडो के इस्तेमाल खाली लाइटिंग इफेक्ट बनावे के ना होला, काहे कि ई सजावटी भी हो सकेला आ व्यक्तित्व जोड़ सकेला. टेक्स्ट स्ट्रोक के बा कई गो कार्टून टाइटिल कार्ड सभ में बोल्ड रूपरेखा वाला अक्षर सभ के देखावल जाला जेवना से ई पृष्ठभूमि से अलगा होलें। हम टेक्स्ट-स्ट्रोक के इस्तेमाल से एह इफेक्ट के दोबारा बना सकेनी। बहुत दिन से ई गुण खाली -webkit- उपसर्ग के माध्यम से उपलब्ध रहे, लेकिन एकर मतलब इहो बा कि अब एकरा के आधुनिक ब्राउज़र में सपोर्ट कईल गईल बा।
text-stroke दू गो गुण के आशुलिपि हवे। पहिला, टेक्स्ट-स्ट्रोक-चौड़ाई, अलग-अलग अक्षर सभ के चारों ओर समोच्च खींचे ला जबकि दुसरा, टेक्स्ट-स्ट्रोक-रंग, एकरे रंग के नियंत्रित करे ला। “Whatever Goes Pup” खातिर हम पीला टेक्स्ट में 4px के नीला स्ट्रोक जोड़ले बानी: रंग: # eff0cd के बा; -वेबकिट-पाठ-स्ट्रोक: 4px # 7890b5 बा; पाठ-स्ट्रोक: 4px # 7890b5 के बा;
स्ट्रोक खास तौर पर तब उपयोगी हो सकेला जब ओकरा के छाया के साथे जोड़ल जाव, एहसे “बढ़त, बढ़त, गइल” खातिर, हम मुश्किल से धुंधला 1px छाया में पतला 3px स्ट्रोक जोड़ के ई तीन आयामी पाठ प्रभाव बनवले बानी: रंग: # fbb999 के बा; पाठ-छाया: 3px 5px 1px # 5160b1 के बा; -वेबकिट-पाठ-स्ट्रोक: 3px # 984336; पाठ-स्ट्रोक: 3px # 984336 के बा;
पेंट के ऑर्डर दिहल जाला टेक्स्ट-स्ट्रोक के इस्तेमाल से हमेशा उम्मीद के मुताबिक परिणाम ना मिलेला, खास तौर प पतला अक्षर अवुरी मोट स्ट्रोक के संगे, काहेंकी डिफ़ॉल्ट रूप से ब्राउज़र फिल के ऊपर स्ट्रोक खींचेला। दुख के बात बा कि सीएसएस अबहियों हमरा के स्ट्रोक प्लेसमेंट एडजस्ट करे के अनुमति नइखे देत जइसे कि हम अक्सर स्केच में करेनी. हालांकि पेंट-ऑर्डर प्रॉपर्टी के मान बा जवना से हम स्ट्रोक के फिल के सामने ना, ओकरा पीछे राख सकीले.
पेंट-ऑर्डर: स्ट्रोक पहिले स्ट्रोक के पेंट करेला, फिर फिल, जबकि पेंट-ऑर्डर: भराई एकर उल्टा करेला: रंग: # fbb999 के बा; पेंट-ऑर्डर: भरल जाला; पाठ-छाया: 3px 5px 1px # 5160b1 के बा; पाठ-स्ट्रोक-रंग: # 984336 के बा; पाठ-स्ट्रोक-चौड़ाई: 3px बा;
एगो कारगर स्ट्रोक अक्षर सभ के पठनीय रखे ला, वजन बढ़ावे ला आ — जब छाया आ पेंट के क्रम के साथ मिलावल जाला — सपाट पाठ के वास्तविक मौजूदगी देला। पाठ के भीतर के पृष्ठभूमि कई गो कार्टून टाइटिल कार्ड सभ लेटरिंग में बनावट, ढाल भा सचित्र बिस्तार जोड़ के सपाट रंग से आगे बढ़ जालें। कबो ऊ बनावट होला त कबो सूक्ष्म तान शिफ्ट वाला ढाल हो सकेला. वेब पर हम एह इफेक्ट के टेक्स्ट के पीछे बैकग्राउंड इमेज भा ढाल के इस्तेमाल क के, आ ओकरा बाद ओकरा के अक्षरन के आकार में क्लिप क के दोबारा बना सकेनी। ई दू गो गुण सभ के एक साथ काम करे पर निर्भर करे ला: बैकग्राउंड-क्लिप: टेक्स्ट आ टेक्स्ट-फिल-रंग: पारदर्शी।
सबसे पहिले हम पाठ के पीछे एगो बैकग्राउंड लागू करेनी। ई बिटमैप भा वेक्टर इमेज भा सीएसएस ढाल हो सके ला। क्विक ड्रॉ मैकग्रा एपिसोड “बाबा बैट” के एह उदाहरण खातिर, टाइटिल टेक्स्ट में अन्हार से रोशनी में एगो सूक्ष्म ऊपर-नीचे ढाल शामिल बा: पृष्ठभूमि: रैखिक-ढाल (0 डिग्री, # 667b6a, # 1d271a);
एकरा बाद, हम ओह बैकग्राउंड के ग्लिफ में क्लिप क के टेक्स्ट के पारदर्शी बना देनी ताकि बैकग्राउंड के माध्यम से देखावल जा सके: -वेबकिट-पृष्ठभूमि-क्लिप: पाठ; -वेबकिट-पाठ-भरन-रंग: पारदर्शी बा;
बस ओह दू गो लाइन के साथ अब पृष्ठभूमि के पाठ के पीछे ना रंगल जाला; बल्कि एकरा भीतर रंगल बा. ई तकनीक खास तौर पर तब बढ़िया काम करेले जब एकरा के स्ट्रोक आ छाया के संगे मिलावल जाला। क्लिप कइल ढाल लेटरिंग के रंग आ बनावट देला, स्ट्रोक एकरे किनारे सभ के तेज रखे ला आ छाया एकरा के बैकग्राउंड से ऊपर उठावे ला। ई लोग मिल के हाथ से चित्रित टाइटिल कार्ड के लेयर वाला लुक के दोबारा बनावेला जवना में तनी सीएसएस से बेसी कुछ ना कइल जाला. हमेशा निहन क्लिप कइल टेक्स्ट के सावधानी से परीक्षण करीं, काहें से कि ब्राउजर के quirks कबो-कबो छाया आ रेंडरिंग के प्रभावित क सके ला। पाठ के अलग-अलग अक्षर में बांटल कई बेर त पूरा शब्द भा हेडिंग के स्टाइल ना कइल चाहत होखे. हम अलग-अलग अक्षर के स्टाइल कइल चाहत बानी — कवनो पात्र के जगह पर धकेलल चाहत बानी, एगो ग्लिफ के अतिरिक्त वजन दिहल चाहत बानी, भा कुछ अक्षरन के स्वतंत्र रूप से एनिमेट कइल चाहत बानी. सादा एचटीएमएल आ सीएसएस में, एकरा खातिर खाली एगो भरोसेमंद तरीका बा: हर वर्ण के अपना स्पैन तत्व में लपेटल। हम ऊ काम मैन्युअल रूप से कर सकत रहनी बाकिर ऊ नाजुक होखी, रखरखाव कइल मुश्किल होखी आ कॉपी बदलला पर जल्दीए टूट जाई. एकरा बजाय जब हमरा प्रति अक्षर नियंत्रण के जरूरत होला त हम splt.js जइसन टेक्स्ट-स्प्लिटिंग लाइब्रेरी के इस्तेमाल करेनी (हालांकि अउरी समाधान उपलब्ध बा)। ई एगो टेक्स्ट नोड लेला आ स्वचालित रूप से शब्द भा पात्रन के लपेट देला, जवना से हमरा मार्कअप के बिना गड़बड़ी कइले एनिमेट आ स्टाइल करे खातिर अतिरिक्त हुक मिल जाला. ई एगो अइसन तरीका ह जवन हमार एचटीएमएल पठनीय आ सिमेंटिक राखेला, जबकि हमरा के ऊ महीन दाना वाला नियंत्रण देला जवना के जरूरत बा हमरा ओह असमान, चरित्रात्मक टाइपोग्राफी के दोबारा बनावे खातिर जवन रउरा क्लासिक कार्टून टाइटिल कार्ड में देखत बानी. हालांकि, इ दृष्टिकोण के संगे आवेलापहुँच के चेतावनी, काहें से कि अधिकतर स्क्रीन रीडर टेक्स्ट नोड सभ के क्रम से पढ़े लें। त ई:
हम मीठा हम
के बा...जइसन पढ़ल जाला ओइसने पढ़ल जाला जइसन रउरा उमेद करीं: हम मीठा हम के बा
बाकिर ई कि:
के बा एच के बा उ के बा m के बा के बा
के बा...ब्राउजर आ स्क्रीन रीडर के आधार पर अलग-अलग तरीका से व्याख्या कइल जा सके ला। कुछ लोग अक्षरन के जोड़ के शब्दन के सही पढ़ी. दूसर लोग अक्षरन के बीच में रुक सकेला, जवन सबसे खराब स्थिति में अइसन लाग सकेला कि: “ह...” “उ...” “म...”
दुख के बात बा कि कुछ स्प्लिटिंग सॉल्यूशन हमेशा सुलभ रिजल्ट ना देला, एहसे हम आपन टेक्स्ट स्प्लिटर्स, splinter.js लिखले बानी, जवन कि फिलहाल बीटा में बा। व्यक्तिगत पत्रन के रूपांतरण कइल जा रहल बा आपन टून टेक्स्ट स्प्लिटर्स के सक्रिय करे खातिर, हम ओह तत्व में एगो डेटा- एट्रिब्यूट जोड़त बानी जवना के हम स्प्लिट कइल चाहत बानी:
हम मीठा हम
के बासबसे पहिले हमार स्क्रिप्ट हर शब्द के अलग-अलग अक्षर में अलग क के एगो स्पैन तत्व में लपेटेले जवना में क्लास अवुरी एआरआईए एट्रिब्यूट लागू होखेला: के बा के बा के बा
एकरे बाद स्क्रिप्ट बिभाजित तत्व के सुरुआती सामग्री ले के एकरा के एरिया बिसेसता के रूप में जोड़ देले जेह से पहुँच के बनावे रखे में मदद मिल सके:
के बा के बा के बा
के बाओह क्लास एट्रिब्यूट के लागू कइला के साथ, हम तब अलग-अलग पात्रन के अपना पसंद के हिसाब से स्टाइल कर सकेनी।
जइसे कि “हम स्वीट हम” खातिर हम ई दोहरावल चाहत बानी कि एकर अक्षर आधार रेखा से कइसे हट जाला. अपना टून टेक्स्ट स्प्लिटर्स के इस्तेमाल के बाद, हम कई गो :nth-child चयनकर्ता के इस्तेमाल से चार गो अलग-अलग अनुवाद मान लागू कईनी ताकि अर्ध-रैंडम लुक बनावल जा सके: /* चउथा, 8वीं, 12वीं... */ के बा। .toon-char: nth-child (4n) { अनुवाद करीं: 0 -8px; } 1999 में भइल रहे। /* पहिला, 5, 9... */ के बा। .toon-char: nth-child (4n + 1) { अनुवाद करीं: 0 -4px; } 1999 में भइल रहे। /* दूसरा, 6वां, 10वें... */ के बा। .toon-char: nth-child (4n + 2) { अनुवाद करीं: 0 4px; } 1999 में भइल रहे। /* तीसरा, 7वीं, 11वीं... */ के बा। .toon-char: nth-child (4n + 3) { अनुवाद करीं: 0 8px; } 1999 में भइल रहे।
बाकिर अनुवाद खाली एगो गुण ह जवना के इस्तेमाल हम अपना टून टेक्स्ट के बदले में कर सकीलें.
हम ओह अलग-अलग पात्रन के अउरी अराजक रूप खातिर भी घुमा सकत रहनी: /* चउथा, 8वीं, 12वीं... */ के बा। .टून-लाइन .टून-चार: nth-बच्चा (4n) { घुमावे के: -4deg; } 1999 में भइल रहे। /* पहिला, 5, 9... */ के बा। .toon-char: nth-child (4n + 1) { घुमावे के बा: -8deg; } 1999 में भइल रहे। /* दूसरा, 6वां, 10वें... */ के बा। .toon-char: nth-child (4n + 2) { घुमावे के बा: 4deg; } 1999 में भइल रहे। /* तीसरा, 7वीं, 11वीं... */ के बा। .toon-char: nth-child (4n + 3) { घुमावे के बा: 8deg; } 1999 में भइल रहे।
बाकिर अनुवाद खाली एगो गुण ह जवना के इस्तेमाल हम अपना टून टेक्स्ट के बदले में कर सकीलें. हम ओह अलग-अलग पात्रन के अउरी अराजक रूप खातिर भी घुमा सकत रहनी: /* चउथा, 8वीं, 12वीं... */ के बा। .टून-लाइन .टून-चर: nth-चाइल्ड (4n) { 1। घुमावे के बा: -4deg; } 1999 में भइल रहे।
/* पहिला, 5, 9... */ के बा। .टून-चर: nth-बच्चा (4n + 1) { के बा। घुमावे के बा: -8deg; } 1999 में भइल रहे।
/* दूसरा, 6वां, 10वें... */ के बा। .टून-चर: nth-बच्चा (4n + 2) { के बा। घुमावे के बा: 4deg; } 1999 में भइल रहे।
/* तीसरा, 7वीं, 11वीं... */ के बा। .टून-चर: nth-बच्चा (4n + 3) { के बा। घुमावे के बा: 8deg; } 1999 में भइल रहे।
आ, बेशक, हम ओह किरदारन के जिगल करे खातिर एनीमेशन जोड़ सकीलें आ अपना टून टेक्स्ट स्टाइल के टाइटिल के जीवंत कर सकीलें. सबसे पहिले हम एगो कीफ्रेम एनीमेशन बनवनी जवन किरदारन के घुमावेला:
@ कीफ्रेम जिगल { 1999 के बा। 0%, 100% { रूपांतरण: घुमावल (var (--बेस-घूर्णन, 0deg)); } 1999 में भइल रहे। 25% { रूपांतरण: घुमावल (calc (var (--बेस-घूर्णन, 0deg) + 3deg)); } 1999 में भइल रहे। 50% { रूपांतरण: घुमावल (calc (var (--बेस-घूर्णन, 0deg) - 2deg)); } 1999 में भइल रहे। 75% { रूपांतरण: घुमावल (calc (var (--बेस-घूर्णन, 0deg) + 1deg)); } 1999 में भइल रहे। } 1999 में भइल रहे।
एकरा के हमरा टून टेक्स्ट स्प्लिटर्स द्वारा बनावल स्पैन तत्वन पर लागू करे से पहिले: .टून-चर { 1999 के बा। एनीमेशन: जिगल 3s अनंत आसानी-इन-आउट; रूपांतरण-मूल: केंद्र के नीचे के ओर; } 1999 में भइल रहे।
आ अंत में, हर पात्र के जिगल शुरू होखे से पहिले रोटेशन के मात्रा आ देरी सेट कइल: .toon-char: nth-child (4n) { --बेस-घूर्णन: -2deg; } 1999 में भइल रहे। .toon-char: nth-child (4n + 1) { --बेस-घूर्णन: -4deg; } 1999 में भइल रहे। .toon-char: nth-child (4n + 2) { --बेस-घूर्णन: 2deg; } 1999 में भइल रहे। .toon-char: nth-child (4n + 3) { --बेस-घूर्णन: 4deg; } 1999 में भइल रहे।
.toon-char: nth-child (4n) { एनीमेशन-देरी: 0.1s; } 1999 में भइल रहे। .toon-char: nth-child (4n + 1) { एनीमेशन-देरी: 0.3s; } 1999 में भइल रहे। .toon-char: nth-child (4n + 2) { एनीमेशन-देरी: 0.5s; } 1999 में भइल रहे। .toon-char: nth-child (4n + 3) { एनीमेशन-देरी: 0.7s; } 1999 में भइल रहे।
छाप बनावे खातिर एक फ्रेम कार्टून टाइटिल कलाकारन के लगे छाप छोड़े खातिर एगो फ्रेम रहे आ ओह लोग के टाइपोग्राफी ओतने महत्वपूर्ण रहे जतना कि ओह लोग के चित्रित कलाकृति. वेब पर भी इहे हाल बा। एगो बढ़िया से डिजाइन कइल हेडर भा हीरोक्षेत्र में स्पष्टता, चरित्र आ आत्मविश्वास के जरूरत बा — खाली फीका पूरा चौड़ाई वाला बैकग्राउंड इमेज ना। कुछ सावधानी से चुनल CSS गुण — छाया, स्ट्रोक, क्लिप कइल बैकग्राउंड, आ कुछ संयमित एनीमेशन — के साथ हमनी के ओही प्रभाव के दोबारा बना सकेनी जा। हमरा टून टेक्स्ट से प्यार एहसे ना कि हम नॉस्टेलजिक बानी, बलुक एहसे कि एकर डिजाइन इरादा से बनल बा. जानबूझ के चुनाव करीं, आ तनी टून टेक्स्ट टाइपोग्राफी के अपना डिजाइन में पंच जोड़ दीं.
