chapter 1 WD

  

Chapter 1 Introduction To WebDesign

                वेब डिजाइन इंटरनेट पर डिस्प्ले होने वाली वेबसाइटों के उद्देश्य के बारे मे बताता है| यह आमतौर पर सॉफ्टवेयर डेवलपमेंट के बजाए वेबसाईट डेवलपमेंट के यूसर्स स्किल को दिखाता है|

वेब डिज़ाइन इलेक्ट्रॉनिक फ़ाइलों के संग्रह को इकट्ठा करने, योजना बनाने और निर्माण करने की एक प्रक्रिया है जो लेआउट, कलर, टेक्स्ट स्टाइल, स्ट्रक्चर, ग्राफिक्स, इमेज और इंटरैक्टिव सुविधाओं के उपयोग को निर्धारित करती है ओर जो आपके साइट विजिटर्स को पेज बांटती है।

Introduction To Internet

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

यह 1969 में ARPANET (एडवांस रिसर्च प्रोजेक्ट्स एजेंसी नेटवर्क) नामक प्रोजेक्ट के तहत विकसित किया गया था। 1990 में ARPANET, NSFnet और अन्य निजी नेटवर्क के नेटवर्क का काम इंटरनेट रखा गया।

कोई भी इंटरनेट का मालिक नहीं है, हालांकि दुनिया भर के कई संगठन इसके कामकाज और विकास में सहयोग करते हैं।

इंटरनेट इनफार्मेशन रिसोर्सेज और सर्विसेज़ की एक विशाल श्रृंखला को संचालित करता है, जैसे कि इंटर-लिंक किए गए हाइपरटेक्स्ट डॉक्यूमेंट और WWW (वर्ल्ड वाइड वेब), इलेक्ट्रॉनिक मेल, टेलीफोनी और फ़ाइल शेरिंग।

Internet Protocol

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

यह नेटवर्क बॉउन्ड्रीस के बीच पैकेट को रिले करने के लिए इंटरनेट प्रोटोकॉल सूट का एक प्रिन्सपल कम्यूनिकेशन प्रोटोकॉल है।

यह प्राइमेरी प्रोटोकॉल है जिसे 1970 में विकसित किया गया था। इसका उपयोग अक्सर टीसीपी के साथ किया जाता है और इसे परस्पर रूप से टीसीपी / आईपी के रूप में बताया जाता है। Ip वर्ज़न IPv4 और Ipv6 हैं, Ipv4 की लंबाई 4bytes (32bit) है और Ipv6 की लंबाई 16bytes (128bit) है। आईपी ​​एक राउटेबल नेटवर्क-लेवल प्रोटोकॉल है जिसका उपयोग एक नेटवर्क नोड से दूसरे में डेटा के अनरेलिबल कम्यूनिकेशन के लिए किया जाता है। IP RFC 791 स्टैंडर्ड्स में लिखी गई है।

Features of the Internet

·         "ईमेल" दुनिया की सबसे तेज डाक सेवा  है ओर इसके इस्तेमाल से हम एक पल में दुनिया में कहीं भी मेल कर सकते है।

·         दुनिया में कहीं भी फ़ाइलों को स्थानांतरित कर सकते है ।

·         किसी भी व्यक्ति, उत्पाद, संस्थान, देश आदि के बारे में कोई भी जानकारी प्राप्त कर सकते है।

·         दुनिया में कहीं भी कल कर सकते है ।

·         खरीदारी कर सकते है|

·         प्रवेश के लिए एक आवेदन कर सकते है|

·         फिल्मों / संगीत का आनंद लें सकते है

·         ऑनलाइन गेम्स खेलें सकते है ।

·         दुनिया के किसी भी स्थान के लाइव मैप्स देख सकते है ।

Internet Services

1.       Online Transaction

2.       Searching

3.       Ticket booking

4.       Online application

5.       E-communication

6.       Weather forecasting

7.       E-commerce

8.       E-governance

 

WWW(world wide web)

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

यह 1989 में टिम बर्नर्स-ली द्वारा आविष्कार किया गया था। यह इंटरनेट साइटों का एक नेटवर्क है। यह इंटरनेट के माध्यम से एक्सेस किए गए इंटरलिंक हाइपरटेक्स्ट दस्तावेज़ का एक सिस्टम है।

Web Browsing software

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

पहला वेब ब्राउज़र, lynx  1989 में और मोज़ेक (1992) मे केवल टेक्स्ट के लिए इस्तेमाल किया गया, मोज़ेक 1994 में नेटस्केप नेविगेटर और 1995 में इंटरनेट एक्सप्लोरर की ओर जाता है।

Website

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

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

Web portals

वेब पोर्टल वो वेबसाइटें होती है जो किसी विशेष डाटा या इनफार्मेशन के साथ-साथ कुछ अन्य वेबसाइटें के लिंक को भी रखती है जिसमे उनसे रिलेटेड इनफार्मेशन को रखा जाता है| वेब पोर्टल्स कई तरह के सर्विसेज़ प्रदान करने वाली वेबसाइटें को कहते है जो किसी विशेष समूह या विभाग की सूचना रखते है |

Web address

यह एक यूनीक नाम है जो डोमेन नाम से संबंधित जानकारी प्राप्त करने के लिए वेबसाइट तक पहुंचने के लिए प्रयोग मे लाया जाता है। इन पतों को URL के रूप में जाना जाता है।

Web servers

यह एक रीमोट डेटाबेस है जो रेकुएस्टेड वेब ब्राउज़र के माध्यम से यूजर को जानकारी प्रदान करता है।

Web page

यह एचटीएमएल का उपयोग करके written और constructed  इंटरनेट पर document है और आपके वेब ब्राउज़र द्वारा translated है।

 

यह या तो स्टैटिक या डाइनैमिक हो सकता है।

 

स्टेटिक पृष्ठ हर बार देखे जाने पर समान सामग्री दिखाते हैं। डायनामिक पृष्ठों में ऐसी सामग्री होती है जिसे बदला जा सकता है।

 

वेब पेजों पर कई प्रकार की जानकारी प्रस्तुत की जा सकती है, जिस को दो मुख्य समूहों में विभाजित किया जा सकता है- मान्यता प्राप्त(Perceived) जानकारी (वेबसाइट आगंतुक को दिखाई) छिपी(hidden ) जानकारी (आगंतुक की आंख से छिपी)

Front End

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

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

Back End

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

Client Scripting

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

यह एक कोड जेनरैट करने के लिए perform करता है जो सर्वर की आवश्यकता के बिना ब्राउज़र के क्लाइंट एंड पर चल सकता है। मूल रूप से इस प्रकार की स्क्रिप्ट को HTML डॉक्यूमेंट के अंदर रखा जाता है।

प्रभावी क्लाइंट-साइड स्क्रिप्टिंग सर्वर लोड को काफी कम कर सकती है।

Client-side Scripting Language

HTML: - यह वेब प्रोग्रामिंग का मूल बिल्डिंग ब्लॉक है जो वेबसाइट को फ्रेम प्रदान करता है।

CSS : - यह ग्राफिक तत्वों को डिजाइन करने का तरीका प्रदान करता है जो वेब एप्लिकेशन के apperance को अधिक आकर्षक बनाने में मदद करते हैं।

JAVASCRIPT: - यह अनिवार्य रूप से विशिष्ट उद्देश्य के लिए डिज़ाइन किया गया है, लेकिन वर्तमान में सर्वर-साइड टेक्नॉलजी के रूप में उपयोग किए जाने वाले विभिन्न जावास्क्रिप्ट फ्रेमवर्क हैं

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

Server Scripting

सर्वर एक वेबसाइट के बैक-एंड आर्किटेक्चर, ब्राउज़र के लिए प्रोसेस request और response पेज पर चला सकता है। यह आमतौर पर एक वेब सर्वर द्वारा किया जाता है और यह आमतौर पर किसी वेबसाइट के बैकेंड पर होता है।

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

Server side scripting language

·    PhP: - यह वेब पर उपयोग की जाने वाली सबसे प्रचलित सर्वर साइड भाषा है जिसे डेटाबेस में जानकारी निकालने और हेरफेर करने के लिए डिज़ाइन किया गया था। भाषा का उपयोग डेटाबेस के लिए SQL भाषा के सहयोग से किया जाता है। इसका उपयोग facebook और wikipedia में किया जाता है।

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

·    Ruby : - simplicity और productivity पर ध्यान देने के साथ एक डाइनैमिक , ओपन सोर्स प्रोग्रामिंग भाषा है । इसमें एक elegant syntax है जिसे पढ़ना और लिखना आसान है।

Comparison Chart of Client and server side scripting
	क्लाइंट-साइड स्क्रिप्टिंग	सर्वर-साइड स्क्रिप्टिंग
Basic	उपयोगकर्ताओं फ्रन्ट एंड पर काम दिखता है ओर यूजर को स्क्रिप्ट दिखती है	क्लाइंट एंड पर काम नहीं दिखता क्योंकि वह बैक एंड पर होता है
Processing	सर्वर के साथ interaction की आवश्यकता नहीं है	सर्वर इंटरैक्शन की आवश्यकता है
Language involved	HTML, CSS, जावास्क्रिप्ट आदि।	PhP, ASP.net, ruby , python , आदि।
Affect	सर्वर पर लोड को कम कर सकते हैं	प्रभावी रूप से वेब पेज को अनुकूलित कर सकता है और dynamic वेबसाइट प्रदान कर सकता है।
security	असुरक्षित	अपेक्षाकृत सुरक्षित

 

Responsive web design

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

रीस्पान्सिव वेब डिज़ाइन शब्द ETHAN MARCOTTE द्वारा विकसित किया गया था ।

There Are Three Defining Features  

·  Media Queries

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

·  Fluid Grids

जब css का उपयोग करके लचीले ग्रिड बनाए जाते हैं, तो column automatically रूप से स्क्रीन या ब्राउज़र विंडो के आकार को फिट करने के लिए खुद को rearrange करता है, उपयोगकर्ता 21 इंच के डेस्कटॉप, 13 इंच के लैपटॉप, 9.7 इंच के टैबलेट या 5.5-इंच मोबाइल फोन  पर होता है। यह डिज़ाइनर को कई उपकरणों में consistent रूप से देखने और महसूस करने में सक्षम बनाता है।

·  Flexible Visuals

MARCOTTE ने यहां कोड का उपयोग करने का उल्लेख किया है जो rich मीडिया फ़ाइलों को उनके कंटेनरों के dimensions से अधिक और साथ ही viewport से रोकता है। यह कार्यशीलता टीम को किसी भी उपकरण के अनुकूल होने के लिए timeless डिज़ाइन बनाने में सक्षम बनाती है, चाहे उसका size या shape कुछ भी हो।

Types Of Website

स्टेटिक वेबसाइट	डायनामिक वेबसाइट
इन वेबसाइट पर पृष्ठों की संख्या निर्धारित है	ये वेबसाइट dynamic रूप से वेबपेज बना सकती है
वेबसाइट और वेबपेज के डेटा का विषय तय होता है	वेबपेज डिज़ाइन और डेटा रन टाइम पर बदल सकते हैं।
क्लाइंट ब्राउज़र पर स्टेटिक वेबसाइट जल्दी से लोड होती है क्योंकि इसमें केवल कुछ मार्कअप सामग्री होती है।	डायनेमिक साइट्स क्लाइंट पर लोड होने में कुछ समय लेती हैं क्योंकि यह रिक्वेस्ट सर्वर साइड को प्रोसेस करता है और डायनेमिकली कंटेंट बनाता है
स्टैटिक वेबसाइट कभी भी डेटाबेस कनेक्टिविटी का उपयोग नहीं करती है	डेटाबेस के साथ डायनामिक साइट डील करती है
स्टेटिक साइट रन टाइम पर डेटा नहीं बदल सकती है	डाइनैमिक वेबसाइट सामग्री रन टाइम पर अक्सर बदलती रहती है
डायनामिक साइट्स की तुलना में स्टेटिक वेबसाइट अत्यधिक सुरक्षित है क्योंकि यह एक half duplex के रूप में व्यवहार करती है इसलिए केवल one way communication संभव है	डायनामिक साइट कम सुरक्षित हैं क्योंकि यह full duplex  के रूप में व्यवहार करती है इसलिए two way communication  संभव है ताकि उपयोगकर्ता सर्वर डेटा को बदल सके।
स्टेटिक वेबसाइट सीधे ब्राउज़र पर चलती है और इसके लिए अन्य सर्वर एप्लिकेशन भाषा की आवश्यकता नहीं होती है। स्टैटिक वेबसाइट HTML और CSS से बनाई जा सकती है	डायनामिक वेबसाइट सर्वर पर एप्लिकेशन चलाती है और आउटपुट वेबपेज पर प्रदर्शित होता है
स्टेटिक वेबसाइट को विकसित करना आसान है और थोड़े अनुभवी लोग इसे विकसित कर सकते हैं।	गतिशील वेबसाइट को विकसित करना आसान नहीं है, क्योंकि इसे बनाने, इसे प्रबंधित करने, परीक्षण करने, एप्लिकेशन और डेटाबेस की सुरक्षा बनाए रखने के लिए योग्य डेवलपर्स की आवश्यकता होती है।
Low in cost	High in cost
स्टेटिक वेबसाइट में अगर हम पेज कंटेंट को बदलना चाहते हैं तो हमें उस पेज को कई बार सर्वर पर अपलोड करना पड़ता है।	डायनामिक साइट सुविधा प्रदान करती हैं जो सर्वर एप्लिकेशन का उपयोग करके पृष्ठ सामग्री को बदलना संभव बनाती हैं। और सर्वर पर पेज अपलोड करने की आवश्यकता नहीं है