वेब डिजाइन
वेब डिज़ाइन में वेवसाइटों के उत्पादन और रखरखाव में कई अलग-अलग कौशल और अनुशासन सम्मिलित हैं। वेब डिज़ाइन के विभिन्न क्षेत्रों में वेब ग्राफ़िक डिज़ाइन सम्मिलित है;यूजर इंटरफेस डिजाइन (यूआई डिजाइन); संलेखन, मानकीकृत कोड और मालिकाना सॉफ्टवेयर सहित; उपयोगकर्ता अनुभव डिजाइन (यूएक्स डिजाइन); और खोज इंजन अनुकूलन है। प्रायः कई लोग टीमों में डिजाइन प्रक्रिया के विभिन्न पहलुओं को कवर करते हुए काम करेंगे, यदपि कुछ डिजाइनर उन सभी को कवर करेंगे।[1] वेब डिज़ाइन शब्द का प्रयोग सामान्यतः भाषा की वृद्धि लिखने सहित वेबसाइट के फ्रंट-एंड (क्लाइंट साइड) डिज़ाइन से संबंधित डिज़ाइन प्रक्रिया का वर्णन करने के लिए किया जाता है। वेब डिज़ाइन आंशिक रूप से वेब विकास के व्यापक दायरे में वेब इंजीनियरिंग को अतिव्यापन करता है। वेब डिज़ाइनरों से अपेक्षा की जाती है कि वे वेब प्रयोज्यता के बारे में जागरूक हों और वेब पहुँच दिशानिर्देशों के साथ अद्यतित रहें हैं।
इतिहास
1988–2001
यदपि वेब डिज़ाइन का हाल ही का इतिहास है, इसे ग्राफिक डिज़ाइन, उपयोगकर्ता अनुभव और मल्टीमीडिया कला जैसे अन्य क्षेत्रों से जोड़ा जा सकता है, लेकिन इसे तकनीकी दृष्टिकोण से अधिक उपयुक्त रूप से देखा जाता है। यह लोगों के प्रतिदिन के जीवन का एक बड़ा हिस्सा बन गया है। एनिमेटेड ग्राफिक्स, टाइपोग्राफी की विभिन्न शैलियों, पृष्ठभूमि, वीडियो और संगीत के बिना इंटरनेट की कल्पना करना कठिन है। नवंबर 1992 में सर्न सजीव प्रसारित होने वाली पहली वेबसाइट थी। वेब की घोषणा 6 अगस्त, 1991 को की गई थी और सीईआरएन वर्ल्ड वाइड वेब पर सजीव प्रसारित होने वाली पहली वेबसाइट थी। इस अवधि के दौरान, वेबसाइटों को <टेबल> टैग का उपयोग करके संरचित किया गया था, जिसने वेबसाइट पर नंबर बनाए। आखिरकार, वेब डिज़ाइनर अधिक संरचनाएँ और प्रारूप बनाने के लिए इसके चारों ओर अपना रास्ता खोजने में सक्षम थे। प्रारंभिक इतिहास में, वेबसाइटों की संरचना नाजुक और कठिन थी, इसलिए उनका उपयोग करना बहुत कठिन हो गया हैं। नवंबर 1993 में अलीवेब बनाया जाने वाला पहला सर्च इंजन था (वेब के लिए आर्ची लाइक इंडेक्सिंग)।[2]
वेब और वेब डिजाइन की प्रांरम्भ
1989 में, सी ईआरएन में काम करते हुए,टिक बैरनर्स - ली ने एक वैश्विक हाइपरटेक्स्ट प्रोजेक्ट बनाने का प्रस्ताव रखा, जिसे बाद में वर्ल्ड वाइड वेब के रूप में जाना जाने लगा था। 1991 से 1993 तक वर्ल्ड वाइड वेब का जन्म हुआ था। [[टेक्स्ट-आधारित वेब ब्राउज़र]]| टेक्स्ट-ओनली एचटीएमएल पेजों को एक साधारण लाइन-मोड वेब ब्राउज़र का उपयोग करके देखा जा सकता है।[3] 1993 में मार्क आंद्रेसेन और एरिक बीना ने मोज़ेक ब्राउज़र बनाया। उस समय कई ब्राउज़र थे, हालाँकि उनमें से अधिकांश यूनिक्स-आधारित और स्वाभाविक रूप से पाठ-भारी थे। ग्राफ़िक डिज़ाइन तत्वों जैसे डिजिटल चित्र या डिजिटल ऑडियो के लिए कोई एकीकृत दृष्टिकोण नहीं था। मोज़ेक (वेब ब्राउज़र) ने इस साँचे को तोड़ दिया था।[4] डब्ल्यू 3 सी को अक्टूबर 1994 में बनाया गया था ताकि वर्ल्ड वाइड वेब को सामान्य एचटीटीपी विकसित करके इसकी पूरी क्षमता का नेतृत्व किया जा सके जो इसके विकास को बढ़ावा देता है और इसकी इंटरऑपरेबिलिटी # सॉफ्टवेयर सुनिश्चित करता है।[5] इसने किसी एक कंपनी को एक स्वामित्व वाले ब्राउज़र और प्रोग्रामिंग भाषा पर एकाधिकार करने से हतोत्साहित किया, जो पूरी तरह से वर्ल्ड वाइड वेब के प्रभाव को बदल सकता था। डब्ल्यू 3 सी मानक निर्धारित करना जारी रखता है, जिसे आजजावास्क्रिप्ट और अन्य भाषाओं के साथ देखा जा सकता है। 1994 में आंद्रेसेन ने मोज़ेक कम्युनिकेशंस कॉर्प का गठन किया जो बाद में [[नेटस्केप संचार]], नेटस्केप (वेब ब्राउज़र) नेटस्केप 0.9 ब्राउज़र के रूप में जाना जाने लगा थाl नेटस्केप ने पारंपरिक मानकों की प्रक्रिया पर ध्यान दिए बिना अपने स्वयं के एचटीएमएल टैग बनाए। उदाहरण के लिए, नेटस्केप 1.1 में पृष्ठभूमि के रंग बदलने और वेब पेजों पर एचटीएमएल तत्व,तालिकाओं के साथ पाठ को स्वरूपित करने के लिए टैग सम्मिलित थे। 1996 से 1999 तक ब्राउज़र युद्ध प्रांरम्भ हुआ, क्योंकि माइक्रोसॉफ्ट और नेटस्केप ने अंतिम ब्राउज़र प्रभुत्व के लिए संघर्ष किया थाl इस समय के दौरान क्षेत्र में कई नई प्रौद्योगिकियां थीं, विशेष रूप से व्यापक शैली पत्रक, जावास्क्रिप्ट औरगतिशील एचटीएमएल कुल मिलाकर, ब्राउज़र प्रतियोगिता ने कई सकारात्मक कृतियों को जन्म दिया और वेब डिज़ाइन को तीव्र गति से विकसित करने में मदद की थीं।[6]
वेब डिजाइन का विकास
1996 में, माइक्रोसॉफ्ट ने अपना पहला प्रतिस्पर्धी ब्राउज़र जारी किया, जो अपनी विशेषताओं और एचटीएमएल टैग्स के साथ पूर्ण था। यह स्टाइल शीट का समर्थन करने वाला पहला ब्राउज़र भी था, जिसे उस समय एक अस्पष्ट संलेखन तकनीक के रूप में देखा गया था और आज यह वेब डिज़ाइन का एक महत्वपूर्ण पहलू है।[6] एचटीएमएल एलिमेंट # टेबल्स के लिए एचटीएमएल मार्कअप मूल रूप से सारणीबद्ध डेटा प्रदर्शित करने के लिए था। यदपि, डिजाइनरों ने जटिल, बहु-स्तंभ लेआउट बनाने के लिए एचटीएमएल तालिकाओं का उपयोग करने की क्षमता को जल्दी से महसूस किया जो अन्यथा संभव नहीं था। इस समय, जैसा कि डिजाइन और अच्छे सौंदर्यशास्त्र को अच्छी मार्कअप संरचना पर प्राथमिकता दी गई थी, सिमेंटिक्स और वेब एक्सेसिबिलिटी पर थोड़ा ध्यान दिया गया था. एचटीएमएल साइटें अपने डिज़ाइन विकल्पों में सीमित थीं, एचटीएमएल जटिल डिज़ाइन बनाने के लिए, कई वेब डिज़ाइनरों को जटिल टेबल संरचनाओं का उपयोग करना पड़ा या यहाँ तक कि रिक्त [[स्पेसर .GIF] का भी उपयोग करना पड़ा रिक्त तालिका कक्षों को ढहने से रोकने के लिए चित्र।[7] सीएसएस को दिसंबर 1996 में डब्ल्यू 3 सी द्वारा प्रस्तुति और लेआउट का समर्थन करने के लिए पेश किया गया था। इसने एचटीएमएल कोड को सिमेंटिक और प्रेजेंटेशनल और बेहतर वेब एक्सेसिबिलिटी दोनों के बजाय सिमेंटिक होने की अनुमति दी,टेबललेस वेब डिज़ाइन देखें।
1996 में, एडोब फ्लैश (मूल रूप से फ्यूचरस्प्लैश के रूप में जाना जाता था) विकसित किया गया था। उस समय, फ्लैश कंटेंट डेवलपमेंट टूल अब की तुलना में अपेक्षाकृत सरल था, जिसमें बेसिक लेआउट और ड्राइंग टूल्स, एक्शन स्क्रिप्ट के लिए एक सीमित अग्रदूत और एक टाइमलाइन का उपयोग किया गया था, लेकिन इसने वेब डिजाइनरों को एचटीएमएल, ग्राफिक्स इंटरचेंज फॉर्मेट के बिंदु से आगे जाने में सक्षम बनाया था। एनिमेटेड जीआईएफ और जावास्क्रिप्ट। यदपि, क्योंकि फ्लैश को एक प्लग-इन (कंप्यूटिंग) |प्लग-इन की आवश्यकता थी, इसलिए कई वेब डेवलपर्स अनुकूलता की कमी के कारण अपनी बाजार हिस्सेदारी को सीमित करने के डर से इसका उपयोग करने से बचते रहे। इसके बजाय, डिजाइनरों ने जीआईएफ एनिमेशन (यदि वेगति ग्राफिक्स का पूरी तरह से उपयोग नहीं करते हैं) और सॉफ्टवेयर विजेट के लिए जावास्क्रिप्ट पर वापस लौट आए। लेकिन फ्लैश के लाभों ने इसे विशिष्ट लक्षित बाजारों के बीच काफी लोकप्रिय बना दिया, जो अंततः ब्राउज़रों के विशाल बहुमत के लिए अपना काम करता है, और पूरी साइटों को विकसित करने के लिए पर्याप्त शक्तिशाली है।[7]
पहले ब्राउज़र युद्धों का अंत
1998 में, नेटस्केप ने ओपन-सोर्स लाइसेंस के तहत नेटस्केप कम्युनिकेटर कोड जारी किया ओपन-सोर्स लाइसेंस, हजारों डेवलपर्स को सॉफ्टवेयर में सुधार करने में भाग लेने में सक्षम बनाता है। यदपि, इन डेवलपर्स ने वेब के लिए स्क्रैच से एक मानक प्रांरम्भ करने का फैसला किया, जिसने ओपन-सोर्स ब्राउज़र के विकास को निर्देशित किया और जल्द ही एक पूर्ण एप्लिकेशन प्लेटफॉर्म तक विस्तारित हो गया।[6] वेब मानक परियोजना बनाई गई थी और लेआउट इंजनों की तुलना (एचटीएमएल) और लेआउट इंजनों की तुलना (कैस्केडिंग स्टाइल शीट्स) मानकों के साथ ब्राउज़र अनुपालन को बढ़ावा दिया गया था। वेब मानकों के अनुपालन के लिए ब्राउज़रों का परीक्षण करने के लिए अम्ल1, निश्चित और रखूंगा जैसे प्रोग्राम बनाए गए थे। 2000 में, मैक के लिए इंटरनेट एक्सप्लोरर जारी किया गया था, जो पहला ब्राउज़र था जो एचटीएमएल 4.01 और सीएसएस 1 का पूरी तरह से समर्थन करता था। यह पोर्टेबल नेटवर्क ग्राफ़िक्स छवि प्रारूप का पूरी तरह से समर्थन करने वाला पहला ब्राउज़र भी था।[6]2001 तक, माइक्रोसॉफ्ट द्वारा इंटरनेट एक्सप्लोरर को लोकप्रिय बनाने के एक अभियान के बाद, इंटरनेट एक्सप्लोरर वेब ब्राउज़रों के 96% उपयोग हिस्से तक पहुंच गया था, जिसने पहले ब्राउज़र युद्धों के अंत का संकेत दिया क्योंकि इंटरनेट एक्सप्लोरर में कोई वास्तविक प्रतिस्पर्धा नहीं थी।[8]
2001–2012
21वीं सदी की प्रांरम्भ के बाद से, वेब लोगों के जीवन में अधिक से अधिक एकीकृत हो गया है। जैसा कि हुआ है, वेब की तकनीक भी आगे बढ़ गई है। लोगों द्वारा वेब का उपयोग करने और उस तक पहुंचने के तरीके में भी महत्वपूर्ण परिवर्तन हुए हैं, और इसने साइटों को डिज़ाइन करने के तरीके को भी बदल दिया है।
ब्राउज़र युद्धों के अंत के बाद से नए ब्राउज़र जारी किए गए हैं। इनमें से कई खुला स्रोत सॉफ्टवेयर हैं, जिसका अर्थ है कि वे तेजी से विकास करते हैं और नए मानकों के अधिक समर्थक हैं। नए विकल्पों पर कई लोगों ने विचार किया है माइक्रोसॉफ्ट के इंटरनेट एक्स्प्लोरर से बेहतर होने के लिए।
विश्वव्यापी वेब संकाय ने एचटीएमएल (एचटीएमएल5) और सीएसएस (सीएसएस3) के लिए नए मानक जारी किए हैं, साथ ही नए जावास्क्रिप्ट एप्लिकेशन प्रोग्रामिंग इंटरफ़ेस एपीआई, प्रत्येक एक नए लेकिन व्यक्तिगत मानक के रूप में है। जबकि एचटीएमएल5 शब्द का उपयोग केवल एचटीएमएल के नए संस्करण और कुछ जावास्क्रिप्ट एपीआई को संदर्भित करने के लिए किया जाता है, नए मानकों (एचटीएमएल5, सी एसएस3 और जावास्क्रिप्ट) के पूरे सूट को संदर्भित करने के लिए इसका उपयोग करना आम हो गया है।
2012 और बाद में
3जी और एलटीई इंटरनेट कवरेज में सुधार के साथ, वेबसाइट ट्रैफिक का एक बड़ा हिस्सा मोबाइल जनित हो गया था। इसने वेब डिज़ाइन उद्योग को प्रभावित किया, इसे एक न्यूनतर, हल्का और सरलीकृत शैली की ओर धकेल दिया। विशेष रूप से, मोबाइल फर्स्ट एप्रोच उभरा, जिसका तात्पर्य पहले मोबाइल-उन्मुख लेआउट के साथ वेबसाइट डिज़ाइन बनाना है, और फिर इसे उच्च स्क्रीन आयामों के अनुकूल बनाना है।
उपकरण और प्रौद्योगिकियां
वेब डिज़ाइनर उत्पादन प्रक्रिया के किस हिस्से में सम्मिलित हैं, इसके आधार पर विभिन्न प्रकार के विभिन्न उपकरणों का उपयोग करते हैं। ये उपकरण नए मानकों और सॉफ़्टवेयर द्वारा समय के साथ अद्यतन किए जाते हैं लेकिन उनके पीछे के सिद्धांत समान रहते हैं। वेब डिज़ाइनर वेब-स्वरूपित इमेजरी या डिज़ाइन प्रोटोटाइप बनाने के वेक्टर ग्राफिक्स संपादक संपादक और रेखापुंज ग्राफ़िक्स संपादक ग्राफ़िक्स संपादक दोनों का उपयोग करते हैं। वैसिविग वेबसाइट निर्माता सॉफ़्टवेयर यासामग्री प्रबंधन प्रणाली का उपयोग करके एक वेबसाइट बनाई जा सकती है, या अलग-अलग वेब पेजों को भाषा की वृद्धि हाथ से कोडित किया जा सकता है, जैसे कि पहले वेब पेज बनाए गए थे। अन्य उपकरण जो वेब डिज़ाइनर उपयोग कर सकते हैं उनमें मार्कअप एचटीएमएल सत्यापनकर्ता सम्मिलित हैं[9] और उपयोगिता और पहुंच के लिए अन्य परीक्षण उपकरण यह सुनिश्चित करने के लिए कि उनकी वेबसाइटें वेब पहुंच-योग्यता दिशानिर्देशों को पूरा करती हैं। रेफरी>डब्ल्यू3 सी. "वेब एक्सेसिबिलिटी इनिशिएटिव".
यूएक्स डिजाइन
वेब डिज़ाइन में एक लोकप्रिय टूल यूएक्स डिज़ाइन है, यह एक प्रकार की कला है जो सटीक उपयोगकर्ता पृष्ठभूमि के प्रदर्शन के लिए उत्पादों को डिज़ाइन करती है। यूएक्स डिजाइन बहुत गहरा है। यूएक्स वेब से कहीं अधिक है, यह बहुत स्वतंत्र है, और इसके मूलभूत सिद्धांतों को कई अन्य ब्राउज़रों या ऐप्स पर लागू किया जा सकता है। वेब डिजाइन ज्यादातर वेब आधारित चीजों पर आधारित होता है। यूएक्स वेब डिज़ाइन और डिज़ाइन दोनों को अतिव्यापन कर सकता है। यूएक्स डिजाइन ज्यादातर उन उत्पादों पर केंद्रित है जो कम वेब आधारित हैं।[10]
कौशल और तकनीक
विपणन और संचार डिजाइन
किसी वेबसाइट पर मार्केटिंग और संचार डिज़ाइन यह पहचान सकता है कि उसके लक्षित बाज़ार के लिए क्या काम करता है। यह एक आयु वर्ग या संस्कृति की विशेष धारा हो सकती है; इस प्रकार डिजाइनर अपने दर्शकों के रुझान को समझ सकता है। डिज़ाइनर यह भी समझ सकते हैं कि वे किस प्रकार की वेबसाइट डिज़ाइन कर रहे हैं, उदाहरण के लिए, (बी2बी) व्यवसाय-से-व्यवसाय वेबसाइट डिज़ाइन विचार उपभोक्ता-लक्षित वेबसाइट जैसे खुदरा या मनोरंजन वेबसाइट से बहुत भिन्न हो सकते हैं। यह सुनिश्चित करने के लिए सावधानीपूर्वक विचार किया जा सकता है कि किसी साइट का सौंदर्यशास्त्र या समग्र डिजाइन सामग्री की स्पष्टता और सटीकता या वेब नेविगेशन की आसानी से टकराता नहीं है,[11] विशेष रूप से B2B वेबसाइट पर। डिजाइनर उस मालिक या व्यवसाय की प्रतिष्ठा पर भी विचार कर सकते हैं जो साइट यह सुनिश्चित करने के लिए प्रतिनिधित्व कर रही है कि उन्हें अनुकूल रूप से चित्रित किया गया है। वेब डिज़ाइनर सामान्यतः उन सभी वेबसाइटों की देखरेख करते हैं जो इस आधार पर बनाई जाती हैं कि वे कैसे काम करती हैं या चीजों पर काम करती हैं। वे पर्दे के पीछे से वेबसाइटों पर लगातार सब कुछ अपडेट और बदल रहे हैं। उनके द्वारा किए जाने वाले सभी तत्व टेक्स्ट, फोटो, ग्राफिक्स और वेब का लेआउट हैं। वेबसाइट पर काम प्रांरम्भ करने से पहले, वेब डिज़ाइनर सामान्यतः लेआउट, रंग, ग्राफिक्स और डिज़ाइन पर चर्चा करने के लिए अपने क्लाइंट के साथ अपॉइंटमेंट सेट करते हैं। वेब डिज़ाइनर अपना अधिकांश समय वेबसाइटों को डिज़ाइन करने और यह सुनिश्चित करने में लगाते हैं कि गति सही है। वेब डिज़ाइनर सामान्यतः वेबसाइटों को बनाने और वेबसाइटों के लिए सही तत्वों को खोजने के बारे में अन्य डिजाइनरों के साथ परीक्षण और कार्य, विपणन और संचार में संलग्न होते हैं।[12]
उपयोगकर्ता अनुभव डिजाइन और इंटरैक्टिव डिजाइन
वेबसाइट की सामग्री के बारे में उपयोगकर्ता की समझ प्रायः उपयोगकर्ता की समझ पर निर्भर करती है कि वेबसाइट कैसे काम करती है। यह उपयोगकर्ता अनुभव डिजाइन का हिस्सा है। उपयोगकर्ता अनुभव एक वेबसाइट पर लेआउट, स्पष्ट निर्देश और लेबलिंग से संबंधित है। उपयोगकर्ता कितनी अच्छी तरह समझता है कि वे साइट पर कैसे इंटरैक्ट कर सकते हैं, यह साइट के इंटरैक्टिव डिज़ाइन पर भी निर्भर हो सकता है। यदि कोई उपयोगकर्ता वेबसाइट की उपयोगिता को समझता है, तो इसकी अधिक संभावना है कि वे इसका उपयोग करना जारी रखेंगे। जो उपयोगकर्ता वेबसाइट के उपयोग में कुशल और अच्छी तरह से वाकिफ हैं, वे अधिक विशिष्ट, फिर भी कम सहज या कम उपयोगिता पा सकते हैं। फिर भी उपयोगकर्ता के अनुकूल वेबसाइट इंटरफ़ेस उपयोगी है। यदपि , कम अनुभव वाले उपयोगकर्ताओं को कम सहज वेबसाइट इंटरफ़ेस के फायदे या उपयोगिता देखने की संभावना कम होती है। यह अधिक सार्वभौमिक उपयोगकर्ता अनुभव और उपयोगकर्ता कौशल की परवाह किए बिना अधिक से अधिक उपयोगकर्ताओं को समायोजित करने के लिए उपयोग में आसानी के लिए प्रवृत्ति को चलाता है।[13] अधिकांश उपयोगकर्ता अनुभव डिज़ाइन और इंटरैक्टिव डिज़ाइन को यूज़र इंटरफ़ेस डिज़ाइन में माना जाता है।
उन्नत इंटरैक्टिव कार्यों के लिए प्लग-इन (कंप्यूटिंग) की आवश्यकता हो सकती है | प्लग-इन यदि उन्नत कोडिंग भाषा कौशल नहीं है। यह चुनना कि अन्तरक्रियाशीलता का उपयोग करना है या नहीं जिसके लिए प्लग-इन की आवश्यकता होती है, उपयोगकर्ता अनुभव डिज़ाइन में एक महत्वपूर्ण निर्णय है। यदि प्लग-इन अधिकांश ब्राउज़रों के साथ पहले से इंस्टॉल नहीं आता है, तो एक जोखिम है कि उपयोगकर्ता के पास सामग्री तक पहुँचने के लिए प्लग-इन स्थापित करने के बारे में न तो जानकारी होगी और न ही धैर्य होगा। यदि फ़ंक्शन को उन्नत कोडिंग भाषा कौशल की आवश्यकता होती है, तो फ़ंक्शन उपयोगकर्ता अनुभव में वृद्धि की मात्रा की तुलना में कोड के लिए समय या धन में बहुत महंगा हो सकता है। एक जोखिम यह भी है कि उन्नत अन्तरक्रियाशीलता पुराने ब्राउज़रों या हार्डवेयर कॉन्फ़िगरेशन के साथ असंगत हो सकती है। किसी ऐसे फ़ंक्शन को प्रकाशित करना जो मज़बूती से काम नहीं करता है, उपयोगकर्ता के अनुभव के लिए कोई प्रयास न करने की तुलना में संभावित रूप से खराब है। यह लक्षित दर्शकों पर निर्भर करता है कि क्या इसकी आवश्यकता होने या किसी जोखिम के लायक होने की संभावना है।
प्रगतिशील वृद्धि
.svg)
प्रगतिशील वृद्धि वेब डिज़ाइन में एक रणनीति है जो पहले वेब सामग्री पर जोर देती है, जिससेयूनिवर्सल डिजाइन को वेब पेज की मूल सामग्री और कार्यक्षमता की अनुमति मिलती है, जबकिउपयोगकर्ता (कंप्यूटिंग) अतिरिक्त ब्राउज़र सुविधाओं या तेज़ इंटरनेट एक्सेस के साथ उन्नत संस्करण प्राप्त करते हैं।
व्यवहार में, इसका अर्थ है एचटीएमएल के माध्यम से सामग्री परोसना और सीएसएस के माध्यम से स्टाइलिंग और एनीमेशन को तकनीकी रूप से संभव सीमा तक लागू करना, फिर जावास्क्रिप्ट के माध्यम से और संवर्द्धन लागू करना। पृष्ठों के पाठ को तुरंत एचटीएमएल स्रोत कोड के माध्यम से लोड किया जाता है, इसके बजाय सामग्री को आरंभ करने और सामग्री को लोड करने के लिए जावास्क्रिप्ट की प्रतीक्षा करने के बजाय, जो सामग्री को न्यूनतम लोडिंग समय और बैंडविड्थ के साथ और पाठ-आधारित ब्राउज़र के माध्यम से पढ़ने योग्य होने की अनुमति देता है, और पश्चगामी संगतता को अधिकतम करता है।[14] एक उदाहरण के रूप में, विकिपीडिया सहित मीडियाविकि आधारित साइटें प्रगतिशील संवर्द्धन का उपयोग करती हैं, क्योंकि जावास्क्रिप्ट और यहां तक कि सीएसएस के निष्क्रिय होने पर भी वे प्रयोग करने योग्य रहते हैं, क्योंकि पृष्ठों की सामग्री पृष्ठ के एचटीएमएल स्रोत कोड में सम्मिलित होती है, जबकि प्रति-उदाहरण एवरपीडिया पृष्ठों को लोड करने के लिए जावास्क्रिप्ट पर निर्भर करता है। 'सामग्री बाद में; जावास्क्रिप्ट निष्क्रिय के साथ एक खाली पृष्ठ दिखाई देता है।
पृष्ठ अभिन्यास
उपयोगकर्ता इंटरफ़ेस डिज़ाइन का एक भाग पृष्ठ लेआउट की गुणवत्ता से प्रभावित होता है। उदाहरण के लिए, एक डिज़ाइनर इस बात पर विचार कर सकता है कि लेआउट डिज़ाइन करते समय साइट का पृष्ठ लेआउट विभिन्न पृष्ठों पर संगत रहना चाहिए या नहीं। लेआउट डिज़ाइन में ऑब्जेक्ट्स को संरेखित करने के लिए पृष्ठ पिक्सेल चौड़ाई को भी महत्वपूर्ण माना जा सकता है। सबसे लोकप्रिय निश्चित-चौड़ाई वाली वेबसाइटों में सामान्यतः वर्तमान सबसे लोकप्रिय मॉनिटर आकार पर, वर्तमान सबसे लोकप्रिय स्क्रीन रिज़ॉल्यूशन पर, वर्तमान सबसे लोकप्रिय ब्राउज़र विंडो से मिलान करने के लिए समान सेट चौड़ाई होती है। बड़ी स्क्रीन पर सौंदर्यशास्त्र की चिंताओं के लिए अधिकांश पृष्ठ केंद्र-संरेखित हैं।
पाठक की स्क्रीन (खिड़की का आकार, खिड़की के सापेक्ष फ़ॉन्ट आकार, आदि) के विवरण के आधार पर द्रव लेआउट के लिए ब्राउज़र को उपयोगकर्ता-विशिष्ट लेआउट समायोजन करने की अनुमति देने के लिए 2000 के आसपास द्रव लेआउट की लोकप्रियता में वृद्धि हुई थी वे एचटीएमएल-टेबल-आधारित लेआउट और ग्रिड (पृष्ठ अभिन्यास) के विकल्प के रूप में विकसित हुए। पृष्ठ अभिन्यास डिजाइन सिद्धांतों और कोडिंग तकनीक दोनों में ग्रिड-आधारित डिज़ाइन लेकिन अपनाने में बहुत धीमी थी।[note 1] यह स्क्रीन रीडर और अलग-अलग खिड़कियों के आकार के कारण था, जिस पर डिजाइनरों का कोई नियंत्रण नहीं है। तदनुसार, एक डिज़ाइन को इकाइयों (साइडबार, सामग्री ब्लॉक, वेब बैनर क्षेत्र, नेविगेशन क्षेत्र) में विभाजित किया जा सकता है जो कि ब्राउज़र को भेजे जाते हैं और जो ब्राउज़र द्वारा डिस्प्ले विंडो में फिट किया जाएगा, जितना अच्छा हो सकता है। यदपि इस तरह का प्रदर्शन प्रायः प्रमुख सामग्री इकाइयों की सापेक्ष स्थिति को बदल सकता है, साइडबार इसके किनारे की बजाय मुख्य भाग के नीचे विस्थापित हो सकते हैं। यह हार्ड-कोडेड ग्रिड-आधारित लेआउट की तुलना में अधिक लचीला प्रदर्शन है जो डिवाइस विंडो में फिट नहीं होता है। विशेष रूप से, ब्लॉक के भीतर सामग्री को अप्रभावित रखते हुए सामग्री ब्लॉक की सापेक्ष स्थिति बदल सकती है। यह पृष्ठ को क्षैतिज रूप से स्क्रॉल करने के लिए उपयोगकर्ता की आवश्यकता को भी कम करता है।
उत्तरदायी वेब डिज़ाइन सी एसएस3 पर आधारित एक नया दृष्टिकोण है, और सीएसएस के उन्नत उपयोग के माध्यम से पृष्ठ की स्टाइल शीट के भीतर प्रति-उपकरण विनिर्देश का एक गहरा स्तर है। @media नियम मार्च 2018 में गूगल ने घोषणा की कि वे मोबाइल-फर्स्ट इंडेक्सिंग प्रांरम्भ करेंगे।[15] उत्तरदायी डिज़ाइन का उपयोग करने वाली साइटें यह सुनिश्चित करने के लिए अच्छी स्थिति में हैं कि वे इस नए दृष्टिकोण को पूरा करती हैं।
टाइपोग्राफी
वेब डिज़ाइनर टाइपफ़ेस की एक विस्तृत श्रृंखला या टाइपफेस # टाइपफेस की शैली का उपयोग करने के बजाय वेबसाइट टाइपफेस की विविधता को केवल कुछ समान शैली तक सीमित करना चुन सकते हैं। अधिकांश ब्राउज़र एक विशिष्ट संख्या में सुरक्षित फोंट को पहचानते हैं, जो डिजाइनर मुख्य रूप से जटिलताओं से बचने के लिए उपयोग करते हैं।
फ़ॉन्ट डाउनलोडिंग को बाद में सी एसएस3 के फोंट मॉड्यूल में सम्मिलित किया गया था और तब से इसे सफारी 3.1, ओपेरा 10 और मोज़िला फ़ायरफ़ॉक्स 3.5 में लागू किया गया है। इसने बाद में वेब टाइपोग्राफी के साथ-साथ फ़ॉन्ट डाउनलोडिंग के उपयोग में रुचि बढ़ाई है।
अधिकांश साइट लेआउट पाठ को पैराग्राफ में विभाजित करने के लिए नकारात्मक स्थान सम्मिलित करते हैं और केंद्र-संरेखित पाठ से भी बचते हैं।[16]
मोशन ग्राफिक्स
मोशन ग्राफिक्स के उपयोग से पृष्ठ अभिन्यास और यूजर इंटरफेस भी प्रभावित हो सकते हैं। गति ग्राफिक्स का उपयोग करने या न करने का विकल्प वेबसाइट के लिए लक्षित बाजार पर निर्भर हो सकता हैl मोशन ग्राफिक्स की अपेक्षा की जा सकती है या कम से कम मनोरंजन-उन्मुख वेबसाइट के साथ बेहतर प्राप्त किया जा सकता है। यदपि , अधिक गंभीर या औपचारिक रुचि (जैसे व्यवसाय, समुदाय, या सरकार) के साथ दर्शकों को लक्षित करने वाली वेबसाइट को केवल मनोरंजन या सजावट के उद्देश्यों के लिए एनिमेशन अनावश्यक और विचलित करने वाला लग सकता है। इसका मतलब यह नहीं है कि अधिक गंभीर सामग्री को एनिमेटेड या वीडियो प्रस्तुतियों के साथ बढ़ाया नहीं जा सकता है जो सामग्री के लिए प्रासंगिक है। किसी भी मामले में, गति ग्राफिक डिजाइन अधिक प्रभावी दृश्यों या विचलित करने वाले दृश्यों के बीच अंतर कर सकता है।
मोशन ग्राफिक्स जो साइट विज़िटर द्वारा प्रांरम्भ नहीं किए गए हैं, वे एक्सेसिबिलिटी के मुद्दे पैदा कर सकते हैं। वर्ल्ड वाइड वेब कंसोर्टियम एक्सेसिबिलिटी मानकों के लिए आवश्यक है कि साइट विज़िटर एनिमेशन को अक्षम करने में सक्षम हों।[17]
कोड की गुणवत्ता
वेबसाइट डिजाइनर इसे मानकों के अनुरूप होना अच्छा अभ्यास मान सकते हैं। यह सामान्यतः विवरण के माध्यम से किया जाता है जो निर्दिष्ट करता है कि तत्व क्या कर रहा है। मानकों के अनुरूप होने में विफलता एक वेबसाइट को अनुपयोगी या त्रुटि-प्रवण नहीं बना सकती है, लेकिन मानक पठनीयता के लिए पृष्ठों के सही लेआउट से संबंधित हो सकते हैं और साथ ही यह सुनिश्चित कर सकते हैं कि कोडित तत्व उचित रूप से बंद हैं। इसमें कोड में त्रुटियां, कोड के लिए एक अधिक संगठित लेआउट, और यह सुनिश्चित करना सम्मिलित है कि आईडी और कक्षाएं ठीक से पहचानी गई हैं। खराब कोडित पृष्ठों को कभी-कभी बोलचाल की भाषा में टैग सूप कहा जाता है। डब्ल्यू 3 सी मार्कअप सत्यापन सेवा [9]केवल तभी किया जा सकता है जब एक सही डॉक्टयपे घोषणा की जाती है, जिसका उपयोग कोड में त्रुटियों को उजागर करने के लिए किया जाता है। सिस्टम उन त्रुटियों और क्षेत्रों की पहचान करता है जो वेब डिज़ाइन मानकों के अनुरूप नहीं हैं। इस जानकारी को तब उपयोगकर्ता द्वारा ठीक किया जा सकता है।[18]
उत्पन्न सामग्री
वेबसाइटें दो तरह से उत्पन्न होती हैं: स्थिर या गतिशील।
स्थिर वेबसाइटें
एक स्थिर वेबसाइट एक स्थिर वेबसाइट के प्रत्येक पृष्ठ के लिए एक अद्वितीय फ़ाइल संग्रहीत करती है। हर बार जब उस पृष्ठ का अनुरोध किया जाता है, वही सामग्री लौटा दी जाती है। यह सामग्री वेबसाइट के डिजाइन के दौरान एक बार बनाई गई है। यह सामान्यतः मैन्युअल रूप से लिखा जाता है, यदपि कुछ साइटें एक गतिशील वेबसाइट के समान एक स्वचालित निर्माण प्रक्रिया का उपयोग करती हैं, जिसके परिणाम लंबे समय तक पूर्ण पृष्ठों के रूप में संग्रहीत किए जाते हैं। ये स्वचालित रूप से बनाई गई स्थैतिक साइटें 2015 के आसपास जेकिल (सॉफ्टवेयर) और एडोब सरस्वती जैसे जनरेटर के साथ अधिक लोकप्रिय हो गईं थी।[19]एक स्थिर वेबसाइट के लाभ यह हैं कि वे होस्ट करने के लिए सरल थे, क्योंकि उनके सर्वर को केवल स्थिर सामग्री परोसने की आवश्यकता थी, न कि सर्वर-साइड स्क्रिप्ट को निष्पादित करने की। इसके लिए कम सर्वर प्रशासन की आवश्यकता थी और सुरक्षा छेदों को उजागर करने की संभावना कम थी। वे कम लागत वाले सर्वर हार्डवेयर पर पेजों को अधिक तेजी से सर्व कर सकते हैं। यह लाभ कम महत्वपूर्ण हो गया क्योंकि सस्ती वेब होस्टिंग भी गतिशील सुविधाओं की पेशकश करने के लिए विस्तारित हुई, और आभासी मशीन ने कम लागत पर कम अंतराल के लिए उच्च प्रदर्शन की पेशकश की थी।
लगभग सभी वेबसाइटों में कुछ स्थिर सामग्री होती है, क्योंकि सहायक संपत्ति जैसे चित्र और स्टाइल शीट सामान्यतः स्थिर होती हैं, यहां तक कि अत्यधिक गतिशील पृष्ठों वाली वेबसाइट पर भी होती हैं।
डायनेमिक वेबसाइट्स
डायनेमिक वेबसाइट्स फ्लाई पर उत्पन्न होती हैं और वेब पेज बनाने के लिए सर्वर-साइड तकनीक का उपयोग करती हैं। वे सामान्यतः एक या एक से अधिक बैक-एंड डेटाबेस से अपनी सामग्री निकालते हैं: कुछ एक कैटलॉग को क्वेरी करने या संख्यात्मक जानकारी को सारांशित करने के लिए रिलेशनल डेटाबेस में डेटाबेस क्वेरीज़ हैं, और अन्य सामग्री की बड़ी इकाइयों को स्टोर करने के लिए मोंगोडीबी या नोएसक्यूएल जैसेदस्तावेज़ डेटाबेस का उपयोग कर सकते हैं। जैसे ब्लॉग पोस्ट या विकी लेख हैं।
डिजाइन प्रक्रिया में, गतिशील पृष्ठों का प्रायः मजाक उड़ाया जाता है या स्थिर पृष्ठों का उपयोग करके वेबसाइट को वायरफ्रेम किया जाता है। डायनेमिक वेब पेजों को विकसित करने के लिए आवश्यक कौशल एक स्थिर पेज की तुलना में बहुत व्यापक है, जिसमें सर्वर-साइड और डेटाबेस कोडिंग के साथ-साथ क्लाइंट-साइड इंटरफ़ेस डिज़ाइन सम्मिलित है। यहां तक कि मध्यम आकार की गतिशील परियोजनाएं भी लगभग हमेशा एक टीम प्रयास होती हैं।
जब डायनामिक वेब पेज पहले विकसित हुए, तो उन्हें सामान्यतः सीधे पर्ल,पीएचपी या सक्रिय सर्वर पेज जैसी भाषाओं में कोडित किया गया था। इनमें से कुछ, विशेष रूप से पीएचपी और एएसपी, ने एक 'टेम्प्लेट' दृष्टिकोण का उपयोग किया जहां एक सर्वर-साइड पेज पूर्ण क्लाइंट-साइड पेज की संरचना जैसा दिखता था, और डेटा 'टैग' द्वारा परिभाषित स्थानों में डाला गया था। पर्ल जैसी विशुद्ध रूप से प्रक्रियात्मक कोडिंग भाषा में कोडिंग की तुलना में यह विकास का एक तेज साधन था।
इन दोनों दृष्टिकोणों को अब कई वेबसाइटों के लिए सामग्री प्रबंधन प्रणालियों जैसे उच्च-स्तरीय एप्लिकेशन-केंद्रित टूल द्वारा दबा दिया गया है। ये सामान्य-उद्देश्य वाले कोडिंग प्लेटफॉर्म के शीर्ष पर बनते हैं और मानते हैं कि एक वेबसाइट कई अच्छी तरह से मान्यता प्राप्त मॉडलों में से एक के अनुसार सामग्री की पेशकश करने के लिए मौजूद है, जैसे समय-अनुक्रमित ब्लॉग, विषयगत पत्रिका या समाचार साइट, विकी, या उपयोगकर्ता मंच। ये उपकरण ऐसी साइट के कार्यान्वयन को बहुत आसान बनाते हैं, और बिना किसी कोडिंग की आवश्यकता के विशुद्ध रूप से संगठनात्मक और डिज़ाइन-आधारित कार्य करते हैं।
स्वयं सामग्री का संपादन (साथ ही टेम्प्लेट पृष्ठ) साइट के माध्यम से और तृतीय-पक्ष