एक वेब पेज कैसे करें

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

सामग्री

कदम

विधि 1
विधि 2

टिप्स
चेतावनी

कदम

विधि 1

तीन बुनियादी नियम

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

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

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

आप सोच सकते हैं, "अगर वह अच्छा लग रहा है, तो वे रहेंगे" लेकिन ऐसा हमेशा ऐसा नहीं होता है एक उदाहरण के रूप में रियल एस्टेट साइटें लें यहां आप एक ऐसी साइट देख सकते हैं जिसमें स्वच्छ और मजेदार डिज़ाइन है। इसमें कई सफेद रिक्त स्थान हैं जो इसे हाइलाइट किए गए लिंक के साथ 16: 9 स्क्रीन के लिए हवादार, मजबूत रंग और एक आधुनिक प्रारूप बनाते हैं:

सांता मोनिका अचल संपत्ति शीर्षक वाली छवि 1.jpg

इसके बजाय अब इस शैली पर विचार करें: यह भ्रमित और संकुचित, तटस्थ रंग और बहुत सारी घोषणाएं हैं

लगता है जो एक घर की तलाश में लोगों के लिए सबसे अच्छा काम करता है? वास्तव में, क्या वास्तव में घोषणाएं प्रकाशित करें! जब लोग देख रहे हैं "मिलन के केंद्र में बिक्री के लिए घर", साइट के सौंदर्यशास्त्र में रूचि नहीं रखते हैं वे संपत्ति के मालिक के बारे में जानकारी नहीं चाहते हैं, या शहर के खूबसूरत चित्रों को देख सकते हैं। वे घर देखना चाहते हैं

नियम # 3: अपने आप को सुनो. आप समझते हैं कि ग्राहक क्या चाहता है, और आप जानते हैं कि बाजार को कैसे पूरा किया जाए। अब यह आपके व्यक्तिगत विचारों के लिए समय है!

आपके द्वारा पसंद किए गए कार्यक्रम के साथ एक टेम्प्लेट बनाएं। अलग-अलग परतों पर (ताकि आप पूरे मॉडल को पुन: निर्माण किए बिना साइट के कुछ हिस्सों को संपादित कर सकें) पृष्ठ पर सम्मिलित किए जाने वाले तत्व बनाएं। इन तत्वों में निम्न शामिल हो सकते हैं:

हैडर. यह एक ऐसा तत्व है जो आपकी साइट के सभी पृष्ठों के लिए सामान्य होगा। शीर्षक में साइट का शीर्षक और लोगो होता है, और इसमें साइट के अन्य अनुभागों (जैसे: कंपनी की जानकारी, संपर्क विवरण, आदि) के लिंक शामिल होंगे। हैडर नेत्रहीन यह सब समूह करेगा और पृष्ठ को और अधिक कार्यात्मक बना देगा। मुख पृष्ठ के लिंक पर मेनू बार के पहले बटन को असाइन करने के लिए सामान्य अभ्यास है।

हम ऐप्पल साइट लेते हैं ,:

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

मेनू बार केवल एक गहरा रंग के साथ आईपैड बटन दिखाता है।

पृष्ठ का विषय ऊपरी बाईं ओर बड़े काले अक्षरों में है

उत्पाद के बारे में जानकारी के साथ एक नया उप-मेन्यू बार प्रकट होता है यदि आप इनमें से किसी एक बटन पर क्लिक करते हैं, तो आप देखेंगे कि पृष्ठ आपको विषय से संबंधित नई सामग्री प्रदान करेगा, लेकिन शैली और लेआउट को बनाए रखेगा।

कई मामलों में, मेनू पट्टी के माध्यम से प्रवेश किए जा सकने वाले प्रत्येक पेज को कई उप-श्रेणियों की आवश्यकता होगी द्वितीयक मेन्यू बार बनाने के बजाय, आप संगीतकार के मित्र से इस उदाहरण की तरह एक पॉप-अप मेनू का उपयोग कर सकते हैं:

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

और जो लोग बेचते हैं उनके लिए दूसरा ध्यान दें कि फ़ोकस पूरी तरह से स्थानांतरित हो गया है, भले ही यह समान जानकारी हो, और बार के समान अंक पर प्रकट होता है:

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

फ़ुटबाल. यह एक ऐसा तत्व है जो हर साइट में मौजूद नहीं है, क्योंकि सभी को इसकी आवश्यकता नहीं है। यह अक्सर उन वस्तुओं के लिए उपयोग किया जाता है जो अन्यथा आदेशित और स्पष्ट इंटरफ़ेस को भ्रमित कर सकते हैं या साइट के उन हिस्सों तक पहुंच की अनुमति प्रदान कर सकते हैं, जिन पर उपयोगकर्ता का ध्यान केंद्रित नहीं है। यहाँ एक उदाहरण Groupon साइट से लिया गया है:

विधि 2

दिशा-निर्देश

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

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

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

दो या तीन मुख्य रंगों के लिए सीमित और सुनिश्चित करें कि वे अच्छी तरह से संयोजित करते हैं

बहुत अधिक अक्षरों या आकारों का उपयोग करने से बचें - अगर आपने कुछ के बीच वैकल्पिक का निर्णय लिया है, तो सुनिश्चित करें कि आप उन्हें प्रत्येक पृष्ठ के लिए एक ही अंत से उपयोग करते हैं।

साइट की उपस्थिति का प्रबंधन करने के लिए कैस्केडिंग स्टाइल शीट्स (सीएसएस) का उपयोग करें, और इसे वर्दी बनाएं यह उन चीज़ों को बदलने में भी आसान होगा जो प्रत्येक पृष्ठ के लिए ऐसा करने के बिना केवल एक ही फिक्स वाले कई पृष्ठों के लिए समान हैं।

यह विशेषाधिकार पठनीयता। अपने पाठ को पढ़ने में आसान बनाने के लिए, इसे छोटे खंडों में विभाजित करें

प्रत्येक अनुभाग को अलग करने के लिए उपशीर्षक और उचित दूरी का उपयोग करें।

विषयों के पदानुक्रम और महत्व को दिखाने के लिए बोल्ड या भिन्न आकार के वर्णों का उपयोग करें

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

अपनी साइट को सभी के लिए पठनीय बनाएं मानक एचटीएमएल का प्रयोग करें और टैग्स, फीचर्स और प्लग-इन से बचें जो केवल कुछ ब्राउज़रों या उनके कुछ संस्करणों के लिए उपलब्ध हैं।

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

अपनी वेबसाइट का परीक्षण करें सुनिश्चित करें कि "हर लिंक काम करता है" जैसा कि यह होना चाहिए, और यह कि छवियां सही तरीके से दिखाई दें।

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

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

टिप्स

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

चेतावनी

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

सामाजिक नेटवर्क पर साझा करें:

संबद्ध