वीडियो स्कैन 2025, अप्रैल

हमारे पास यह आठ शीर्ष-स्तरीय नेविगेशन टैब हैं, लेकिन होम एकमात्र ऐसा है जो "काम करता है।" बस इसलिए हमारे पास काम करने के लिए कुछ पृष्ठ हैं, हम कुछ पृष्ठों को "

जहाँ तक मुझे याद है, मैंने CSS-ट्रिक्स पर कोड ब्लॉक पर हाइलाइटिंग सिंटैक्स लागू करने के लिए Google कोड Prettify का उपयोग किया था। तुम्हें पता है, जहां एक लाइन में "

हमने अभी Prism.js स्थापित किया है और यह काम कर रहा है। इस पेंचकस में हम कल थीम नामक एक विषय पाते हैं और इसे सिंटैक्स में रंगों को सम्मिलित करते हैं "

हमने हेडर पर थोड़ा काम किया है, लेकिन हम इस स्क्रेंकास्ट में उन पर अधिक खुदाई करेंगे। हेडर्स किसी भी साइट का एक महत्वपूर्ण पहलू हैं। अच्छी की,"

अब जब हमारे पास काम करने के लिए एक ब्लॉग पोस्ट क्षेत्र है, तो हम वास्तव में ब्लॉग पोस्ट टाइपोग्राफी में आ सकते हैं। संभवतः साइट पर सबसे महत्वपूर्ण टाइपोग्राफी है क्योंकि यह "

मुझे लगता है कि व्यक्तिगत फ़ाइल (.scss) जो साइट पर टाइपोग्राफी के विशाल बहुमत के लिए है, बहुत अच्छा है। सामान्यीकृत में काफी टाइपोग्राफी है "

टाइपकास्ट (इस फिल्मांकन के समय बीटा में) वेब टाइपोग्राफी के साथ खेलने के लिए एक बहुत साफ वेब ऐप है। यह आपको खेलने के लिए एक शानदार इंटरफ़ेस देता है "

"डोन्ट ओवरथिंक इट ग्रिड्स" की अवधारणा को जारी रखते हुए, हमें कुछ साधारण पैडिंग का उपयोग करके ग्रिड में जाने वाले गटर मिलते हैं। हम पैडिंग नंबर रखते हैं ”

इससे पहले कि हम कुछ टाइपोग्राफी काम करते हैं, मैंने सोचा कि हम उस कष्टप्रद बात को ठीक करेंगे जहां चित्र लेख क्षेत्र और ग्रिड के बाहर बस्ट कर रहे हैं। का उपयोग कर "

अब जब हम एक कस्टम स्थानीय डोमेन चला रहे हैं, तो हम PHP का उपयोग कर सकते हैं। MAMP में "P" "PHP" =) के लिए है। PHP का उपयोग करने का अर्थ है कि हम शामिल कर सकते हैं। उदाहरण के लिए: हमारा "

हम CSS3 के सामान (जैसे ग्रेडर) के साथ मदद करने के लिए अपने खुद के Sass @mixins लिख सकते हैं, लेकिन एक Sass ढांचा है जो पहले से ही मौजूद है जिसे Compass कहा जाता है "

साइट डिज़ाइन बहुत ग्रिड की तरह आकार ले रहा है। हमारे मॉड्यूल ग्रिड में बहुत सफाई से काम करेंगे। लेकिन जटिल और अजीब ग्रिड नहीं हैं? और शायद हम "

इस सुपर क्विक स्क्रेंकास्ट में, हम एक URL सेट करने के लिए MAMP का उपयोग करते हैं जिसका उपयोग हम स्थानीय विकास के लिए कर सकते हैं। यह कारणों की एक गुच्छा के लिए उपयोगी है: हम "से लिंक कर सकते हैं"

हम CSS में @media क्वेरीज़ की अवधारणा का परिचय देते हैं। इस परियोजना पर सैस का उपयोग करने के लिए बहुत कुछ हमें DRY रहने की अनुमति देता है (अपने आप को दोहराएं नहीं)। हमने किया"

हम लोगो को थोड़ा मोड़कर शुरू करते हैं, लेकिन फिर मुख्य नौसेना में आइकन जोड़ते हुए कूदते हैं। जब हम फोटोशॉप में नेविगेशन डिजाइन कर रहे थे (वीडियो)

हमने v10 के लिए टाइपेकिट में एक नया किट स्थापित किया है। ब्रांडिंग के लिए, हम अभी और इसके लिए कुछ और फोंट का उपयोग करेंगे, जो हमारे लिए HF और J फोंट के करीब दिखेंगे।

अब तक वास्तविक वेब साइट हमारे फ़ोटोशॉप डिज़ाइन की तरह बिल्कुल नहीं दिखती है। इस पेंचकस में हम बस उसी के साथ शीर्ष पर शुरू करते हुए खुदाई करते हैं "

हम लोगो और मुख्य सामग्री क्षेत्र के बाएं किनारे को लाइन करने के लिए कुछ पोजिशनिंग ट्रिक्स का उपयोग कर रहे हैं, जबकि हेडर अभी भी बाईं ओर "स्पर्श" कर रहा है

अधिकांश तत्वों से उपयोगकर्ता एजेंट (डिफ़ॉल्ट) CSS को निकालना आमतौर पर एक अच्छा विचार है। यह लंबे समय से "सार्वभौमिक" रीसेट या एरिक जैसी चीजों द्वारा किया गया है।

हमारे फ़ोटोशॉप मॉकअप को देखते हुए, हम यह लिखना शुरू करते हैं कि हम जो देख रहे हैं उसका वर्णन करने के लिए HTML लिखना शुरू करें। हम जब भी एचटीएमएल 5 का उपयोग करते हैं तो यह निश्चित रूप से होता है "

हम मुख्य नेविगेशन में पाठ को छोड़ना शुरू करते हैं, बस यह देखने के लिए कि यह कैसे फिट होगा, आकार, रंग आदि पर काम करेंगे। पाठ के कुछ भाग बहुत तंग हैं "

हम निश्चित रूप से इस डिज़ाइन के लिए फ़ोटोशॉप में हमेशा के लिए "काम" नहीं कर रहे हैं, लेकिन ब्राउज़र में इस डिज़ाइन को बनाना शुरू करने के लिए हमारे पास काम करने के लिए पर्याप्त है। उपरांत"

हम साइट के शीर्ष स्तर (मुख्य) नेविगेशन को डिजाइन करना शुरू करते हैं। हम डेस्कटॉप आकार स्क्रीन के साथ शुरू कर रहे हैं (एक मनमाने ढंग से चौड़ाई पर) लेकिन हम "

हम "कागज के ढेर" लुक देने के लिए मुख्य हेडर / ब्रांडिंग बॉक्स के नीचे कुछ अतिरिक्त परतें जोड़ते हैं। कोई बड़ा रूपक या कुछ भी नहीं, यह सिर्फ कुछ दृश्य जोड़ता है "

पूरी साइट "मॉड्यूल" पर आधारित होने जा रही है। प्रत्येक छोटी चीज शाब्दिक रूप से एक बॉक्स में होने वाली है (दोनों नेत्रहीन और कोड में, अंततः)। हम "

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

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

स्वागत हे! यह काफी यात्रा होने वाली है, और सभी यात्रा की तरह, यह एक एकल कदम के साथ शुरू होती है। हमारा पहला कदम बिट की सूची लेना है "

यह नया स्वरूप केवल पुनर्निर्देशन के लिए नया स्वरूप नहीं है। मैं हर कल्पनीय तरीके से साइट को बेहतर बनाना चाहता हूं आप किसी साइट को बेहतर बना सकते हैं। निम्न में से एक"

हमने पहले ही हाथ से एसवीजी को अनुकूलित करने के बारे में बात की थी। विवरण के बारे में मैन्युअल रूप से चुनाव करना और किस प्रकार की चीजों को संयुक्त या हटाया जा सकता है। इस में"