वेब विकास और डिजाइन 101

web_development_101वेब विकास और डिजाइन की मूल बातें जानना चाहते हैं? बहुत बढ़िया…


लेकिन विचार की इस पंक्ति के साथ एक समस्या है, या उनमें से कई वास्तव में…

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

इस सबका उत्तर दें वेब विकास और डिजाइन के लिए शुरुआती मार्गदर्शिका.

[बिगड़ने की चेतावनी। हां, आप अपने पहले प्रयास में एक गुणवत्ता वेबसाइट बना सकते हैं।]

Contents

इस गाइड में क्या शामिल है?

ठीक है, पहले चीजें, हमें खुशी है कि आप पढ़ते रहे हैं और आपने वेब विकास को एक कोशिश देने का फैसला किया है! यहां बताया गया है कि यह कैसे खेलने वाला है:

अध्यायों को बहुत सरल तरीके से प्रस्तुत किया जाता है, बाईं ओर मुख्य सामग्री और दाईं ओर कार्रवाई करने योग्य आइटम। इस तरह:

गाइड परिचय: अध्याय 1

अब, आगे कैसे बढ़ें:

  • जबकि आपके 1 पढ़ने पर: हम आपको पूरी बात ऊपर से नीचे तक पढ़ने की सलाह देते हैं। यह आपको विषय के बारे में 10,000 फीट का एक अच्छा दृश्य देगा और आपको इसके सबसे महत्वपूर्ण हिस्सों को समझने में मदद करेगा। यह आपको व्यक्तिगत कार्यों को संभालने के लिए बुनियादी उपकरण और तरीके भी प्रदान करेगा.
  • जबकि अपने 2 पर पढ़ा और आगे: टीओसी का उपयोग करें और उस हिस्से पर आशा करें जो आपकी सबसे अधिक रुचि रखता है। इसके अलावा, हर अध्याय के आगे शेयर बटन का उपयोग करने के लिए स्वतंत्र महसूस करें, और या तो अपने आप को या अपने दोस्तों / अनुयायियों को लिंक भेजें जो रुचि रखते हैं.

तैयार? अध्याय 1 पर जाएँ.

इसके लिए कौन गाइड है?

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

इसके अलावा, आपको आरंभ करने के लिए किसी भी पूर्व तकनीकी ज्ञान की आवश्यकता नहीं है (मूल “वेब कौशल” के अलावा)। इस गाइड का पूरा बिंदु वेबसाइटों के निर्माण और वेब विकास सीखने में रुचि रखने वाले सभी लोगों के लिए “101” पाठ्यक्रम का एक प्रकार होना है.

यहां कुछ सामान्य कारण बताए जा रहे हैं जिनकी आपको रुचि हो सकती है:

  • 1. आपने अपने व्यवसाय के लिए एक वेबसाइट की आवश्यकता है (और आप यह देखना चाहते हैं कि क्या आप इसे स्वयं बना सकते हैं).
  • 2. आप जुनून या अस्थायी ब्याज से बाहर वेब विकास करना चाहते हैं (इसके बारे में कुछ भी बुरा नहीं है).
  • 3. आपने स्कूल के लिए एक वेबसाइट की आवश्यकता है.
  • 4. आप अपनी वेबसाइट को ऑनलाइन करने के लिए किसी मित्र या परिवार के सदस्य की मदद कर रहे हैं.

मुख्य आइडिया जो हमें मार्गदर्शित करने वाला है

यह महत्वपूर्ण है! और अगर आप इसे पढ़ने वाले एक उन्नत वेब डेवलपर हैं, तो कृपया हमारे लिए पागल न हों, लेकिन मुख्य विचार जो इस पूरे वेब विकास और 101 संसाधन को डिजाइन करने में हमारा मार्गदर्शन करने वाला है:

“कम से कम प्रतिरोध दृष्टिकोण”

यहाँ कम से कम प्रतिरोध दृष्टिकोण के तीन सिद्धांत दिए गए हैं:

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

अध्याय 1: योजना

आपका विचार, वेबसाइट का प्रकार, डोमेन नाम और होस्टिंग.

वेबसाइट सेट करने से पहले, आपको एक योजना की आवश्यकता होगी

विडंबना यह है कि यह लग सकता है – 80 के दशक के हिट शो “ए-टीम” ने हमें सिखाया है, एक अच्छी योजना एक है सफलता की कुंजी.

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

आप चाहते हैं कि आपकी वेबसाइट कमाल की हो। आप शायद जानते हैं कि यह कुछ हद तक कैसा दिखने वाला है। या हो सकता है कि आपके पास भी सही लोगो तैयार हो.

परंतु…

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

इसके बजाय, निम्नलिखित के बारे में सोचें:

  1. अपने आप को किसी भी तकनीकी लक्ष्य से अलग करें. उदाहरण के लिए, वेबसाइट प्रौद्योगिकियों या कुछ वेबसाइट सॉफ़्टवेयर सीखने का लक्ष्य.
  2. अपने आप से एक मुख्य प्रश्न पूछें: “मुझे साइट के लिए क्या चाहिए?”

यह आपके बारे में नहीं है, यह साइट के लक्ष्य के बारे में है.

प्रश्न आपको अपनी वेबसाइट सेट करने से पहले खुद से पूछना चाहिए

  1. साइट को प्राप्त करने के लिए क्या है?
  2. साइट के माध्यम से प्रस्तुत की जाने वाली मुख्य “चीज़” क्या होगी? (जैसे आपका व्यवसाय, एक उत्पाद, आपके ब्लॉग पोस्ट आदि)
  3. क्या वेबसाइट का कोई विशेष उद्देश्य होगा? (उदा। एक ईकामर्स स्टोर, एक फोटोग्राफर का पोर्टफोलियो इत्यादि)
  4. लक्षित दर्शक कौन है?
  5. वे साइट के विषय में क्यों रुचि रखते हैं?
  6. व्यक्तिगत दर्शकों के सदस्यों के लिए साइट क्या दर्द का समाधान करती है?

इन अंतिम 3 प्रश्नों के बारे में, एक मिनट के लिए दर्शकों की बात करें …

वेबसाइट निर्माण के लिए 2 मुख्य नियम हैं। यहाँ नियम # 1 है:

 पाठक / आगंतुक पहले आते हैं। वे मुख्य व्यक्ति हैं जिन्हें आपकी वेबसाइट को खुश करना है.

एक तरह से, आपकी वेबसाइट आपकी नहीं है। यह उनका है.

(नियम # 2 हम एक मिनट में चर्चा करेंगे)

इस सरल दिशानिर्देश के बारे में भूल जाने से आप पूरी तरह से गलत तरीके से आगे बढ़ सकते हैं, यहां तक ​​कि उस बिंदु तक जहाँ आप खुद को एक ऐसी वेबसाइट के साथ पाते हैं जो आपके आस-पास के सभी लोगों को भ्रमित करती है लेकिन आप.

“ओह! लोग बस यह नहीं समझ पा रहे हैं कि यह साइट किस बारे में है। वे इतने अज्ञानी कैसे हो सकते हैं ?! – आप सोच समझ कर खत्म करें। लेकिन जैसा कि यह पता चला है, अज्ञानी आप थे.

इससे बचने का एक ही तरीका है कि आप अपनी वेबसाइट को पाठक के साथ गेट-गो से सही तरीके से बनवाएं.

तो … कागज के उस टुकड़े को लें, और ऊपर दिए गए सभी सवालों के जवाब दें.

एक बार जब आप काम कर लेते हैं, तो आपके पास अपने दिशानिर्देशों का अंतिम सेट होता है, जिन्हें आप अपनी वेबसाइट पर काम करते समय करते हैं.

उन उत्तरों को एक असाधारण शक्तिशाली उपकरण के रूप में आप के साथ जाना होगा। जब भी आप अपनी वेबसाइट से संबंधित किसी निर्णय का सामना करेंगे, आप उनके पास वापस आ सकेंगे.

क्या आपको * ये * या * वो * करना चाहिए? उत्तर पुस्तिका पर जाएं और पता करें। क्या आपको विस्तृत या संकीर्ण साइडबार का उपयोग करना चाहिए? उत्तरों पर जाएं, पता करें कि लक्ष्य पाठक के साथ प्रतिध्वनित होने की अधिक संभावना है। और आदि.

डोमेन नाम और वेब होस्टिंग

यदि आप एक वेबसाइट के मालिक बनना चाहते हैं, तो आपको एक डोमेन नाम और एक वेब होस्ट की आवश्यकता है.

ठीक है, ठीक है, तकनीकी रूप से, आप अपने कंप्यूटर पर सभी के लिए एक परीक्षण वेबसाइट का निर्माण कर सकते हैं और फिर इसे स्थानीय वेबसर्वर (आपके कंप्यूटर पर सॉफ़्टवेयर के रूप में स्थापित) से चला सकते हैं, लेकिन यह 99% के लिए उपयोग करने योग्य समाधान नहीं होगा मामलों, तो चलो इसे छोड़ दें.

तो, एक मेजबान और एक डोमेन …

यहां बुरी खबर यह है कि वे दोनों पैसे खर्च करते हैं.

अच्छी खबर … यह चीजों की भव्य योजना में इतना पैसा नहीं है। साथ ही, जैसा कि आप सीख रहे हैं, आप एक डोमेन नाम पर और एक एकल वेब होस्ट के तहत कई छोटी वेबसाइटों को भी लॉन्च कर सकते हैं.

लेकिन शुरुआत में शुरू होने दें.

वेब होस्ट:

  • सरल शब्दों में, एक वेब होस्ट वह जगह है जहां आपकी वेबसाइट बैठती है, और जहां आपके आगंतुक इसे पा सकते हैं। एक तरह से, वेबसाइटों के लिए वेब होस्ट मनुष्यों के लिए अपार्टमेंट की तरह हैं। हुड के तहत, वेब होस्ट वे कंपनियां हैं जो अपने सर्वर को पैसे के बदले किराए पर देती हैं (… आपकी वेबसाइटों के लिए छोटे अपार्टमेंट).
  • आरंभ करने के लिए, एक मानक साझा होस्टिंग योजना करेगी। आप $ 3 / महीने के रूप में कम के रूप में शुरू करने के लिए कुछ भी प्राप्त कर सकते हैं। यहाँ लोकप्रिय वेब होस्ट्स की एक अच्छी तुलना है। इसे देखें और तय करें कि उनमें से कौन सी कंपनी आपके लिए सही है। हालाँकि, हमारी सिफारिशें SiteGround, A2 Hosting और Dreamhost के लिए जाती हैं.

डोमेन:

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

 

एक डोमेन नाम चुनने के लिए सुझाव और सुझाव

ठीक है, इसलिए कुछ डोमेन रजिस्ट्रार के पास जाना और वास्तव में डोमेन खरीदना एक बात है, लेकिन आप सही डोमेन नाम कैसे चुनते हैं?

स्कूलों की एक जोड़ी है:

  • ब्रांडेड डोमेन नाम. वे डोमेन हैं जिनमें गैर-मौजूद शब्द हैं। सोचें, Google.com या Yahoo.com जैसी चीजें। इससे पहले कि कंपनियां साथ आए, उन शब्दों का मतलब कुछ नहीं था। एक ब्रांडेड डोमेन नाम का उल्टा यह है कि यह … अच्छी तरह से, उच्च ब्रांडेड, यादगार और दूसरों के लिए आपकी साइट को अलग करना आसान है।.
  • कीवर्ड-आधारित नाम. वे मौजूदा शब्दों से मिलकर बने होते हैं, जिन्हें एक क्रम में रखा जाता है जो साइट के उद्देश्य का वर्णन करता है। सोचिए, Pizza.com, या StartBloggingOnline.com जैसी चीजें। इस तरह एक डोमेन नाम के साथ, आपके आगंतुक उस वेबसाइट की सही-सही भविष्यवाणी कर सकेंगे, जिस पर वे आने वाले हैं। नकारात्मक पक्ष यह है कि वे डोमेन आमतौर पर कम ब्रांडेड हैं.
  • संयुक्त नाम. उन ब्रांडेड डोमेन और कीवर्ड-आधारित डोमेन को एक साथ रखा जाता है। सोचो, Facebook.com, या Copyblogger.com। इस तरह के नाम आगंतुक को वेबसाइट की प्रकृति के “कुछ” भाग का सुझाव देते हैं, लेकिन वे अभी भी अत्यधिक ब्रांड योग्य हैं.

आपके द्वारा चुने गए डोमेन प्रकार की परवाह किए बिना कुछ सामान्य दिशानिर्देश:

  • डोमेन को याद रखना आसान बनाएं.
  • इसे छोटा और सरल बनाएं. डोमेन जितना लंबा होता है, उतना ही भ्रामक होता है.
  • एक .com प्राप्त करें (यदि संभव हो तो). .Com मुख्य “शीर्ष-स्तरीय डोमेन” उपलब्ध है। किसी और चीज़ के लिए समझौता न करें.
  • हाइफ़न से बचने की कोशिश करें. “Cake-recipes.com” के बजाय “cakerecipes.com” जैसे एकल-ब्लॉब फ़ॉर्म में अपना नाम प्राप्त करें

इस अध्याय के बाद तैयार होने वाली चीजें:

  • एक डोमेन नाम.
  • एक वेब होस्ट.
  • आपके उत्तर की शीट – आपकी साइट के लक्ष्य और यह दर्शकों की सेवा के लिए कैसा है.

क्या और मदद चाहिये? यहाँ आप के लिए आगे पढ़ने है:

  • क्यों साझा की मेजबानी? तुलना में मुख्य प्रकार के मेजबान
  • 10 चीजें जो वेब होस्ट को अच्छा बनाती हैं
  • सही डोमेन नाम चुनने के लिए 12 नियम
  • एक व्यापक वेबसाइट योजना गाइड

अध्याय 2: डिजाइनिंग और वायरफ्रेमिंग

अपनी वेबसाइट की संरचना के साथ एक कागज और कलम और खरोंच लें

ठीक है, डिजाइन चरण दर्ज करें.

सबसे पहले सबसे पहले, यहाँ हम जिस काम की नीति पर चलने जा रहे हैं, वह है:

  • जब तक हम कर सकते हैं तब तक हम पेन और पेपर का उपयोग कर रहे हैं, और उसके बाद ही कंप्यूटर पर स्विच करें। हमारा विश्वास करो, कागज पर अपने डिजाइन पर काम करने में बिताया गया हर मिनट एक घंटे का समय है जब आप कंप्यूटर पर चीजों को ट्यून करना शुरू करते हैं.
  • हम पुनरावृत्त कार्य कर रहे हैं … हम करते हैं »परिणामों की जांच करें» सुधारें »परिणामों की जांच करें» जब तक किया दोहराएं.

अध्याय 1 में, हमने कुछ ऐसा उल्लेख किया है जिसे हमने वेबसाइट निर्माण का नियम # 1 कहा है। अब नियम # 2 का समय है:

वेबसाइट निर्माण के नियम # 2:

पहले सामग्री पर विचार करें.

सामग्री वह है जो एक वेबसाइट पर मायने रखती है। डिजाइन नहीं। सामग्री.

लोग कंटेंट के लिए आते हैं। वे डिजाइन के लिए नहीं आते हैं। सामग्री वितरित करने के लिए डिज़ाइन केवल एक वाहन है.

कभी भी शुरू न करें कि आपकी वेबसाइट कैसी दिखती है। सामग्री के साथ शुरू करो। सामग्री। सामग्री। सामग्री.

तो हमें “सामग्री” से क्या मतलब है? संक्षेप में, यह वह चीज है जो लोग आपकी वेबसाइट से प्राप्त करना चाहते हैं। यदि आप एक फ़ोरम, समाचार लेख, आपके व्यवसाय की पेशकश और आदि का निर्माण कर रहे हैं, तो ब्लॉग पोस्ट, स्टोर में उत्पाद, फ़ोरम थ्रेड्स.

“वास्तव में? वास्तव में यह कोई बात नहीं है? ” – तुम पूछो.

इसके बजाय हम इसे पीट रहे हैं, इस पृष्ठ को देखें:

सरल वेबसाइट

यह सरल वेब पेज अब तक का सबसे अच्छा विवरण है कि डिजाइन क्या है और यह किस उद्देश्य से ऑनलाइन कार्य करता है.

तो याद रखें, पहले सामग्री!

वेबसाइट की सामग्री और संरचना

ठीक है, इसलिए चूंकि सामग्री सबसे महत्वपूर्ण चीज है, इसलिए आपको पहले से तैयार होने की आवश्यकता है (अधिकांश)। या कम से कम, आपको इस बात की अच्छी जानकारी होनी चाहिए कि वहाँ कितनी सामग्री है और किस रूप में है.

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

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

सोचिए, वेबसाइट पर अपनी सामग्री को व्यवस्थित करने का सबसे प्रभावी तरीका क्या है?

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

उदाहरण:

सामग्री संरचना

स्क्रैच टुगेदर एक वायरफ्रेम

वेब डिज़ाइन में वायरफ्रेम केवल एक पृष्ठ योजनाबद्ध या ब्लूप्रिंट है – एक दृश्य गाइड जो एक वेबसाइट के ढांचे का प्रतिनिधित्व करता है (विकिपीडिया हमें बताता है).

वायरफ्रेम कमाल के हैं! हम उनका उपयोग उन अधिकांश चीजों के लिए करते हैं जो हम ऑनलाइन प्रदर्शित करने के लिए करते हैं। उदाहरण के लिए, यहां इस गाइड के लिए वायरफ्रेम दिया गया है:

एक साथ एक वायरफ्रेम खरोंच

जैसा कि आप देख सकते हैं, फिर से, वह कागज पर है। भले ही इस तरह के काम के लिए कई ऐप हैं, हम वास्तव में इनका उपयोग करने की सलाह नहीं देते हैं। वे प्रो डिजाइनरों के लिए महान हो सकते हैं, लेकिन एक शुरुआती या एक मध्यवर्ती व्यक्ति केवल उन्हें सीखने में समय खो देगा, और अंत में, वे पेन और पेपर के माध्यम से जो हासिल करेंगे उस पर बहुत सुधार नहीं होगा।.

तो, वायरफ्रेम कैसे करें?

यदि आप शुरुआत करते हैं तो, दो दृष्टिकोण हैं:

  • यदि आप मजबूत महसूस कर रहे हैं, तो प्रवाह के साथ जाएं और बस दूर रहें (हमेशा सही समाधान नहीं).
  • ठीक से वायरफ्रेम कैसे करें (आमतौर पर बेहतर) पर कुछ त्वरित ज्ञान प्राप्त करें.

बाद के लिए, यहां जाएं – एक महान मार्गदर्शक.

(प्रत्येक महत्वपूर्ण प्रकार के पृष्ठ का वायरफ्रेम बनाना सुनिश्चित करें जिसे आपने पिछले चरण में सूचीबद्ध किया है।)

इस अध्याय के बाद तैयार होने वाली चीजें:

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

आगे की पढाई:

  • वेबसाइट सामग्री की योजना बनाने के लिए 9 कदम
  • वेब डिजाइन के लिए नया? यहाँ से प्रारंभ करें.

अध्याय 3: UX और UI

उपयोगकर्ता अनुभव और उपयोगकर्ता इंटरफ़ेस के महत्व को कभी भी कम न समझें

जैसे, यूजर एक्सपीरियंस और यूजर इंटरफेस.

WebDesignerDepot हमें दो की बजाय काव्यात्मक परिभाषा देता है:

यूआई काठी, रकाब और शासनकाल है.

UX वह भावना है जो आपको घोड़े की सवारी करने में सक्षम बनाता है, और आपके मवेशियों को रस्सी देता है.

अधिक व्यावहारिक परिभाषा के लिए:

  • यूआई वह है जो उपयोगकर्ता आपकी साइट पर देखने पर देखता है.
  • UX है कि वे इसके बारे में कैसा महसूस करते हैं.

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

UX और UI दोनों डिज़ाइन अपने आप में बड़े विषय हैं, और इसमें बहुत सारे छोटे तत्व हैं जो अंतिम परिणाम में भूमिका निभाते हैं.

संक्षेप में, यदि आप अभी अपनी यात्रा शुरू कर रहे हैं तो बहुत कुछ सीखना है.

इसलिए हमारे बजाय यहाँ एक पूरे यूएक्स और यूआई डिज़ाइन पाठ्यक्रम को क्रैम्प करने की कोशिश करें, आइए हम मुट्ठी भर महत्वपूर्ण तत्वों को इंगित करते हैं, और फिर आपको आगे पढ़ने के लिए कहीं और भेजते हैं।.

उपयोगकर्ता लक्ष्य

UX उपयोगकर्ता के लक्ष्यों के बारे में है … आपके लक्ष्यों से अधिक नहीं … उपयोगकर्ता के लक्ष्य.

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

यह आगंतुक के लक्ष्य में कैसे परिवर्तित होता है? … वह कौन सी चीज है जिसे आगंतुक आपकी साइट पर आने पर प्राप्त करना या प्राप्त करना चाहता है? यही उनका लक्ष्य है.

कितना आसान है उन लक्ष्यों को प्राप्त करना?

अगला, निम्नलिखित प्रश्न पर ध्यान दें:

  • क्या आगंतुक अपने लक्ष्य को आसानी से प्राप्त कर सकता है? – क्या वे जानकारी के सटीक टुकड़े को प्राप्त कर सकते हैं जो वे सरल तरीके से लिए थे?

इसका उत्तर देने के लिए, आपको अपने वायरफ़्रेम, अपनी सामग्री संरचना और डबल-चेक चीज़ों पर वापस जाने की आवश्यकता है.

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

अनिवार्य रूप से, यहां, हम यह सुनिश्चित कर रहे हैं कि वेबसाइट आपके आगंतुकों को मूल्य प्रदान करे.

यह सब अपने आप पता लगाने के लिए कठिन है, यह नहीं है?

यह अत्यधिक अनुशंसित है कि आप इस अध्याय के “आगे पढ़ने” खंड में सूचीबद्ध संसाधनों की जाँच करें … लेकिन आप बोलने के लिए “एक हैक,” भी आज़मा सकते हैं।.

अर्थात्, जब आप उन वेबसाइटों पर जाते हैं जो आपके द्वारा बनाई गई वेबसाइट के समान हैं, तो आपको क्या निराशा होती है? हो सकता है कि कुछ ऐसी जानकारी हो जो साइट को भ्रामक बनाने वाले कुछ इंटरफ़ेस तत्व को प्राप्त करना या वास्तव में कठिन हो.

नोट्स लें, निष्कर्ष निकालें, अपनी वेबसाइट के साथ वही गलतियाँ न करें.

एक उपकरण के रूप में भावना का उपयोग करना

अपनी साइट के UI और UX पर काम करते समय, आप मूल रूप से किसके लिए लक्ष्य कर रहे हैं, यह आपके आगंतुक में एक निश्चित भावना का संचार कर रहा है।.

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

नौकरी के भावनात्मक भाग पर काम करने के लिए, सबसे अच्छे साधनों में से एक रंग है.

विभिन्न संस्कृतियों में रंगों के अलग-अलग अर्थ होते हैं। उन अंतरों को समझना आपके काम को बहुत आसान बना सकता है। यहाँ एक अच्छा धोखा पत्र है.

एक बार जब आप (संभवतः) उपयोग किए जाने वाले रंगों के बॉलपार्क में चाहते हैं, तो रंग के साथ काम करते समय यहां कुछ सामान्य दिशानिर्देश दिए गए हैं:

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

टाइपोग्राफी

कई मामलों में, टाइपोग्राफी वह जगह है जहाँ आप वेबसाइट निर्माण के खेल को जीतते हैं (या खोते हैं).

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

सिफारिश नहीं की गई.

इन दिनों, कस्टम फोंट के साथ काम करना uber-easy है, और आपको अपनी साइट पर उन कस्टम फ़िक्स को सक्षम करने के लिए कुछ भी तकनीकी करने की आवश्यकता नहीं है.

बड़े, भव्य टाइपोग्राफी इन दिनों फैशन में बहुत अधिक है, और यह एक डिजाइनर का काम भी करता है – विशेष रूप से शुरुआती डिजाइनर का काम – बहुत आसान है.

इस साइट की जाँच करें, उदाहरण के लिए:

बोनोबोस

कुछ भी नहीं देखा? हां, फोंट विशाल हैं, और वे बहुत अच्छे लगते हैं!

यहाँ इस पर काम करना है:

  • सामान्य तौर पर, हर वेबसाइट डिज़ाइन को दो प्रकार के पाठ की आवश्यकता होती है: शीर्षकों तथा पैराग्राफ. ज्यादातर मामलों में, प्रत्येक के लिए बस एक फ़ॉन्ट होगा.
  • Google फ़ॉन्ट्स पर जाएं – Google के स्वयं के मुफ्त लाइब्रेरी के फोंट जो आप अपनी वेबसाइट पर उपयोग कर सकते हैं – और एक हेडलाइन फ़ॉन्ट के लिए देखें जिसका आप वास्तव में आनंद लेते हैं.
  • फिर, उस फ़ॉन्ट का नाम लें, और इसे फॉन्ट जोड़ी पर देखें – यह पहले से बनाए गए फ़ॉन्ट जोड़े का एक पुस्तकालय है जो एक साथ चलते हैं.
  • ऐसी जोड़ी चुनें जो कमाल की दिखती हो.
  • दोनों फोंट के नामों को नीचे रखें, आपको बाद में उनकी आवश्यकता होगी.

इस तरह से करने से आपकी प्रक्रिया में तेजी आएगी और फिर भी आपको एक शानदार परिणाम मिलेगा.

उदाहरण के लिए, हमें Google फ़ॉन्ट में ब्री सेरिफ़ नामक एक फ़ॉन्ट मिला, जिसका हम बहुत आनंद लेते हैं:

ब्री-सेरिफ़

फिर, हम इसे फॉन्ट जोड़ी में ले गए, और साइट ने सुझाव दिया कि ब्री सेरिफ़ ओपन संस के साथ अच्छी तरह से चला जाता है। उत्तम:

ब्री-सेरिफ़-खुले बिना

अंतिम संरचना

अंत में, अंतिम चरण!

इस अध्याय का पूरा बिंदु एक अंतिम लेआउट / संरचना पर उतरना है जिसे आप अपनी साइट के लिए उपयोग करने जा रहे हैं। इस बिंदु पर, आपको उन चीजों के बारे में सुनिश्चित होना चाहिए जो आप अपने डिजाइन और यूआई के साथ करना चाहते हैं.

इस अध्याय के बाद तैयार होने वाली चीजें:

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

आगे की पढाई: 

  • यूएक्स पत्रिका
  • यूएक्स बूथ
  • वेब डिज़ाइन में रंग के पीछे मनोविज्ञान और भावना
  • उपयोगकर्ता अनुभव डिजाइन क्या है? अवलोकन, उपकरण, और संसाधन
  • एक वेबसाइट के लिए स्मार्ट व्यवसाय लक्ष्य निर्धारित करना
  • प्रभावी टाइपोग्राफी बनाने के लिए 8 नियम

अध्याय 4: वर्डप्रेस, HTML या टेम्पलेट?

तय करें कि किस मार्ग पर जाना है – सामग्री प्रबंधन प्रणाली या इसे खरोंच से कोड करें

यहां वह जगह है जहां असली, हाथ से गंदे, अंडर-हूड काम शुरू होता है!

यह संभवतः प्रक्रिया का सबसे कठिन हिस्सा है (इसे स्वीकार करें!).

एक बार के लिए, कलम और कागज को अलग रखने और कुछ सॉफ्टवेयर के साथ काम करने का सही समय है.

और गेट के ठीक बाहर, वहाँ एक टन सवाल है …

  • क्या मुझे HTML सीखना चाहिए?
  • सीएसएस के बारे में क्या?
  • क्या रेडीमेड HTML वेबसाइट टेम्प्लेट मेरे लिए ट्रिक करेंगे?
  • क्या मुझे PHP जैसी प्रोग्रामिंग लैंग्वेज सीखने की जरूरत है?
  • मैंने सुना है कि वर्डप्रेस इन दिनों साइट बनाने का तरीका है.
  • मैंने देखा कि स्क्वरस्पेस सुपर बाउल विज्ञापन। उसके साथ क्या है?
  • क्या बात है जूमला? या Drupal?
  • चलता रहा और चलता ही रहा.

उन सभी का जवाब हां में है.

जैसा कि, हाँ, आप या तो या उन सभी चीजों को कर सकते हैं, और यह केवल आप पर निर्भर करता है कि आपको कौन सा रास्ता चुनना है.

हम जो कहना चाहते हैं, वह यह है कि यहां कोई # 1 सबसे अच्छा तरीका नहीं है। यह सब इस बात पर निर्भर करता है कि आप वेब डेवलपमेंट के साथ कितना जुड़ना चाहते हैं, वेबसाइट बिल्डिंग बेसिक्स कितना सीखना चाहते हैं, आपको कितनी जल्दी क्वालिटी साइट की जरूरत है, और आप कितना कस्टमाइज़ करना चाहते हैं।.

तो यहां बताया गया है कि हम इस अध्याय को आगे कैसे आगे बढ़ाएंगे। प्रथम, आपको सबसे अच्छा परिभाषित करने वाला व्यक्तित्व चुनें:

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

उत्तर दिया गया a)? अध्याय 5 पर जाएं.

उत्तर दिया b)? अध्याय 6 पर जाएं.

उत्तर दिया ग)? इस लेख को देखने के लिए स्वतंत्र महसूस करें और फिर वापस आएं (इससे आपको सही रास्ता चुनने में मदद मिलेगी):

  • 8 सर्वश्रेष्ठ ब्लॉगिंग और वेबसाइट बिल्डिंग प्लेटफ़ॉर्म की समीक्षा की गई … प्रत्येक प्लेटफ़ॉर्म को इसके पेशेवरों और विपक्षों के साथ वर्णित किया गया है, और संसाधन आपकी विशिष्ट आवश्यकताओं के लिए सर्वोत्तम उपलब्ध विकल्प (Wix या SB) का भी सुझाव देता है।.

क्या तुमने यह पढ़ा? महान! तो उपरोक्त में से कौन सा व्यक्ति आपको सबसे अच्छा वर्णन करता है – ए) या बी)?

रास्ते में काम आने वाले उपकरण:

  • ग्राफिक्स: पेंट.नेट, जिम्प, पिक्सलर.
  • कोड लेखन: नोटपैड ++, टेक्स्टवंगलर, सबलाइमटेक्स्ट.
  • कार्य प्रबंधन: ट्रेलो.
  • डिजाइन: रंग योजनाएं, Google फ़ॉन्ट्स, उपकरण यहां से.
  • फ़ोटोग्राफ़ी: अनप्लैश, ऑल द फ़्रीस्टॉक

अध्याय 5: HTML, CSS का परिचय & जावास्क्रिप्ट

वेबसाइटें एक अंतर्निहित वास्तविकता कैसे हैं

इस अध्याय में, हम वेब विकास के नंगे मूल सिद्धांतों को इंगित करने जा रहे हैं, सबसे महत्वपूर्ण शब्दों को समझाते हैं, और फिर आपको कुछ विशिष्ट संसाधनों पर भेजते हैं, जहाँ आप अपने ज्ञान और कौशल को आगे बढ़ा सकते हैं।.

एचटीएमएल

HTML वेबसाइटों की भाषा है। हर वेबपेज किसी न किसी बिंदु पर HTML में बनाया या परिवर्तित किया जाता है.

उदाहरण के लिए, आपके द्वारा पढ़े जा रहे इस बहुत ही मार्गदर्शक के HTML ढांचे को देखने के लिए, बस अपने कीबोर्ड पर “Ctrl + U” दबाएं.

HTML आपके द्वारा देखे गए प्रत्येक ब्लॉक को एक वेबपेज पर परिभाषित करता है। दिन के अंत में, वेबपृष्ठ पर कुछ भी प्रदर्शित करने के लिए, इसे HTML में बदलना होगा.

HTML को प्रभावी ढंग से सीखने के लिए, हम आपको सलाह देते हैं कि आप वेब पर उपलब्ध (निःशुल्क या सशुल्क) पाठ्यक्रमों में से एक के लिए साइन अप करें। कुछ सबसे अच्छे कोडिएकडेमी या ट्रीहाउस में देखे जा सकते हैं.

उदाहरण के लिए, यहां HTML और CSS के बारे में सभी कोडएड अकादमी पर एक विशिष्ट अनुभाग दिया गया है.

कोड अकादमी का मुखपृष्ठ

ताकि HTML के लिए एक व्यापक दृष्टिकोण हो.

सीएसएस

सीएसएस – उबाऊ तकनीकी विवरण को छोड़ने के लिए – एक वेबपेज पर दिखाई देने वाली हर चीज को स्टाइल करने के लिए जिम्मेदार है.

CSS HTML टैग्स और फिर स्ट्रक्चर्स लेता है और उन्हें स्टाइल जोड़ता है। जैसी चीजें: बोल्ड टेक्स्ट, रंग समायोजन, छाया, लेआउट, यहां तक ​​कि एनिमेशन, अब सीएसएस के साथ मुख्य रूप से किए जाते हैं.

यह कैसे काम करता है की एक बेहतर समझ के लिए, इस त्वरित पाठ्यक्रम पर Codeacademy पर हॉप.

अधिक गहराई से सीखने के लिए, कोडेक्स वर्गों को या तो कोडएकेडमी या ट्रीहाउस पर भी देखें.

जावास्क्रिप्ट, jQuery, बूटस्ट्रैप, आदि.

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

ध्यान में रखते हुए, jQuery एक जावास्क्रिप्ट पुस्तकालय है जो आपको कम कोडिंग के साथ उन्नत चीजें बनाने की अनुमति देता है। एक वेब डेवलपर के लिए बहुत आसान है। यहाँ और जानें.

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

लेकिन यह नहीं है बस इस स्टार्टर कोर्स को कोडियाकैडमी में देखें (वैसे, यह मूल रूप से हमने बूटस्ट्रैप सीखा है).

इस अध्याय के बाद तैयार होने वाली चीजें:

  • असल में, आपके HTML / CSS वेबसाइट का पहला ड्राफ्ट पूरी तरह से बनाया गया है। वहां से, आप अंतिम परिणाम को पुनरावृत्त करना और सुधारना शुरू कर सकते हैं.

अध्याय 6: वेबसाइट बिल्डिंग प्लेटफार्म

अपनी पहली साइट की स्थापना? वर्डप्रेस, जुमला या ड्रुपल जैसे मुफ्त वेबसाइट प्लेटफ़ॉर्म आज़माएं

अध्याय 6: वेबसाइट बिल्डिंग प्लेटफार्म

  • Squarespace
  • वर्डप्रेस
  • जूमला & Drupal

वहाँ अधिक वेबसाइट बिल्डरों की तुलना में आप पर एक छड़ी हिला कर सकते हैं। (यदि आप उस व्यक्ति की तरह हैं जो चीजों को हिलाता है।)

ठीक है, एक तरफ मजाक करता है.

स्पष्ट रूप से, यदि आप चीजों को हाथ से कोड करना सीखना नहीं चाहते हैं, तो वे निश्चित रूप से कई समाधान हैं जो आपकी मदद कर सकते हैं.

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

उन लोगों के साथ शुरू करना जो समझ में आसान हैं:

Squarespace

सुपर बाउल के दौरान विज्ञापन देने वाला एकमात्र वेबसाइट प्लेटफ़ॉर्म है.

संक्षेप में, एक बहुत ही आसान समाधान जो किसी के द्वारा उपयोग किया जा सकता है। कोई पूर्व कौशल की आवश्यकता नहीं है.

यह आपको क्लासिक वेबसाइट, ब्लॉग बनाने की अनुमति देता है, यहां तक ​​कि ईकामर्स स्टोर भी हमने उनके बारे में समीक्षा लिखी है। इंटरफ़ेस और इसे उपयोग करने की पूरी प्रक्रिया को समझना बहुत आसान है, साथ ही स्क्वरस्पेस लोग बहुत सारे दिलचस्प ट्यूटोरियल प्रदान करते हैं। उन्हें यहां देखें.

वर्डप्रेस

ईमानदारी से, हम वर्डप्रेस से प्यार करते हैं.

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

वर्डप्रेस एनीमेशन

इसके अलावा, यह वर्तमान में उन सभी का सबसे लोकप्रिय वेबसाइट प्लेटफॉर्म है। जैसा कि वर्डप्रेस – मैट मुलेनवेग के निर्माता द्वारा साझा किया गया है – वर्डप्रेस अब पूरे इंटरनेट का 25% हिस्सा है। क्या वे सभी लोग गलत हो सकते हैं?

ठीक है, इसलिए वर्डप्रेस के साथ शुरुआत करने के लिए आपको मूल रूप से केवल आपके डोमेन और होस्टिंग की आवश्यकता है। वर्डप्रेस सॉफ्टवेयर अपने आप में पूरी तरह से मुफ्त है.

शुरू करने के लिए, इन रास्तों में से किसी एक का अनुसरण करने के लिए स्वतंत्र महसूस करें:

क) “त्वरित आरंभ पथ”

  • वर्डप्रेस को स्थापित करने और एक दोपहर में अपनी साइट लॉन्च करने का सरल तरीका जानने के लिए यहां जाएं.
  • आधिकारिक निर्देशिका से एक मुफ्त थीम चुनें – यह सुनिश्चित करें कि यह आपके साइट लक्ष्यों के अनुरूप है, और यह कि लेआउट / डिज़ाइन आपकी इच्छित संरचना से दूर नहीं है (आप इसे थोड़ा समायोजित करने जा रहे हैं).
    • मौजूदा विषय को अनुकूलित करने का तरीका जानने के लिए इन दो संसाधनों की जाँच करें.
    • वैकल्पिक रूप से, आप एक बहुउद्देशीय प्रीमियम विषय चुन सकते हैं जिसे एक आसान उपयोगकर्ता इंटरफ़ेस (कोई कोडिंग शामिल नहीं) के माध्यम से समायोजित किया जा सकता है। एक्स थीम ऐसी चीज का एक अच्छा उदाहरण है.
  • अतिरिक्त सुविधाओं को प्राप्त करने के लिए कुछ सबसे लोकप्रिय और सर्वश्रेष्ठ प्लगइन्स स्थापित करें.

बी) “में गहराई पथ”

  • एक ऑनलाइन पाठ्यक्रम के माध्यम से वर्डप्रेस सीखना शुरू करें। ट्रीहाउस एक भयानक प्रदान करता है.
  • ऊपर के रूप में अपने विषय और प्लगइन्स उठाओ। वैकल्पिक रूप से, जमीन से अपनी खुद की थीम का निर्माण करें.

अंत में, वर्डप्रेस शायद बाजार पर सबसे बहुमुखी वेबसाइट प्लेटफॉर्म है। इसके साथ, आप लगभग किसी भी प्रकार की वेबसाइट का निर्माण कर सकते हैं, न केवल ब्लॉग या सरल व्यावसायिक साइटें। यहां वर्डप्रेस का उपयोग करने के लिए 47 (!) की एक सूची है, बस आपको सोचने के लिए.

जुमला और द्रुपल

यद्यपि एक-दूसरे से थोड़ा अलग है, अधिक उन्नत वेब परियोजनाओं के लिए जूमला और ड्रुपल दोनों उत्कृष्ट सामग्री प्रबंधन प्रणाली हैं.

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

कई बार, आपकी परियोजना की जटिलता के आधार पर, उन्हें मास्टर करने के लिए बहुत अधिक समय और उस पर बहुत अधिक प्रयास की आवश्यकता हो सकती है.

अधिक गहराई से प्रशिक्षण के लिए, Lynda.com पर भयानक पाठ्यक्रम हैं, जूमला और ड्रुपल दोनों के लिए.

इस अध्याय के बाद तैयार होने वाली चीजें:

  • आपकी वेबसाइट का पहला ड्राफ्ट पूरी तरह से बनाया गया है, भले ही आपने वर्डप्रेस या किसी अन्य प्लेटफॉर्म का उपयोग करने का फैसला किया हो.
  • सुनिश्चित करें कि यह आपके शुरुआती लक्ष्यों, लक्षित दर्शकों के अनुरूप है, और यह अच्छा UX वितरित करता है.

अध्याय 7: मोबाइल उत्तरदायी डिजाइन

वेब ब्राउज़ करने के लिए 60% से अधिक लोग मोबाइल और टैबलेट का उपयोग करते हैं

मोबाइल जवाबदेही अब वेबसाइट निर्माण का एक बहुत महत्वपूर्ण पहलू है, शायद इससे कहीं अधिक.

यहाँ पूरे मुद्दे के बारे में क्या है:

मूल रूप से, अभी, पहले से कहीं अधिक वेब का उपयोग करने के लिए मोबाइल उपकरणों का उपयोग करने वाले अधिक लोग हैं। वास्तव में, यह अनुमान है कि अब डेस्कटॉप इंटरनेट उपयोगकर्ताओं की तुलना में अधिक मोबाइल इंटरनेट उपयोगकर्ता हैं (75.1% बनाम 52.7%).

लेकिन एक समस्या है.

हर वेबसाइट का डिज़ाइन गेट के ठीक बाहर मोबाइल उपकरणों पर देखा जा सकता है.

कुछ सामान्य समस्याओं में शामिल हैं:

  • फोंट बहुत छोटा है,
  • लेआउट ही एक छोटी स्क्रीन के लिए बिल्कुल भी समायोजित नहीं,
  • या मोबाइल पर उपलब्ध नहीं होने वाली साइट के निर्माण के लिए उपयोग की जाने वाली तकनीक.

यह वह जगह है जहां मोबाइल जवाबदेही का विचार चलन में है.

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

यहाँ एक बेहतर व्याख्या है: क्या बिल्ली उत्तरदायी वेब डिज़ाइन है?

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

यदि समस्याएं हैं, तो आपको उन्हें ठीक करने की आवश्यकता है.

कुछ उपाय:

  • उत्तरदायी वेब डिजाइन – कैसे करने के लिए
  • लगभग 15 मिनट में वेबसाइट को कैसे उत्तरदायी बनाएं

अध्याय 8: यह सब एक साथ लाना

आप मूल बातें जानते हैं, अब आपकी बारी है

रुको, हम वहाँ लगभग हैं!

यह हमारी काफी लंबी यात्रा का अंतिम अध्याय है.

इस बिंदु पर, आपको अपनी पहली वेबसाइट बनानी चाहिए … चाहे वह वर्डप्रेस हो, हाथ से बनाया गया HTML / CSS, कुछ वेबसाइट बिल्डर, या आपके द्वारा चुने गए अन्य उपकरण।.

संक्षेप में, बधाई! लेकिन अभी भी कुछ बातें करने लायक है:

  • अध्याय 1 और 2 में जिन बातों पर हमने चर्चा की है, उनकी जाँच करें। सुनिश्चित करें कि लक्ष्य वास्तव में अंतिम-उपयोगकर्ता के लिए काम करते हैं, और यह कि वेबसाइट भ्रामक नहीं है.
  • W3C की मार्कअप सत्यापन सेवा के माध्यम से अपनी कोड संरचना को सत्यापित करें.
  • जाँच करें कि क्या साइट के साथ कोई सुरक्षा समस्याएँ तो नहीं हैं। उसके लिए सुकुरी द्वारा स्कैनर का उपयोग करें.
  • समुदाय से प्रतिक्रिया प्राप्त करें। जांचें कि अन्य लोग आपके काम के बारे में क्या सोचते हैं। Sitepoint पर फ़ोरम उस के लिए अच्छे हो सकते हैं.

यदि आपका यह पहला संसाधन है तो हम वास्तव में आपको इसे कुछ समय के लिए वापस आने के लिए प्रोत्साहित करते हैं और इसे आपकी आगे की शिक्षा के लिए एक संदर्भ फ़ाइल के रूप में मानते हैं।.

जैसा कि हमने शुरुआत में कहा, टीओसी का उपयोग करने के लिए स्वतंत्र महसूस करें और फिट होने पर अध्याय से अध्याय और संसाधन से संसाधन तक नेविगेट करें.

अंत में, हम उत्सुक हैं … जब वेबसाइट निर्माण, वेब विकास या डिजाइन की बात आती है तो आपकी सबसे बड़ी चुनौती क्या है? कृपया टिप्पणियों में या ट्विटर के माध्यम से साझा करें। हम सभी कान हैं!

पढ़ने के लिए धन्यवाद, आप बहुत बढ़िया हैं!

  • Total116
  • Facebook116
  • Twitter0
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map