वेबसाइट पर हैडर को कैसे स्ट्रेच करें

विषयसूची:

वेबसाइट पर हैडर को कैसे स्ट्रेच करें
वेबसाइट पर हैडर को कैसे स्ट्रेच करें

वीडियो: वेबसाइट पर हैडर को कैसे स्ट्रेच करें

वीडियो: वेबसाइट पर हैडर को कैसे स्ट्रेच करें
वीडियो: एक महान वेबसाइट हैडर डिजाइन करने के लिए 11 युक्तियाँ 2024, मई
Anonim

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

वेबसाइट पर हैडर को कैसे स्ट्रेच करें
वेबसाइट पर हैडर को कैसे स्ट्रेच करें

यह आवश्यक है

संसाधन के पृष्ठों के मार्कअप को बदलने की क्षमता।

अनुदेश

चरण 1

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

चरण दो

यदि पृष्ठ पहले से ही टाइपसेट है, तो आप हेडर को स्वयं फैलाने का प्रयास कर सकते हैं। इसके लिए HTML और CSS का बेसिक ज्ञान होना आवश्यक है। यदि साइट हेडर को एकल ग्राफ़िक फ़ाइल के रूप में डिज़ाइन किया गया है, तो आप विंडो की चौड़ाई के आधार पर उसकी छवि को संपीड़ित और खींचने का प्रयास कर सकते हैं। स्केलिंग कारक छोटा होने पर यह विधि अच्छी तरह से काम करती है। यदि यह छवि की चौड़ाई एक चौथाई या अधिक से अधिक हो जाती है, तो चित्र की गुणवत्ता प्रभावित होगी। छवि बनाने वाले अलग-अलग पिक्सेल दृश्यमान हो जाएंगे।

चरण 3

छवि को उच्च गुणवत्ता का रहने के लिए, लेकिन साथ ही इसके लिए आवंटित सभी स्थान पर कब्जा करने के लिए, इसे अलग-अलग भागों में विभाजित करना आवश्यक है। यह आमतौर पर दाईं ओर, बाईं ओर और केंद्र होता है। यह वांछनीय है कि छवि की एक पृष्ठभूमि है जो चौड़ाई में ठोस है, जिसके साथ हेडर के हिस्सों के बीच उत्पन्न होने वाले अंतराल को भरना संभव था। हेडर के किनारों को बनाने वाली दो तस्वीरें कंटेनर के बाएँ और दाएँ किनारों से जुड़ी होनी चाहिए। केंद्रीय छवि को एक टैग में लपेटें। शेष स्थान को एक-पिक्सेल चौड़ी पृष्ठभूमि छवि के साथ पक्का करें।

चरण 4

एक और आसान तरीका एक ऐसी छवि बनाना है जो स्वाभाविक रूप से सबसे बड़ी स्क्रीन से बड़ी हो। छवि को शीर्ष लेख अनुभाग के केंद्र में पृष्ठभूमि के रूप में सेट किया गया है। नकारात्मक पक्ष छवि का बड़ा "वजन" है, और परिणामस्वरूप - लंबा लोडिंग समय। उपरोक्त विधियों के संयोजन से अधिकांश नकारात्मक प्रभावों से बचा जा सकता है।

सिफारिश की: