सामग्री लेआउट के लिए गाइड

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

यही कारण है कि मैं कुछ बहुत ही बुनियादी स्पष्टीकरण देने जा रहा हूं कि कैसे काम करने के लिए अधिकतम करने के लिए शर्तों में सामग्री के लेआउट पर विचार किया जाना चाहिए और इसका परिणाम इष्टतम है।

इस गाइड का उद्देश्य यह है कि प्रोग्रामिंग या वेब विकास के ज्ञान के बिना कोई भी मुझे एक गुणवत्ता लेआउट दे सकता है और मुझे निष्कर्ष तक पहुंचने तक कई बार बातचीत करने के लिए विचार निकालने की कोशिश करने में ज्यादा समय नहीं देना पड़ता है।

चरण 1: टेम्पलेट

एक टेम्प्लेट बनाने के लिए जहां हम अपने प्रस्ताव को "आकर्षित" कर सकते हैं, हम जो करने जा रहे हैं वह कागज की एक ए 4 शीट है और हम इसे एक तिहाई लंबाई में मोड़ने जा रहे हैं।

चरण 2: सामग्री ब्लॉक

आइए कल्पना करें कि हमारे पास कई प्रकार की सामग्री है: वीडियो, छवि, पाठ। प्रत्येक सामग्री एक आयताकार या चौकोर ब्लॉक है। हमें अपनी पसंद पर टेम्पलेट के ऊपर से नीचे तक ब्लॉकों को फिट करना होगा। हम तीन प्रकार की सामग्री का वर्णन करेंगे।

वीडियो ब्लॉक

हम मान लेंगे कि वीडियो आम तौर पर एक YouTube वीडियो होगा, हम इसे निम्नानुसार टेम्पलेट में दर्शाते हैं:

छवि 2

छवि ब्लॉक

यह इस बात पर निर्भर करता है कि छवि परिदृश्य या चित्र है, जैसा कि हम सहमत होंगे।

पाठ ब्लॉक

छवि ब्लॉक के समान, इस बात पर निर्भर करता है कि हम किस तरह का पाठ चाहते हैं हम एक ब्लॉक या कोई अन्य डाल देंगे। हम इसे समानांतर रेखाओं से दर्शाते हैं।

पाठ ब्लॉक में शामिल पैराग्राफ और यहां तक ​​कि पाठ ब्लॉक भी हो सकते हैं पाठ्य सामग्री सूची

मैं दो उदाहरण डालने जा रहा हूं: एक लैंडस्केप इमेज के आगे टेक्स्ट का एक ब्लॉक, और दूसरा पोर्ट्रेट इमेज के आगे:

छवि 3

शीर्षक ब्लॉक

टाइटल अलग-अलग ब्लॉक में जाते हैं, लम्बी ब्लॉक होते हैं जो आम तौर पर पूरी लाइन पर कब्जा कर लेते हैं।

बटन ब्लॉक

यदि हम लोगों को वेब के किसी अन्य भाग पर क्लिक करने और उन्हें ले जाने के लिए एक बटन लगाना चाहते हैं या केवल कुछ जानकारी (या प्रपत्र) के साथ एक विंडो

अन्य ब्लॉक

विचार समान है। अगर हम समझ गए हैं कि ब्लॉक कैसे काम करते हैं, तो मुझे लगता है कि हम स्पष्ट रूप से दूसरे प्रकार के ब्लॉक रख सकते हैं, जो पिछले वाले के समान हैं, वर्गाकार या आयताकार। उदाहरण के लिए, यदि हम सामग्री में सम्मिलित एक फॉर्म को रखना चाहते हैं। हालांकि यह आमतौर पर सबसे कम आम है, नए ब्लॉकों का उपयोग करने से पहले पूछना बेहतर है जो ऊपर वर्णित प्रकारों में से नहीं हैं। मैं इस सूची को अपडेट करने का प्रयास करूंगा क्योंकि नए ब्लॉक विचार सामने आएंगे जो सभी के लिए रुचि के हो सकते हैं।

अंत में, यहाँ ऊपर दिए गए सभी प्रकार के ब्लॉक के साथ एक टेम्पलेट का उदाहरण दिया गया है:

छवि 4

ब्लॉकों का विस्तार

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

छवि 5

चरण 3: सामग्री बनाना

अब जब हमारे पास ब्लॉक और प्रकार के ब्लॉक द्वारा सामग्री का लेआउट है, तो उन ब्लॉकों को बनाने के लिए आवश्यक है जो उन ब्लॉकों में जाएंगे। 3 चरण 2 चरण के साथ विनिमेय है। दूसरे शब्दों में, हम पहले सामग्री को बना सकते हैं, और फिर उस सामग्री को जानना चाहते हैं जिसे हम शामिल करना चाहते हैं। इसे एक तरह से या किसी अन्य तरीके से करना अविवेकपूर्ण है, लेकिन हमें इस बात की जानकारी होनी चाहिए कि सामग्री को सटीक रूप से हमारे लेआउट में फिट करना है

हम पिछले उदाहरण का पालन करेंगे। 4 छवि में हम निम्नलिखित ब्लॉक देख सकते हैं:

  • 2 शीर्षक ब्लॉक
  • 4 पाठ ब्लॉक
  • 1 वीडियो ब्लॉक
  • 2 छवि ब्लॉक
  • 1 बटन ब्लॉक
  • कुल: 10 ब्लॉक

इसलिए हमें अपनी सामग्री को समायोजित करना होगा ताकि यह इन ब्लॉकों में पूरी तरह से बिना छोड़े फिट हो जाए और उन सभी में फ़ॉन्ट का आकार एक जैसा हो। उसके लिए संभव इसके लायक पहले सामग्री बनाएं और फिर उसे ब्लॉक करें। यह पहले से ही व्यक्ति पर बहुत कुछ निर्भर करता है।

चरण 4: ब्लॉक के साथ सामग्री फिटिंग

चलिए मान लेते हैं कि हमारे पास पहले से ही तैयार किए गए डिजाइन और सभी सामग्री ब्लॉक हैं। अब अंतिम चरण इसे संयोजित करना है। इसके लिए हम सब कुछ गठबंधन करने के लिए कई उपकरणों का उपयोग करेंगे और इसे वेब डिजाइनर को भेजें.

वीडियो ब्लॉक

वीडियो को दो तरीकों से पास किया जा सकता है:

  1. जैसे उपकरण के माध्यम से MP4 वीडियो प्रारूप में WeTransfer.
  2. पूर्वनिर्धारित विकल्प: उन्हें YouTube मार्च चैनल पर अपलोड करना और वीडियो के लिए YouTube लिंक पर पास करना।

मामले में लेआउट में केवल एक वीडियो है कोई समस्या नहीं होगी। लेकिन अगर कई वीडियो हैं, तो हमें उन्हें किसी तरह से लेआउट के साथ जोड़ना होगा जो हमने कागज पर किया है।

उदाहरण के लिए। कल्पना कीजिए कि तीन वीडियो हैं। लेआउट में हम पहले वीडियो में एक 1 नंबर, दूसरे वीडियो में एक 2 नंबर और तीसरे वीडियो में एक 3 नंबर आकर्षित करेंगे। और फिर सभी दस्तावेज भेजते समय हम कुछ इस तरह से डालेंगे:

  • वीडियो 1: वीडियो जो अहिंसा के वाक्यांशों से संबंधित है शीर्षक के साथ: "अहिंसा के सबसे महत्वपूर्ण वाक्यांश"
  • वीडियो 2: वीडियो जो ध्वज के रंगों से संबंधित है शीर्षक के साथ: «अहिंसा का ध्वज»
  • वीडियो 3: वीडियो जो उस समूह से संबंधित है जो अर्जेंटीना में मार्च करने जा रहा है जिसका शीर्षक है: "अर्जेंटीना की आधार टीम"

इससे यह जानना आसान हो जाएगा कि कौन सा वीडियो प्रत्येक अनुभाग से मेल खाता है।

छवि ब्लॉक

इस स्थिति में, सभी छवियों को IMGUR प्लेटफ़ॉर्म पर अपलोड किया जाना चाहिए: https://imgur.com/upload

और फिर उन छवियों के लिंक पास करें। आदर्श यह है कि छवियों को वीडियो के समान रखा जाए, जिन्हें 1, ए 2, 3 और इसी तरह से चिह्नित किया गया हो। उदाहरण के लिए, आइए कल्पना करें कि दक्षिण अफ्रीका में हमारे पास उड़ने पर 4 छवियां हैं। इन चारों का एक ही नाम है: "sudafrica.jpg"। ठीक है, हम क्रमिक नामों को उस बिंदु पर रखते हैं जहां वे लेआउट में होंगे और हम उस संख्या को उस कागज पर पेंट करते हैं जिससे वे मेल खाते हैं। उदाहरण:

  • Sudafrica-1.jpg
  • Sudafrica-2.jpg
  • Sudafrica-3.jpg
  • Sudafrica-4.jpg

बटन, शीर्षक और पाठ ब्लॉक

अंत में, इन ब्लॉकों को एक वर्ड डॉक्यूमेंट में, या Google डॉक्स में अधिमानतः लिखा जाना चाहिए।

प्रारूप बहुत सरल है: वर्ड डॉक्यूमेंट में हम उस ब्लॉक (टाइटल, बटन या टेक्स्ट) के प्रकार को डालते हैं, जिसके बाद वह लेआउट में अनुरूप होगा।

Ejemplos:

  • शीर्षक 1:…।
  • शीर्षक 2:…
  • पाठ 1:…
  • पाठ 2:…
  • बटन 1:…
  • बटन 2:…

फिर मैंने पूरी तरह से यादृच्छिक ग्रंथों के साथ एक उदाहरण दस्तावेज़ रखा ताकि यह देखा जा सके कि 4 छवि के उदाहरण के बाद यह कैसे संरचित किया जाएगा:

इस तरह से लेआउट को एक बार देखना चाहिए जब हमने प्रत्येक खंड के अनुरूप संख्याएँ डाल दी हों:

छवि 6

4 चरण: सभी भेजें

एक बार जब हमने सब कुछ कर लिया, तो आपको बस उस व्यक्ति को भेजना होगा जो लेआउट का प्रभारी होगा

यह बस ले जाएगा

  1. लेआउट के साथ कागज पर स्केच
  2. सामग्री
    • YouTube या WeTransfer के वीडियो लिंक
    • छवियों के IMGUR लिंक
    • Google डॉक्स या वर्ड फ़ाइल में दस्तावेज़ का लिंक

नोटरी महत्वपूर्ण अंतिम

आदर्श अंत में एक उत्कृष्ट छवि को शामिल करना होगा जो वह है जो पृष्ठ के शीर्षक 1 हेडर के साथ होगा। यही कारण है कि शीर्षक 1 हमेशा शुरुआत में दिखाई देना चाहिए।

हेडर इमेज में 960 x 540 पिक्सेल का आकार होना चाहिए। इस चित्र को शेष चित्रों की तरह, IMGUR द्वारा भेजा जा सकता है

अंतिम परिणाम

और अंत में इस सारी जानकारी के साथ, पेज सेट हो जाएगा। इस उदाहरण के साथ समाप्त करने के बाद, अंतिम परिणाम के साथ पृष्ठ, जो कि हमने पहले उठाए गए सभी मापदंडों का पालन करेगा, यह होगा:

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