वेब डिजाइन: Difference between revisions
(Created page with "{{short description|Creation and maintenance of websites}} {{pp-semi-indef}} {{Use British English|date=July 2016}} वेब डिज़ाइन में वेबस...") |
No edit summary |
||
| (21 intermediate revisions by 5 users not shown) | |||
| Line 1: | Line 1: | ||
{{short description|Creation and maintenance of websites}} | {{short description|Creation and maintenance of websites}} | ||
'''वेब डिज़ाइन''' में [[ वेबसाइट |वेवसाइटों]] के उत्पादन और रखरखाव में कई अलग-अलग कौशल और अनुशासन सम्मिलित हैं। वेब डिज़ाइन के विभिन्न क्षेत्रों में वेब ग्राफ़िक डिज़ाइन सम्मिलित है;[[ यूजर इंटरफेस डिजाइन ]] (यूआई डिजाइन); संलेखन, मानकीकृत कोड और[[ मालिकाना सॉफ्टवेयर | मालिकाना सॉफ्टवेयर]] सहित;[[ उपयोगकर्ता अनुभव डिजाइन | उपयोगकर्ता अनुभव डिजाइन]] (यूएक्स डिजाइन); और खोज इंजन अनुकूलन है। प्रायः कई लोग टीमों में डिजाइन प्रक्रिया के विभिन्न पहलुओं को कवर करते हुए काम करेंगे, यदपि कुछ डिजाइनर उन सभी को कवर करेंगे।<ref name="different jobs">{{cite web|last=Lester|first=Georgina|title=वेबसाइट बनाने में शामिल विभिन्न लोगों की विभिन्न नौकरियां और जिम्मेदारियां|url=https://www.arts-wales.co.uk/different-jobs-and-responsibilities-of-various-people-involved-in-creating-a-website/|access-date=2012-03-17|publisher=Arts Wales UK}}</ref> वेब डिज़ाइन शब्द का प्रयोग सामान्यतः भाषा की वृद्धि लिखने सहित वेबसाइट के फ्रंट-एंड (क्लाइंट साइड) डिज़ाइन से संबंधित डिज़ाइन प्रक्रिया का वर्णन करने के लिए किया जाता है। वेब डिज़ाइन आंशिक रूप से[[ वेब विकास | वेब विकास]] के व्यापक दायरे में[[ वेब इंजीनियरिंग | वेब इंजीनियरिंग]] को अतिव्यापन करता है। वेब डिज़ाइनरों से अपेक्षा की जाती है कि वे वेब प्रयोज्यता के बारे में जागरूक हों और वेब पहुँच दिशानिर्देशों के साथ अद्यतित रहें हैं। | |||
वेब डिज़ाइन में [[ वेबसाइट ]] | |||
== इतिहास == | == इतिहास == | ||
| Line 8: | Line 6: | ||
===1988–2001=== | ===1988–2001=== | ||
यदपि वेब डिज़ाइन का हाल ही का इतिहास है, इसे ग्राफिक डिज़ाइन, उपयोगकर्ता अनुभव और मल्टीमीडिया कला जैसे अन्य क्षेत्रों से जोड़ा जा सकता है, लेकिन इसे तकनीकी दृष्टिकोण से अधिक उपयुक्त रूप से देखा जाता है। यह लोगों के प्रतिदिन के जीवन का एक बड़ा हिस्सा बन गया है। एनिमेटेड ग्राफिक्स, टाइपोग्राफी की विभिन्न शैलियों, पृष्ठभूमि, वीडियो और संगीत के बिना इंटरनेट की कल्पना करना कठिन है। नवंबर 1992 में [[ सर्न |सर्न]] सजीव प्रसारित होने वाली पहली वेबसाइट थी। वेब की घोषणा 6 अगस्त, 1991 को की गई थी और सीईआरएन वर्ल्ड वाइड वेब पर सजीव प्रसारित होने वाली पहली वेबसाइट थी। इस अवधि के दौरान, वेबसाइटों को <टेबल> टैग का उपयोग करके संरचित किया गया था, जिसने वेबसाइट पर नंबर बनाए। आखिरकार, वेब डिज़ाइनर अधिक संरचनाएँ और प्रारूप बनाने के लिए इसके चारों ओर अपना रास्ता खोजने में सक्षम थे। प्रारंभिक इतिहास में, वेबसाइटों की संरचना नाजुक और कठिन थी, इसलिए उनका उपयोग करना बहुत कठिन हो गया हैं। नवंबर 1993 में [[ ALIWEB |अलीवेब]] बनाया जाने वाला पहला सर्च इंजन था (वेब के लिए आर्ची लाइक इंडेक्सिंग)।<ref>{{Cite web |last=CPBI |first=Ryan Shelley |title=वेबसाइट डिज़ाइन का इतिहास: वेब के निर्माण के 30 साल [2022 अपडेट]|url=https://www.smamarketing.net/blog/the-history-of-website-design |access-date=2022-10-12 |website=www.smamarketing.net |language=en-us}}</ref> | |||
==== वेब और वेब डिजाइन की प्रांरम्भ ==== | |||
==== वेब और वेब डिजाइन की | 1989 में, सी ईआरएन में काम करते हुए,[[ टिक बैरनर्स - ली |टिक बैरनर्स - ली]] ने एक वैश्विक[[ हाइपरटेक्स्ट | हाइपरटेक्स्ट]] प्रोजेक्ट बनाने का प्रस्ताव रखा, जिसे बाद में[[ वर्ल्ड वाइड वेब | वर्ल्ड वाइड वेब]] के रूप में जाना जाने लगा था। 1991 से 1993 तक वर्ल्ड वाइड वेब का जन्म हुआ था। [[टेक्स्ट-आधारित[[ वेब ब्राउज़र | वेब ब्राउज़र]]]]| टेक्स्ट-ओनली[[ HTML | एचटीएमएल]] पेजों को एक साधारण लाइन-मोड वेब ब्राउज़र का उपयोग करके देखा जा सकता है।<ref name="World Wide Web">{{cite web | ||
1989 में, | |||
|title=लंबी जीवनी|url=http://www.w3.org/People/Berners-Lee/Longer.html | |title=लंबी जीवनी|url=http://www.w3.org/People/Berners-Lee/Longer.html | ||
|access-date=2012-03-16 | |access-date=2012-03-16 | ||
}}</ref> 1993 में [[ मार्क आंद्रेसेन ]] और [[ एरिक बीना ]] ने [[ मोज़ेक ब्राउज़र ]] बनाया। उस समय कई ब्राउज़र थे, हालाँकि उनमें से अधिकांश यूनिक्स-आधारित और स्वाभाविक रूप से पाठ-भारी थे। [[ ग्राफ़िक डिज़ाइन ]] तत्वों जैसे डिजिटल चित्र या [[ डिजिटल ऑडियो ]] के लिए कोई एकीकृत दृष्टिकोण नहीं था। [[ मोज़ेक (वेब ब्राउज़र) ]] ने इस साँचे को तोड़ | }}</ref> 1993 में[[ मार्क आंद्रेसेन | मार्क आंद्रेसेन]] और [[ एरिक बीना |एरिक बीना]] ने [[ मोज़ेक ब्राउज़र |मोज़ेक ब्राउज़र]] बनाया। उस समय कई ब्राउज़र थे, हालाँकि उनमें से अधिकांश यूनिक्स-आधारित और स्वाभाविक रूप से पाठ-भारी थे। [[ ग्राफ़िक डिज़ाइन |ग्राफ़िक डिज़ाइन]] तत्वों जैसे डिजिटल चित्र या [[ डिजिटल ऑडियो ]]के लिए कोई एकीकृत दृष्टिकोण नहीं था। [[ मोज़ेक (वेब ब्राउज़र) |मोज़ेक (वेब ब्राउज़र)]] ने इस साँचे को तोड़ दिया था।<ref>{{cite web | ||
|title=मोज़ेक ब्राउज़र|url=http://www.techopedia.com/images/pdfs/history-of-the-internet.pdf | |title=मोज़ेक ब्राउज़र|url=http://www.techopedia.com/images/pdfs/history-of-the-internet.pdf | ||
|access-date=2012-03-16 | |access-date=2012-03-16 | ||
| Line 21: | Line 18: | ||
|archive-url=https://web.archive.org/web/20130902095803/http://www.techopedia.com/images/pdfs/history-of-the-internet.pdf | |archive-url=https://web.archive.org/web/20130902095803/http://www.techopedia.com/images/pdfs/history-of-the-internet.pdf | ||
|url-status=dead | |url-status=dead | ||
}}</ref> [[ W3C ]] को अक्टूबर 1994 में बनाया गया था ताकि वर्ल्ड वाइड वेब को सामान्य [[ HTTP ]] विकसित करके इसकी पूरी क्षमता का नेतृत्व किया जा सके जो इसके विकास को बढ़ावा देता है और इसकी इंटरऑपरेबिलिटी # सॉफ्टवेयर सुनिश्चित करता है।<ref>{{cite book | }}</ref> [[ W3C |डब्ल्यू 3 सी]] को अक्टूबर 1994 में बनाया गया था ताकि वर्ल्ड वाइड वेब को सामान्य [[ HTTP |एचटीटीपी]] विकसित करके इसकी पूरी क्षमता का नेतृत्व किया जा सके जो इसके विकास को बढ़ावा देता है और इसकी इंटरऑपरेबिलिटी # सॉफ्टवेयर सुनिश्चित करता है।<ref>{{cite book | ||
|authors=Zwicky, E.D, Cooper, S and Chapman, D.B. | |authors=Zwicky, E.D, Cooper, S and Chapman, D.B. | ||
|title=इंटरनेट फ़ायरवॉल का निर्माण|year=2000 | |title=इंटरनेट फ़ायरवॉल का निर्माण|year=2000 | ||
| Line 29: | Line 26: | ||
|page=[https://archive.org/details/buildinginternet00zwic/page/804 804] | |page=[https://archive.org/details/buildinginternet00zwic/page/804 804] | ||
|url=https://archive.org/details/buildinginternet00zwic/page/804 | |url=https://archive.org/details/buildinginternet00zwic/page/804 | ||
}}</ref> इसने किसी एक कंपनी को एक स्वामित्व वाले ब्राउज़र और [[ प्रोग्रामिंग भाषा ]] पर एकाधिकार करने से हतोत्साहित किया, जो पूरी तरह से वर्ल्ड वाइड वेब के प्रभाव को बदल सकता था। | }}</ref> इसने किसी एक कंपनी को एक स्वामित्व वाले ब्राउज़र और[[ प्रोग्रामिंग भाषा | प्रोग्रामिंग भाषा]] पर एकाधिकार करने से हतोत्साहित किया, जो पूरी तरह से वर्ल्ड वाइड वेब के प्रभाव को बदल सकता था। डब्ल्यू 3 सी मानक निर्धारित करना जारी रखता है, जिसे आज[[ जावास्क्रिप्ट ]]और अन्य भाषाओं के साथ देखा जा सकता है। 1994 में आंद्रेसेन ने मोज़ेक कम्युनिकेशंस कॉर्प का गठन किया जो बाद में [[[[ नेटस्केप |नेटस्केप]] संचार]], नेटस्केप (वेब ब्राउज़र) नेटस्केप 0.9 ब्राउज़र के रूप में जाना जाने लगा थाl नेटस्केप ने पारंपरिक मानकों की प्रक्रिया पर ध्यान दिए बिना अपने स्वयं के एचटीएमएल टैग बनाए। उदाहरण के लिए, नेटस्केप 1.1 में पृष्ठभूमि के रंग बदलने और वेब पेजों पर एचटीएमएल तत्व,तालिकाओं के साथ पाठ को स्वरूपित करने के लिए टैग सम्मिलित थे। 1996 से 1999 तक [[ ब्राउज़र युद्ध ]] प्रांरम्भ हुआ, क्योंकि [[ Microsoft |माइक्रोसॉफ्ट]] और नेटस्केप ने अंतिम ब्राउज़र प्रभुत्व के लिए संघर्ष किया थाl इस समय के दौरान क्षेत्र में कई नई प्रौद्योगिकियां थीं, विशेष रूप से[[ व्यापक शैली पत्रक | व्यापक शैली पत्रक,]] जावास्क्रिप्ट और[[ गतिशील एचटीएमएल ]]कुल मिलाकर, ब्राउज़र प्रतियोगिता ने कई सकारात्मक कृतियों को जन्म दिया और वेब डिज़ाइन को तीव्र गति से विकसित करने में मदद की थीं।<ref name=Browsers >{{cite book | ||
|last=Niederst |first=Jennifer | |last=Niederst |first=Jennifer | ||
|title=वेब डिजाइन संक्षेप में|year=2006|publisher=O'Reilly Media | |title=वेब डिजाइन संक्षेप में|year=2006|publisher=O'Reilly Media | ||
| Line 37: | Line 34: | ||
|url=https://books.google.com/books?id=bdf4vS2n7N8C&q=history+of+web+design&pg=PT42 | |url=https://books.google.com/books?id=bdf4vS2n7N8C&q=history+of+web+design&pg=PT42 | ||
}}</ref> | }}</ref> | ||
==== वेब डिजाइन का विकास ==== | ==== वेब डिजाइन का विकास ==== | ||
1996 में, | 1996 में, माइक्रोसॉफ्ट ने अपना पहला प्रतिस्पर्धी ब्राउज़र जारी किया, जो अपनी विशेषताओं और एचटीएमएल टैग्स के साथ पूर्ण था। यह स्टाइल शीट का समर्थन करने वाला पहला ब्राउज़र भी था, जिसे उस समय एक अस्पष्ट संलेखन तकनीक के रूप में देखा गया था और आज यह वेब डिज़ाइन का एक महत्वपूर्ण पहलू है।<ref name=Browsers/> एचटीएमएल एलिमेंट # टेबल्स के लिए एचटीएमएल मार्कअप मूल रूप से सारणीबद्ध डेटा प्रदर्शित करने के लिए था। यदपि, डिजाइनरों ने जटिल, बहु-स्तंभ लेआउट बनाने के लिए एचटीएमएल तालिकाओं का उपयोग करने की क्षमता को जल्दी से महसूस किया जो अन्यथा संभव नहीं था। इस समय, जैसा कि डिजाइन और अच्छे सौंदर्यशास्त्र को अच्छी मार्कअप संरचना पर प्राथमिकता दी गई थी, सिमेंटिक्स और वेब एक्सेसिबिलिटी पर थोड़ा ध्यान दिया गया था. एचटीएमएल साइटें अपने डिज़ाइन विकल्पों में सीमित थीं, एचटीएमएल जटिल डिज़ाइन बनाने के लिए, कई वेब डिज़ाइनरों को जटिल टेबल संरचनाओं का उपयोग करना पड़ा या यहाँ तक कि रिक्त [[स्पेसर .GIF] का भी उपयोग करना पड़ा रिक्त तालिका कक्षों को ढहने से रोकने के लिए चित्र।<ref name="Chapman, Evolution" >{{citation |last=Chapman |first=Cameron |title=The Evolution of Web Design |url=http://sixrevisions.com/web_design/the-evolution-of-web-design/|publisher=Six Revisions|archive-url=https://web.archive.org/web/20131030030802/http://sixrevisions.com/web_design/the-evolution-of-web-design/ |archive-date=30 October 2013}}</ref> [[ CSS |सीएसएस]] को दिसंबर 1996 में डब्ल्यू 3 सी द्वारा प्रस्तुति और लेआउट का समर्थन करने के लिए पेश किया गया था। इसने एचटीएमएल कोड को सिमेंटिक और प्रेजेंटेशनल और बेहतर वेब एक्सेसिबिलिटी दोनों के बजाय सिमेंटिक होने की अनुमति दी,[[ टेबललेस वेब डिज़ाइन ]] देखें। | ||
1996 में, [[ Adobe Flash |एडोब फ्लैश]] (मूल रूप से फ्यूचरस्प्लैश के रूप में जाना जाता था) विकसित किया गया था। उस समय, फ्लैश कंटेंट डेवलपमेंट टूल अब की तुलना में अपेक्षाकृत सरल था, जिसमें बेसिक लेआउट और ड्राइंग टूल्स,[[ ActionScript | एक्शन स्क्रिप्ट]] के लिए एक सीमित अग्रदूत और एक टाइमलाइन का उपयोग किया गया था, लेकिन इसने वेब डिजाइनरों को एचटीएमएल, ग्राफिक्स इंटरचेंज फॉर्मेट के बिंदु से आगे जाने में सक्षम बनाया था। एनिमेटेड जीआईएफ और जावास्क्रिप्ट। यदपि, क्योंकि फ्लैश को एक [[ प्लग-इन (कंप्यूटिंग) ]]|प्लग-इन की आवश्यकता थी, इसलिए कई वेब डेवलपर्स अनुकूलता की कमी के कारण अपनी बाजार हिस्सेदारी को सीमित करने के डर से इसका उपयोग करने से बचते रहे। इसके बजाय, डिजाइनरों ने जीआईएफ एनिमेशन (यदि वे[[ गति ग्राफिक्स ]] का पूरी तरह से उपयोग नहीं करते हैं) और [[ सॉफ्टवेयर विजेट ]] के लिए जावास्क्रिप्ट पर वापस लौट आए। लेकिन फ्लैश के लाभों ने इसे विशिष्ट लक्षित बाजारों के बीच काफी लोकप्रिय बना दिया, जो अंततः ब्राउज़रों के विशाल बहुमत के लिए अपना काम करता है, और पूरी साइटों को विकसित करने के लिए पर्याप्त शक्तिशाली है।<ref name="Chapman, Evolution" /> | |||
==== पहले ब्राउज़र युद्धों का अंत ==== | ==== पहले ब्राउज़र युद्धों का अंत ==== | ||
{{Further| | {{Further|ब्राउज़र युद्ध,पहला ब्राउज़र युद्ध (1995–2001)}} | ||
1998 में, नेटस्केप ने [[ ओपन-सोर्स लाइसेंस ]] के तहत नेटस्केप कम्युनिकेटर कोड जारी किया ओपन-सोर्स लाइसेंस, हजारों डेवलपर्स को सॉफ्टवेयर में सुधार करने में भाग लेने में सक्षम बनाता है। | 1998 में, नेटस्केप ने [[ ओपन-सोर्स लाइसेंस |ओपन-सोर्स लाइसेंस]] के तहत नेटस्केप कम्युनिकेटर कोड जारी किया ओपन-सोर्स लाइसेंस, हजारों डेवलपर्स को सॉफ्टवेयर में सुधार करने में भाग लेने में सक्षम बनाता है। यदपि, इन डेवलपर्स ने वेब के लिए स्क्रैच से एक मानक प्रांरम्भ करने का फैसला किया, जिसने ओपन-सोर्स ब्राउज़र के विकास को निर्देशित किया और जल्द ही एक पूर्ण एप्लिकेशन प्लेटफॉर्म तक विस्तारित हो गया।<ref name="Browsers" /> [[ वेब मानक परियोजना |वेब मानक परियोजना]] बनाई गई थी और लेआउट इंजनों की तुलना (एचटीएमएल) और लेआउट इंजनों की तुलना (कैस्केडिंग स्टाइल शीट्स) मानकों के साथ ब्राउज़र अनुपालन को बढ़ावा दिया गया था। वेब मानकों के अनुपालन के लिए ब्राउज़रों का परीक्षण करने के लिए[[ अम्ल1 | अम्ल1]],[[ निश्चित | निश्चित]] और[[ रखूंगा | रखूंगा]] जैसे प्रोग्राम बनाए गए थे। 2000 में, मैक के लिए इंटरनेट एक्सप्लोरर जारी किया गया था, जो पहला ब्राउज़र था जो एचटीएमएल 4.01 और सीएसएस 1 का पूरी तरह से समर्थन करता था। यह [[ पोर्टेबल नेटवर्क ग्राफ़िक्स ]] छवि प्रारूप का पूरी तरह से समर्थन करने वाला पहला ब्राउज़र भी था।<ref name="Browsers" />2001 तक, माइक्रोसॉफ्ट द्वारा इंटरनेट एक्सप्लोरर को लोकप्रिय बनाने के एक अभियान के बाद, इंटरनेट एक्सप्लोरर वेब ब्राउज़रों के 96% उपयोग हिस्से तक पहुंच गया था, जिसने पहले ब्राउज़र युद्धों के अंत का संकेत दिया क्योंकि इंटरनेट एक्सप्लोरर में कोई वास्तविक प्रतिस्पर्धा नहीं थी।<ref>{{Cite web|title=AMO.NET अमेरिका का मल्टीमीडिया ऑनलाइन (इंटरनेट एक्सप्लोरर 6 पूर्वावलोकन)|url=http://amo.net/NT/01-30-01MSFTIE6.html|website=amo.net|access-date=2020-05-27}}</ref> | ||
===2001–2012=== | ===2001–2012=== | ||
21वीं सदी की | 21वीं सदी की प्रांरम्भ के बाद से, वेब लोगों के जीवन में अधिक से अधिक एकीकृत हो गया है। जैसा कि हुआ है, वेब की तकनीक भी आगे बढ़ गई है। लोगों द्वारा वेब का उपयोग करने और उस तक पहुंचने के तरीके में भी महत्वपूर्ण परिवर्तन हुए हैं, और इसने साइटों को डिज़ाइन करने के तरीके को भी बदल दिया है। | ||
ब्राउज़र युद्धों के अंत के बाद से | ब्राउज़र युद्धों के अंत के बाद से नए ब्राउज़र जारी किए गए हैं। इनमें से कई[[ खुला स्रोत सॉफ्टवेयर | खुला स्रोत सॉफ्टवेयर]] हैं, जिसका अर्थ है कि वे तेजी से विकास करते हैं और नए मानकों के अधिक समर्थक हैं। नए विकल्पों पर कई लोगों ने विचार किया है माइक्रोसॉफ्ट के[[ इंटरनेट एक्स्प्लोरर | इंटरनेट एक्स्प्लोरर]] से बेहतर होने के लिए। | ||
[[ विश्वव्यापी वेब संकाय ]] ने | [[ विश्वव्यापी वेब संकाय |विश्वव्यापी वेब संकाय]] ने एचटीएमएल ([[ HTML5 |एचटीएमएल5]]) और सीएसएस ([[ CSS3 |सीएसएस3]]) के लिए नए मानक जारी किए हैं, साथ ही नए जावास्क्रिप्ट एप्लिकेशन प्रोग्रामिंग इंटरफ़ेस एपीआई, प्रत्येक एक नए लेकिन व्यक्तिगत मानक के रूप में है। जबकि एचटीएमएल5 शब्द का उपयोग केवल एचटीएमएल के नए संस्करण और कुछ जावास्क्रिप्ट एपीआई को संदर्भित करने के लिए किया जाता है, नए मानकों (एचटीएमएल5, सी एसएस3 और जावास्क्रिप्ट) के पूरे सूट को संदर्भित करने के लिए इसका उपयोग करना आम हो गया है। | ||
=== 2012 और बाद में === | === 2012 और बाद में === | ||
3जी और एलटीई इंटरनेट कवरेज में सुधार के साथ, वेबसाइट ट्रैफिक का एक बड़ा हिस्सा मोबाइल जनित हो | 3जी और एलटीई इंटरनेट कवरेज में सुधार के साथ, वेबसाइट ट्रैफिक का एक बड़ा हिस्सा मोबाइल जनित हो गया था। इसने वेब डिज़ाइन उद्योग को प्रभावित किया, इसे एक न्यूनतर, हल्का और सरलीकृत शैली की ओर धकेल दिया। विशेष रूप से, मोबाइल फर्स्ट एप्रोच उभरा, जिसका तात्पर्य पहले मोबाइल-उन्मुख लेआउट के साथ वेबसाइट डिज़ाइन बनाना है, और फिर इसे उच्च स्क्रीन आयामों के अनुकूल बनाना है। | ||
== उपकरण और प्रौद्योगिकियां == | == उपकरण और प्रौद्योगिकियां == | ||
वेब डिज़ाइनर उत्पादन प्रक्रिया के किस हिस्से में | वेब डिज़ाइनर उत्पादन प्रक्रिया के किस हिस्से में सम्मिलित हैं, इसके आधार पर विभिन्न प्रकार के विभिन्न उपकरणों का उपयोग करते हैं। ये उपकरण नए मानकों और सॉफ़्टवेयर द्वारा समय के साथ अद्यतन किए जाते हैं लेकिन उनके पीछे के सिद्धांत समान रहते हैं। वेब डिज़ाइनर वेब-स्वरूपित इमेजरी या डिज़ाइन प्रोटोटाइप बनाने के [[ वेक्टर ग्राफिक्स संपादक ]] संपादक और रेखापुंज ग्राफ़िक्स संपादक ग्राफ़िक्स संपादक दोनों का उपयोग करते हैं।[[ WYSIWYG | वैसिविग]][[ वेबसाइट निर्माता | वेबसाइट निर्माता]] सॉफ़्टवेयर या[[ सामग्री प्रबंधन प्रणाली ]] का उपयोग करके एक वेबसाइट बनाई जा सकती है, या अलग-अलग वेब पेजों को भाषा की वृद्धि हाथ से कोडित किया जा सकता है, जैसे कि पहले वेब पेज बनाए गए थे। अन्य उपकरण जो वेब डिज़ाइनर उपयोग कर सकते हैं उनमें मार्कअप एचटीएमएल सत्यापनकर्ता सम्मिलित हैं<ref name="W3C_validator">{{cite web|title=W3C मार्कअप सत्यापन सेवा|url=http://validator.w3.org/}}</ref> और उपयोगिता और पहुंच के लिए अन्य परीक्षण उपकरण यह सुनिश्चित करने के लिए कि उनकी वेबसाइटें वेब पहुंच-योग्यता दिशानिर्देशों को पूरा करती हैं। रेफरी>{{cite web|last=डब्ल्यू3 सी|title=वेब एक्सेसिबिलिटी इनिशिएटिव|url=http://www.w3.org/WAI/}} | ||
=== यूएक्स डिजाइन === | === यूएक्स डिजाइन === | ||
वेब डिज़ाइन में एक लोकप्रिय टूल | वेब डिज़ाइन में एक लोकप्रिय टूल यूएक्स डिज़ाइन है, यह एक प्रकार की कला है जो सटीक उपयोगकर्ता पृष्ठभूमि के प्रदर्शन के लिए उत्पादों को डिज़ाइन करती है। यूएक्स डिजाइन बहुत गहरा है। यूएक्स वेब से कहीं अधिक है, यह बहुत स्वतंत्र है, और इसके मूलभूत सिद्धांतों को कई अन्य ब्राउज़रों या ऐप्स पर लागू किया जा सकता है। वेब डिजाइन ज्यादातर वेब आधारित चीजों पर आधारित होता है। यूएक्स वेब डिज़ाइन और डिज़ाइन दोनों को अतिव्यापन कर सकता है। यूएक्स डिजाइन ज्यादातर उन उत्पादों पर केंद्रित है जो कम वेब आधारित हैं।<ref>{{Cite web |title=वेब डिज़ाइन क्या है?|url=https://www.interaction-design.org/literature/topics/web-design |access-date=2022-10-12 |website=The Interaction Design Foundation |language=en}}</ref> | ||
== कौशल और तकनीक == | == कौशल और तकनीक == | ||
=== विपणन और संचार डिजाइन === | ====== विपणन और संचार डिजाइन ====== | ||
किसी वेबसाइट पर मार्केटिंग और संचार डिज़ाइन यह पहचान सकता है कि उसके लक्षित बाज़ार के लिए क्या काम करता है। यह एक आयु वर्ग या संस्कृति की विशेष धारा हो सकती है; इस प्रकार डिजाइनर अपने दर्शकों के रुझान को समझ सकता है। डिज़ाइनर यह भी समझ सकते हैं कि वे किस प्रकार की वेबसाइट डिज़ाइन कर रहे हैं, उदाहरण के लिए, (बी2बी) व्यवसाय-से-व्यवसाय वेबसाइट डिज़ाइन विचार उपभोक्ता-लक्षित वेबसाइट जैसे [[ खुदरा ]] या मनोरंजन वेबसाइट से बहुत भिन्न हो सकते हैं। यह सुनिश्चित करने के लिए सावधानीपूर्वक विचार किया जा सकता है कि किसी साइट का सौंदर्यशास्त्र या समग्र डिजाइन सामग्री की स्पष्टता और सटीकता या [[ वेब नेविगेशन ]] की आसानी से टकराता नहीं है,<ref>{{cite journal|last=THORLACIUS|first=LISBETH|title=वेब डिजाइन में सौंदर्यशास्त्र की भूमिका|journal=Nordicom Review|year=2007|volume=28|issue=28|pages=63–76|doi=10.1515/nor-2017-0201|s2cid=146649056|doi-access=free}}</ref> विशेष रूप से B2B वेबसाइट पर। डिजाइनर उस मालिक या व्यवसाय की प्रतिष्ठा पर भी विचार कर सकते हैं जो साइट यह सुनिश्चित करने के लिए प्रतिनिधित्व कर रही है कि उन्हें अनुकूल रूप से चित्रित किया गया है। वेब डिज़ाइनर | किसी वेबसाइट पर मार्केटिंग और संचार डिज़ाइन यह पहचान सकता है कि उसके लक्षित बाज़ार के लिए क्या काम करता है। यह एक आयु वर्ग या संस्कृति की विशेष धारा हो सकती है; इस प्रकार डिजाइनर अपने दर्शकों के रुझान को समझ सकता है। डिज़ाइनर यह भी समझ सकते हैं कि वे किस प्रकार की वेबसाइट डिज़ाइन कर रहे हैं, उदाहरण के लिए, (बी2बी) व्यवसाय-से-व्यवसाय वेबसाइट डिज़ाइन विचार उपभोक्ता-लक्षित वेबसाइट जैसे[[ खुदरा | खुदरा]] या मनोरंजन वेबसाइट से बहुत भिन्न हो सकते हैं। यह सुनिश्चित करने के लिए सावधानीपूर्वक विचार किया जा सकता है कि किसी साइट का सौंदर्यशास्त्र या समग्र डिजाइन सामग्री की स्पष्टता और सटीकता या [[ वेब नेविगेशन |वेब नेविगेशन]] की आसानी से टकराता नहीं है,<ref>{{cite journal|last=THORLACIUS|first=LISBETH|title=वेब डिजाइन में सौंदर्यशास्त्र की भूमिका|journal=Nordicom Review|year=2007|volume=28|issue=28|pages=63–76|doi=10.1515/nor-2017-0201|s2cid=146649056|doi-access=free}}</ref> विशेष रूप से B2B वेबसाइट पर। डिजाइनर उस मालिक या व्यवसाय की प्रतिष्ठा पर भी विचार कर सकते हैं जो साइट यह सुनिश्चित करने के लिए प्रतिनिधित्व कर रही है कि उन्हें अनुकूल रूप से चित्रित किया गया है। वेब डिज़ाइनर सामान्यतः उन सभी वेबसाइटों की देखरेख करते हैं जो इस आधार पर बनाई जाती हैं कि वे कैसे काम करती हैं या चीजों पर काम करती हैं। वे पर्दे के पीछे से वेबसाइटों पर लगातार सब कुछ अपडेट और बदल रहे हैं। उनके द्वारा किए जाने वाले सभी तत्व टेक्स्ट, फोटो, ग्राफिक्स और वेब का लेआउट हैं। वेबसाइट पर काम प्रांरम्भ करने से पहले, वेब डिज़ाइनर सामान्यतः लेआउट, रंग, ग्राफिक्स और डिज़ाइन पर चर्चा करने के लिए अपने क्लाइंट के साथ अपॉइंटमेंट सेट करते हैं। वेब डिज़ाइनर अपना अधिकांश समय वेबसाइटों को डिज़ाइन करने और यह सुनिश्चित करने में लगाते हैं कि गति सही है। वेब डिज़ाइनर सामान्यतः वेबसाइटों को बनाने और वेबसाइटों के लिए सही तत्वों को खोजने के बारे में अन्य डिजाइनरों के साथ परीक्षण और कार्य, विपणन और संचार में संलग्न होते हैं।<ref>{{Cite web |title=वेब डिज़ाइनर क्या है? (2022 गाइड)|url=https://brainstation.io/career-guides/what-is-a-web-designer |access-date=2022-10-28 |website=BrainStation® |language=en-US}}</ref> | ||
=== उपयोगकर्ता अनुभव डिजाइन और [[ इंटरैक्टिव डिजाइन ]] === | === उपयोगकर्ता अनुभव डिजाइन और [[ इंटरैक्टिव डिजाइन ]] === | ||
वेबसाइट की सामग्री के बारे में उपयोगकर्ता की समझ | वेबसाइट की सामग्री के बारे में उपयोगकर्ता की समझ प्रायः उपयोगकर्ता की समझ पर निर्भर करती है कि वेबसाइट कैसे काम करती है। यह उपयोगकर्ता अनुभव डिजाइन का हिस्सा है। उपयोगकर्ता अनुभव एक वेबसाइट पर लेआउट, स्पष्ट निर्देश और लेबलिंग से संबंधित है। उपयोगकर्ता कितनी अच्छी तरह समझता है कि वे साइट पर कैसे इंटरैक्ट कर सकते हैं, यह साइट के इंटरैक्टिव डिज़ाइन पर भी निर्भर हो सकता है। यदि कोई उपयोगकर्ता वेबसाइट की उपयोगिता को समझता है, तो इसकी अधिक संभावना है कि वे इसका उपयोग करना जारी रखेंगे। जो उपयोगकर्ता वेबसाइट के उपयोग में कुशल और अच्छी तरह से वाकिफ हैं, वे अधिक विशिष्ट, फिर भी कम सहज या कम उपयोगिता पा सकते हैं। फिर भी उपयोगकर्ता के अनुकूल वेबसाइट इंटरफ़ेस उपयोगी है। यदपि , कम अनुभव वाले उपयोगकर्ताओं को कम सहज वेबसाइट इंटरफ़ेस के फायदे या उपयोगिता देखने की संभावना कम होती है। यह अधिक सार्वभौमिक उपयोगकर्ता अनुभव और उपयोगकर्ता कौशल की परवाह किए बिना अधिक से अधिक उपयोगकर्ताओं को समायोजित करने के लिए उपयोग में आसानी के लिए प्रवृत्ति को चलाता है।<ref>{{cite journal|last1=Castañeda|first1=J.A Francisco |last2=Muñoz-Leiva|first2=Teodoro Luque|title=वेब स्वीकृति मॉडल (डब्ल्यूएएम): उपयोगकर्ता अनुभव के मॉडरेटिंग प्रभाव|journal=Information & Management |year=2007 |volume=44 |issue=4 |pages=384–396|doi=10.1016/j.im.2007.02.003}}</ref> अधिकांश उपयोगकर्ता अनुभव डिज़ाइन और इंटरैक्टिव डिज़ाइन को यूज़र इंटरफ़ेस डिज़ाइन में माना जाता है। | ||
उन्नत इंटरैक्टिव कार्यों के लिए प्लग-इन (कंप्यूटिंग) की आवश्यकता हो सकती है | प्लग-इन यदि उन्नत कोडिंग भाषा कौशल नहीं है। यह चुनना कि अन्तरक्रियाशीलता का उपयोग करना है या नहीं जिसके लिए प्लग-इन की आवश्यकता होती है, उपयोगकर्ता अनुभव डिज़ाइन में एक महत्वपूर्ण निर्णय है। यदि प्लग-इन अधिकांश ब्राउज़रों के साथ पहले से इंस्टॉल नहीं आता है, तो एक जोखिम है कि उपयोगकर्ता के पास सामग्री तक पहुँचने के लिए प्लग-इन स्थापित करने के बारे में न तो जानकारी होगी और न ही धैर्य होगा। यदि फ़ंक्शन को उन्नत कोडिंग भाषा कौशल की आवश्यकता होती है, तो फ़ंक्शन उपयोगकर्ता अनुभव में वृद्धि की मात्रा की तुलना में कोड के लिए समय या धन में बहुत महंगा हो सकता है। एक जोखिम यह भी है कि उन्नत अन्तरक्रियाशीलता पुराने ब्राउज़रों या हार्डवेयर कॉन्फ़िगरेशन के साथ असंगत हो सकती है। किसी ऐसे फ़ंक्शन को प्रकाशित करना जो मज़बूती से काम नहीं करता है, उपयोगकर्ता के अनुभव के लिए कोई प्रयास न करने की तुलना में संभावित रूप से खराब है। यह लक्षित दर्शकों पर निर्भर करता है कि क्या इसकी आवश्यकता होने या किसी जोखिम के लायक होने की संभावना है। | उन्नत इंटरैक्टिव कार्यों के लिए प्लग-इन (कंप्यूटिंग) की आवश्यकता हो सकती है | प्लग-इन यदि उन्नत कोडिंग भाषा कौशल नहीं है। यह चुनना कि अन्तरक्रियाशीलता का उपयोग करना है या नहीं जिसके लिए प्लग-इन की आवश्यकता होती है, उपयोगकर्ता अनुभव डिज़ाइन में एक महत्वपूर्ण निर्णय है। यदि प्लग-इन अधिकांश ब्राउज़रों के साथ पहले से इंस्टॉल नहीं आता है, तो एक जोखिम है कि उपयोगकर्ता के पास सामग्री तक पहुँचने के लिए प्लग-इन स्थापित करने के बारे में न तो जानकारी होगी और न ही धैर्य होगा। यदि फ़ंक्शन को उन्नत कोडिंग भाषा कौशल की आवश्यकता होती है, तो फ़ंक्शन उपयोगकर्ता अनुभव में वृद्धि की मात्रा की तुलना में कोड के लिए समय या धन में बहुत महंगा हो सकता है। एक जोखिम यह भी है कि उन्नत अन्तरक्रियाशीलता पुराने ब्राउज़रों या हार्डवेयर कॉन्फ़िगरेशन के साथ असंगत हो सकती है। किसी ऐसे फ़ंक्शन को प्रकाशित करना जो मज़बूती से काम नहीं करता है, उपयोगकर्ता के अनुभव के लिए कोई प्रयास न करने की तुलना में संभावित रूप से खराब है। यह लक्षित दर्शकों पर निर्भर करता है कि क्या इसकी आवश्यकता होने या किसी जोखिम के लायक होने की संभावना है। | ||
| Line 80: | Line 68: | ||
=== प्रगतिशील वृद्धि === | === प्रगतिशील वृद्धि === | ||
[[File:Progressive enhancement web design pyramid (HTML, CSS, JS).svg|thumb|प्रगतिशील वृद्धि का क्रम]] | [[File:Progressive enhancement web design pyramid (HTML, CSS, JS).svg|thumb|प्रगतिशील वृद्धि का क्रम]] | ||
{{main article| | {{main article|प्रगतिशील वृद्धि}} | ||
प्रगतिशील वृद्धि वेब डिज़ाइन में एक रणनीति है जो पहले [[ वेब सामग्री ]] पर जोर देती है, जिससे[[ यूनिवर्सल डिजाइन ]] को वेब पेज की मूल सामग्री और कार्यक्षमता की अनुमति मिलती है, जबकि[[ उपयोगकर्ता (कंप्यूटिंग) ]] अतिरिक्त ब्राउज़र सुविधाओं या तेज़ इंटरनेट एक्सेस के साथ उन्नत संस्करण प्राप्त करते हैं। | |||
व्यवहार में, इसका अर्थ है | व्यवहार में, इसका अर्थ है एचटीएमएल के माध्यम से सामग्री परोसना और सीएसएस के माध्यम से स्टाइलिंग और एनीमेशन को तकनीकी रूप से संभव सीमा तक लागू करना, फिर जावास्क्रिप्ट के माध्यम से और संवर्द्धन लागू करना। पृष्ठों के पाठ को तुरंत एचटीएमएल स्रोत कोड के माध्यम से लोड किया जाता है, इसके बजाय सामग्री को आरंभ करने और सामग्री को लोड करने के लिए जावास्क्रिप्ट की प्रतीक्षा करने के बजाय, जो सामग्री को न्यूनतम लोडिंग समय और बैंडविड्थ के साथ और पाठ-आधारित ब्राउज़र के माध्यम से पढ़ने योग्य होने की अनुमति देता है, और पश्चगामी संगतता को अधिकतम करता है।<ref>{{cite web |title=प्रगतिशील संवर्द्धन का उपयोग करके एक लचीला दृश्यपटल का निर्माण|url=https://www.gov.uk/service-manual/technology/using-progressive-enhancement |website=GOV.UK |access-date=27 October 2021 |language=en}}</ref> एक उदाहरण के रूप में, विकिपीडिया सहित [[ मीडियाविकि |मीडियाविकि]] आधारित साइटें प्रगतिशील संवर्द्धन का उपयोग करती हैं, क्योंकि जावास्क्रिप्ट और यहां तक कि सीएसएस के निष्क्रिय होने पर भी वे प्रयोग करने योग्य रहते हैं, क्योंकि पृष्ठों की सामग्री पृष्ठ के एचटीएमएल स्रोत कोड में सम्मिलित होती है, जबकि प्रति-उदाहरण एवरपीडिया पृष्ठों को लोड करने के लिए जावास्क्रिप्ट पर निर्भर करता है। 'सामग्री बाद में; जावास्क्रिप्ट निष्क्रिय के साथ एक खाली पृष्ठ दिखाई देता है। | ||
=== [[ पेज लेआउट ]] === | === [[ पेज लेआउट | पृष्ठ अभिन्यास]] === | ||
उपयोगकर्ता इंटरफ़ेस डिज़ाइन का एक भाग पृष्ठ लेआउट की गुणवत्ता से प्रभावित होता है। उदाहरण के लिए, एक डिज़ाइनर इस बात पर विचार कर सकता है कि लेआउट डिज़ाइन करते समय साइट का पृष्ठ लेआउट विभिन्न पृष्ठों पर संगत रहना चाहिए या नहीं। लेआउट डिज़ाइन में ऑब्जेक्ट्स को संरेखित करने के लिए पृष्ठ पिक्सेल चौड़ाई को भी महत्वपूर्ण माना जा सकता है। सबसे लोकप्रिय निश्चित-चौड़ाई वाली वेबसाइटों में | उपयोगकर्ता इंटरफ़ेस डिज़ाइन का एक भाग पृष्ठ लेआउट की गुणवत्ता से प्रभावित होता है। उदाहरण के लिए, एक डिज़ाइनर इस बात पर विचार कर सकता है कि लेआउट डिज़ाइन करते समय साइट का पृष्ठ लेआउट विभिन्न पृष्ठों पर संगत रहना चाहिए या नहीं। लेआउट डिज़ाइन में ऑब्जेक्ट्स को संरेखित करने के लिए पृष्ठ पिक्सेल चौड़ाई को भी महत्वपूर्ण माना जा सकता है। सबसे लोकप्रिय निश्चित-चौड़ाई वाली वेबसाइटों में सामान्यतः वर्तमान सबसे लोकप्रिय मॉनिटर आकार पर, वर्तमान सबसे लोकप्रिय स्क्रीन रिज़ॉल्यूशन पर, वर्तमान सबसे लोकप्रिय ब्राउज़र विंडो से मिलान करने के लिए समान सेट चौड़ाई होती है। बड़ी स्क्रीन पर सौंदर्यशास्त्र की चिंताओं के लिए अधिकांश पृष्ठ केंद्र-संरेखित हैं। | ||
पाठक की स्क्रीन (खिड़की का आकार, खिड़की के सापेक्ष फ़ॉन्ट आकार, आदि) के विवरण के आधार पर द्रव लेआउट के लिए ब्राउज़र को उपयोगकर्ता-विशिष्ट लेआउट समायोजन करने की अनुमति देने के लिए 2000 के आसपास द्रव लेआउट की लोकप्रियता में वृद्धि | पाठक की स्क्रीन (खिड़की का आकार, खिड़की के सापेक्ष फ़ॉन्ट आकार, आदि) के विवरण के आधार पर द्रव लेआउट के लिए ब्राउज़र को उपयोगकर्ता-विशिष्ट लेआउट समायोजन करने की अनुमति देने के लिए 2000 के आसपास द्रव लेआउट की लोकप्रियता में वृद्धि हुई थी वे एचटीएमएल-टेबल-आधारित लेआउट और [[ ग्रिड (पेज लेआउट) | ग्रिड (पृष्ठ अभिन्यास)]] के विकल्प के रूप में विकसित हुए। पृष्ठ अभिन्यास डिजाइन सिद्धांतों और कोडिंग तकनीक दोनों में ग्रिड-आधारित डिज़ाइन लेकिन अपनाने में बहुत धीमी थी।<ref group="note" ><code><table></code>-based markup and [[spacer .GIF]] images</ref> यह [[ स्क्रीन रीडर ]] और अलग-अलग खिड़कियों के आकार के कारण था, जिस पर डिजाइनरों का कोई नियंत्रण नहीं है। तदनुसार, एक डिज़ाइन को इकाइयों (साइडबार, सामग्री ब्लॉक, [[ वेब बैनर |वेब बैनर]] क्षेत्र, नेविगेशन क्षेत्र) में विभाजित किया जा सकता है जो कि ब्राउज़र को भेजे जाते हैं और जो ब्राउज़र द्वारा डिस्प्ले विंडो में फिट किया जाएगा, जितना अच्छा हो सकता है। यदपि इस तरह का प्रदर्शन प्रायः प्रमुख सामग्री इकाइयों की सापेक्ष स्थिति को बदल सकता है, साइडबार इसके किनारे की बजाय [[ मुख्य भाग ]] के नीचे विस्थापित हो सकते हैं। यह हार्ड-कोडेड ग्रिड-आधारित लेआउट की तुलना में अधिक लचीला प्रदर्शन है जो डिवाइस विंडो में फिट नहीं होता है। विशेष रूप से, ब्लॉक के भीतर सामग्री को अप्रभावित रखते हुए सामग्री ब्लॉक की सापेक्ष स्थिति बदल सकती है। यह पृष्ठ को क्षैतिज रूप से स्क्रॉल करने के लिए उपयोगकर्ता की आवश्यकता को भी कम करता है। | ||
उत्तरदायी वेब डिज़ाइन | उत्तरदायी वेब डिज़ाइन सी एसएस3 पर आधारित एक नया दृष्टिकोण है, और सीएसएस के उन्नत उपयोग के माध्यम से पृष्ठ की स्टाइल शीट के भीतर प्रति-उपकरण विनिर्देश का एक गहरा स्तर है। <code>@media</code> नियम मार्च 2018 में गूगल ने घोषणा की कि वे मोबाइल-फर्स्ट इंडेक्सिंग प्रांरम्भ करेंगे।<ref>{{Cite news|url=https://webmasters.googleblog.com/2018/03/rolling-out-mobile-first-indexing.html|title=मोबाइल-फर्स्ट इंडेक्सिंग को रोल आउट किया जा रहा है|work=Official Google Webmaster Central Blog|access-date=2018-06-09|language=en-US}}</ref> उत्तरदायी डिज़ाइन का उपयोग करने वाली साइटें यह सुनिश्चित करने के लिए अच्छी स्थिति में हैं कि वे इस नए दृष्टिकोण को पूरा करती हैं। | ||
=== टाइपोग्राफी === | === टाइपोग्राफी === | ||
{{Main| | {{Main|टाइपोग्राफी}} | ||
वेब डिज़ाइनर [[ टाइपफ़ेस ]] की एक विस्तृत श्रृंखला या टाइपफेस # टाइपफेस की शैली का उपयोग करने के बजाय वेबसाइट टाइपफेस की विविधता को केवल कुछ समान शैली तक सीमित करना चुन सकते हैं। अधिकांश ब्राउज़र एक विशिष्ट संख्या में सुरक्षित फोंट को पहचानते हैं, जो डिजाइनर मुख्य रूप से जटिलताओं से बचने के लिए उपयोग करते हैं। | वेब डिज़ाइनर[[ टाइपफ़ेस | टाइपफ़ेस]] की एक विस्तृत श्रृंखला या टाइपफेस # टाइपफेस की शैली का उपयोग करने के बजाय वेबसाइट टाइपफेस की विविधता को केवल कुछ समान शैली तक सीमित करना चुन सकते हैं। अधिकांश ब्राउज़र एक विशिष्ट संख्या में सुरक्षित फोंट को पहचानते हैं, जो डिजाइनर मुख्य रूप से जटिलताओं से बचने के लिए उपयोग करते हैं। | ||
फ़ॉन्ट डाउनलोडिंग को बाद में सी एसएस3 के फोंट मॉड्यूल में सम्मिलित किया गया था और तब से इसे सफारी 3.1, ओपेरा 10 और मोज़िला फ़ायरफ़ॉक्स 3.5 में लागू किया गया है। इसने बाद में[[ वेब टाइपोग्राफी | वेब टाइपोग्राफी]] के साथ-साथ फ़ॉन्ट डाउनलोडिंग के उपयोग में रुचि बढ़ाई है। | |||
अधिकांश साइट लेआउट पाठ को पैराग्राफ में विभाजित करने के लिए नकारात्मक स्थान सम्मिलित करते हैं और केंद्र-संरेखित पाठ से भी बचते हैं।<ref>{{cite web|last=Stone|first=John|title=प्रभावी वेब टाइपोग्राफी के 20 क्या करें और क्या न करें| url=http://webdesignledger.com/tips/20-dos-and-donts-of-effective-web-typography|access-date=2012-03-19|date=2009-11-16}}</ref> | |||
=== मोशन ग्राफिक्स === | === मोशन ग्राफिक्स === | ||
मोशन ग्राफिक्स के उपयोग से | मोशन ग्राफिक्स के उपयोग से पृष्ठ अभिन्यास और यूजर इंटरफेस भी प्रभावित हो सकते हैं। गति ग्राफिक्स का उपयोग करने या न करने का विकल्प वेबसाइट के लिए लक्षित बाजार पर निर्भर हो सकता हैl मोशन ग्राफिक्स की अपेक्षा की जा सकती है या कम से कम मनोरंजन-उन्मुख वेबसाइट के साथ बेहतर प्राप्त किया जा सकता है। यदपि , अधिक गंभीर या औपचारिक रुचि (जैसे व्यवसाय, समुदाय, या सरकार) के साथ दर्शकों को लक्षित करने वाली वेबसाइट को केवल मनोरंजन या सजावट के उद्देश्यों के लिए एनिमेशन अनावश्यक और विचलित करने वाला लग सकता है। इसका मतलब यह नहीं है कि अधिक गंभीर सामग्री को एनिमेटेड या वीडियो प्रस्तुतियों के साथ बढ़ाया नहीं जा सकता है जो सामग्री के लिए प्रासंगिक है। किसी भी मामले में,[[ गति ग्राफिक डिजाइन | गति ग्राफिक डिजाइन]] अधिक प्रभावी दृश्यों या विचलित करने वाले दृश्यों के बीच अंतर कर सकता है। | ||
मोशन ग्राफिक्स जो साइट विज़िटर द्वारा प्रांरम्भ नहीं किए गए हैं, वे एक्सेसिबिलिटी के मुद्दे पैदा कर सकते हैं। वर्ल्ड वाइड वेब कंसोर्टियम एक्सेसिबिलिटी मानकों के लिए आवश्यक है कि साइट विज़िटर एनिमेशन को अक्षम करने में सक्षम हों।<ref>[http://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-pause.html World Wide Web Consortium: Understanding Web Content Accessibility Guidelines 2.2.2: Pause, Stop, Hide]</ref> | |||
=== कोड की गुणवत्ता === | === कोड की गुणवत्ता === | ||
वेबसाइट डिजाइनर इसे मानकों के अनुरूप होना अच्छा अभ्यास मान सकते हैं। यह | वेबसाइट डिजाइनर इसे मानकों के अनुरूप होना अच्छा अभ्यास मान सकते हैं। यह सामान्यतः विवरण के माध्यम से किया जाता है जो निर्दिष्ट करता है कि तत्व क्या कर रहा है। मानकों के अनुरूप होने में विफलता एक वेबसाइट को अनुपयोगी या त्रुटि-प्रवण नहीं बना सकती है, लेकिन मानक पठनीयता के लिए पृष्ठों के सही लेआउट से संबंधित हो सकते हैं और साथ ही यह सुनिश्चित कर सकते हैं कि कोडित तत्व उचित रूप से बंद हैं। इसमें कोड में त्रुटियां, कोड के लिए एक अधिक संगठित लेआउट, और यह सुनिश्चित करना सम्मिलित है कि आईडी और कक्षाएं ठीक से पहचानी गई हैं। खराब कोडित पृष्ठों को कभी-कभी बोलचाल की भाषा में[[ टैग सूप | टैग सूप]] कहा जाता है।[[ W3C मार्कअप सत्यापन सेवा | डब्ल्यू 3 सी मार्कअप सत्यापन सेवा]] <ref name="W3C_validator" />केवल तभी किया जा सकता है जब एक सही डॉक्टयपे घोषणा की जाती है, जिसका उपयोग कोड में त्रुटियों को उजागर करने के लिए किया जाता है। सिस्टम उन त्रुटियों और क्षेत्रों की पहचान करता है जो वेब डिज़ाइन मानकों के अनुरूप नहीं हैं। इस जानकारी को तब उपयोगकर्ता द्वारा ठीक किया जा सकता है।<ref>{{cite web|last=W3C QA|title=मेरी वेब साइट मानक है! और तुम्हारा?| url=http://www.w3.org/QA/2002/04/Web-Quality|access-date=2012-03-21}}</ref> | ||
=== उत्पन्न सामग्री === | === उत्पन्न सामग्री === | ||
वेबसाइटें दो तरह से उत्पन्न होती हैं: स्थिर या गतिशील। | वेबसाइटें दो तरह से उत्पन्न होती हैं: स्थिर या गतिशील। | ||
==== स्थिर वेबसाइटें ==== | ==== स्थिर वेबसाइटें ==== | ||
{{Main| | {{Main|स्टेटिक वेब पेज}} | ||
एक स्थिर वेबसाइट एक स्थिर वेबसाइट के प्रत्येक पृष्ठ के लिए एक अद्वितीय फ़ाइल संग्रहीत करती है। हर बार जब उस पृष्ठ का अनुरोध किया जाता है, वही सामग्री लौटा दी जाती है। यह सामग्री वेबसाइट के डिजाइन के दौरान एक बार बनाई गई है। यह | एक स्थिर वेबसाइट एक स्थिर वेबसाइट के प्रत्येक पृष्ठ के लिए एक अद्वितीय फ़ाइल संग्रहीत करती है। हर बार जब उस पृष्ठ का अनुरोध किया जाता है, वही सामग्री लौटा दी जाती है। यह सामग्री वेबसाइट के डिजाइन के दौरान एक बार बनाई गई है। यह सामान्यतः मैन्युअल रूप से लिखा जाता है, यदपि कुछ साइटें एक गतिशील वेबसाइट के समान एक स्वचालित निर्माण प्रक्रिया का उपयोग करती हैं, जिसके परिणाम लंबे समय तक पूर्ण पृष्ठों के रूप में संग्रहीत किए जाते हैं। ये स्वचालित रूप से बनाई गई स्थैतिक साइटें 2015 के आसपास [[ जेकिल (सॉफ्टवेयर) |जेकिल (सॉफ्टवेयर)]] और[[ एडोब सरस्वती | एडोब सरस्वती]] जैसे जनरेटर के साथ अधिक लोकप्रिय हो गईं थी।<ref>{{Cite web | ||
| last = Christensen| first = Mathias Biilmann | | last = Christensen| first = Mathias Biilmann | ||
| title = स्टेटिक वेबसाइट जेनरेटर की समीक्षा की गई: जेकेल, मिडिलमैन, रूट्स, ह्यूगो| website= Smashing Magazine| access-date = 2016-10-26| date = 2015-11-16 | | title = स्टेटिक वेबसाइट जेनरेटर की समीक्षा की गई: जेकेल, मिडिलमैन, रूट्स, ह्यूगो| website= Smashing Magazine| access-date = 2016-10-26| date = 2015-11-16 | ||
| url = https://www.smashingmagazine.com/2015/11/static-website-generators-jekyll-middleman-roots-hugo-review/ | | url = https://www.smashingmagazine.com/2015/11/static-website-generators-jekyll-middleman-roots-hugo-review/ | ||
}}</ref> | }}</ref>एक स्थिर वेबसाइट के लाभ यह हैं कि वे होस्ट करने के लिए सरल थे, क्योंकि उनके सर्वर को केवल स्थिर सामग्री परोसने की आवश्यकता थी, न कि सर्वर-साइड स्क्रिप्ट को निष्पादित करने की। इसके लिए कम सर्वर प्रशासन की आवश्यकता थी और सुरक्षा छेदों को उजागर करने की संभावना कम थी। वे कम लागत वाले सर्वर हार्डवेयर पर पेजों को अधिक तेजी से सर्व कर सकते हैं। यह लाभ कम महत्वपूर्ण हो गया क्योंकि सस्ती वेब होस्टिंग भी गतिशील सुविधाओं की पेशकश करने के लिए विस्तारित हुई, और[[ आभासी मशीन | आभासी मशीन]] ने कम लागत पर कम अंतराल के लिए उच्च प्रदर्शन की पेशकश की थी। | ||
एक स्थिर वेबसाइट के लाभ यह हैं कि वे होस्ट करने के लिए सरल थे, क्योंकि उनके सर्वर को केवल स्थिर सामग्री परोसने की आवश्यकता थी, न कि सर्वर-साइड स्क्रिप्ट को निष्पादित करने की। इसके लिए कम सर्वर प्रशासन की आवश्यकता थी और सुरक्षा छेदों को उजागर करने की संभावना कम थी। वे कम लागत वाले सर्वर हार्डवेयर पर पेजों को अधिक तेजी से सर्व कर सकते हैं। यह लाभ कम महत्वपूर्ण हो गया क्योंकि सस्ती वेब होस्टिंग भी गतिशील सुविधाओं की पेशकश करने के लिए विस्तारित हुई, और [[ आभासी मशीन ]] | |||
लगभग सभी वेबसाइटों में कुछ स्थिर सामग्री होती है, क्योंकि सहायक संपत्ति जैसे चित्र और स्टाइल शीट | लगभग सभी वेबसाइटों में कुछ स्थिर सामग्री होती है, क्योंकि सहायक संपत्ति जैसे चित्र और स्टाइल शीट सामान्यतः स्थिर होती हैं, यहां तक कि अत्यधिक गतिशील पृष्ठों वाली वेबसाइट पर भी होती हैं। | ||
==== डायनेमिक वेबसाइट्स ==== | ==== डायनेमिक वेबसाइट्स ==== | ||
{{Main| | {{Main|गतिशील वेब पेज | ||
डायनेमिक वेबसाइट्स फ्लाई पर उत्पन्न होती हैं और वेब पेज बनाने के लिए सर्वर-साइड तकनीक का उपयोग करती हैं। वे | }} | ||
डायनेमिक वेबसाइट्स फ्लाई पर उत्पन्न होती हैं और वेब पेज बनाने के लिए सर्वर-साइड तकनीक का उपयोग करती हैं। वे सामान्यतः एक या एक से अधिक बैक-एंड डेटाबेस से अपनी सामग्री निकालते हैं: कुछ एक कैटलॉग को क्वेरी करने या संख्यात्मक जानकारी को सारांशित करने के लिए रिलेशनल डेटाबेस में डेटाबेस क्वेरीज़ हैं, और अन्य सामग्री की बड़ी इकाइयों को स्टोर करने के लिए[[ MongoDB | मोंगोडीबी]] या [[ NoSQL |नोएसक्यूएल]] जैसे[[ दस्तावेज़ डेटाबेस ]]का उपयोग कर सकते हैं। जैसे [[ ब्लॉग |ब्लॉग]] पोस्ट या विकी लेख हैं। | |||
डिजाइन प्रक्रिया में, गतिशील पृष्ठों का | डिजाइन प्रक्रिया में, गतिशील पृष्ठों का प्रायः मजाक उड़ाया जाता है या स्थिर पृष्ठों का उपयोग करके वेबसाइट को वायरफ्रेम किया जाता है। डायनेमिक वेब पेजों को विकसित करने के लिए आवश्यक कौशल एक स्थिर पेज की तुलना में बहुत व्यापक है, जिसमें सर्वर-साइड और डेटाबेस कोडिंग के साथ-साथ क्लाइंट-साइड इंटरफ़ेस डिज़ाइन सम्मिलित है। यहां तक कि मध्यम आकार की गतिशील परियोजनाएं भी लगभग हमेशा एक टीम प्रयास होती हैं। | ||
जब डायनामिक वेब पेज पहले विकसित हुए, तो उन्हें | जब डायनामिक वेब पेज पहले विकसित हुए, तो उन्हें सामान्यतः सीधे[[ पर्ल | पर्ल]],[[ पीएचपी |पीएचपी]] या[[ सक्रिय सर्वर पेज | सक्रिय सर्वर पेज]] जैसी भाषाओं में कोडित किया गया था। इनमें से कुछ, विशेष रूप से पीएचपी और एएसपी, ने एक 'टेम्प्लेट' दृष्टिकोण का उपयोग किया जहां एक सर्वर-साइड पेज पूर्ण क्लाइंट-साइड पेज की संरचना जैसा दिखता था, और डेटा 'टैग' द्वारा परिभाषित स्थानों में डाला गया था। पर्ल जैसी विशुद्ध रूप से प्रक्रियात्मक कोडिंग भाषा में कोडिंग की तुलना में यह विकास का एक तेज साधन था। | ||
इन दोनों दृष्टिकोणों को अब कई वेबसाइटों के लिए सामग्री प्रबंधन प्रणालियों जैसे उच्च-स्तरीय एप्लिकेशन-केंद्रित टूल द्वारा दबा दिया गया है। ये सामान्य-उद्देश्य वाले कोडिंग प्लेटफॉर्म के शीर्ष पर बनते हैं और मानते हैं कि एक वेबसाइट कई अच्छी तरह से मान्यता प्राप्त मॉडलों में से एक के अनुसार सामग्री की पेशकश करने के लिए मौजूद है, जैसे समय-अनुक्रमित ब्लॉग, विषयगत पत्रिका या समाचार साइट, विकी, या उपयोगकर्ता मंच। ये उपकरण ऐसी साइट के कार्यान्वयन को बहुत आसान बनाते हैं, और बिना किसी कोडिंग की आवश्यकता के विशुद्ध रूप से संगठनात्मक और डिज़ाइन-आधारित कार्य करते हैं। | इन दोनों दृष्टिकोणों को अब कई वेबसाइटों के लिए सामग्री प्रबंधन प्रणालियों जैसे उच्च-स्तरीय एप्लिकेशन-केंद्रित टूल द्वारा दबा दिया गया है। ये सामान्य-उद्देश्य वाले कोडिंग प्लेटफॉर्म के शीर्ष पर बनते हैं और मानते हैं कि एक वेबसाइट कई अच्छी तरह से मान्यता प्राप्त मॉडलों में से एक के अनुसार सामग्री की पेशकश करने के लिए मौजूद है, जैसे समय-अनुक्रमित ब्लॉग, विषयगत पत्रिका या समाचार साइट, विकी, या उपयोगकर्ता मंच। ये उपकरण ऐसी साइट के कार्यान्वयन को बहुत आसान बनाते हैं, और बिना किसी कोडिंग की आवश्यकता के विशुद्ध रूप से संगठनात्मक और डिज़ाइन-आधारित कार्य करते हैं। | ||
स्वयं सामग्री का संपादन (साथ ही टेम्प्लेट पृष्ठ) साइट के माध्यम से और तृतीय-पक्ष सॉफ़्टवेयर के उपयोग से दोनों ही किया जा सकता है। सभी पृष्ठों को संपादित करने की क्षमता केवल विशिष्ट श्रेणी के उपयोगकर्ताओं (उदाहरण के लिए, व्यवस्थापक, या पंजीकृत उपयोगकर्ता) को प्रदान की जाती है। कुछ मामलों में, अनाम उपयोगकर्ताओं को कुछ वेब सामग्री को संपादित करने की अनुमति दी जाती है, जो कम बार होती है (उदाहरण के लिए, मंचों पर - संदेश जोड़ना)। गुमनाम परिवर्तन वाली साइट का एक उदाहरण [[ विकिपीडिया ]] है। | स्वयं सामग्री का संपादन (साथ ही टेम्प्लेट पृष्ठ) साइट के माध्यम से और तृतीय-पक्ष सॉफ़्टवेयर के उपयोग से दोनों ही किया जा सकता है। सभी पृष्ठों को संपादित करने की क्षमता केवल विशिष्ट श्रेणी के उपयोगकर्ताओं (उदाहरण के लिए, व्यवस्थापक, या पंजीकृत उपयोगकर्ता) को प्रदान की जाती है। कुछ मामलों में, अनाम उपयोगकर्ताओं को कुछ वेब सामग्री को संपादित करने की अनुमति दी जाती है, जो कम बार होती है (उदाहरण के लिए, मंचों पर - संदेश जोड़ना)। गुमनाम परिवर्तन वाली साइट का एक उदाहरण[[ विकिपीडिया | विकिपीडिया]] है। | ||
== होमपेज डिजाइन == | == होमपेज डिजाइन == | ||
[[ जैकब नीलसन (उपयोगिता सलाहकार) ]] और काइल सौसी सहित उपयोगिता विशेषज्ञों ने | [[ जैकब नीलसन (उपयोगिता सलाहकार) ]] और काइल सौसी सहित उपयोगिता विशेषज्ञों ने प्रायः वेबसाइट की सफलता के लिए होमपेज डिजाइन पर जोर दिया है और दावा किया है कि वेबसाइट पर होमपेज सबसे महत्वपूर्ण पेज है।<ref>{{citation|url=http://www.usableinterface.com/articles/homepage.php|first=Kyle|last=Soucy|archive-date=8 June 2012|archive-url=https://web.archive.org/web/20120608071219/http://www.usableinterface.com/articles/homepage.php |title=Is Your Homepage Doing What It Should?|publisher=Usable Interface}}</ref>{{citation|first1=जेकब|last1=नीलसन|first2=मैरी|last2=ताहिर|title=मुखपृष्ठ की उपयोगिता: 50 वेबसाइटें विखंडित|date=October 2001|isbn=978-0735711020|publisher=न्यू राइडर्स पब्लिशिंग|url=https://archive.org/details/homepageusabilit00jako_0}}<ref>{{citation|url=http://www.nngroup.com/articles/most-violated-homepage-guidelines/|title=The Ten Most Violated Homepage Design Guidelines|date=10 November 2003|first=Jakob|last=Nielsen|archive-url=https://web.archive.org/web/20131005150112/http://www.nngroup.com/articles/most-violated-homepage-guidelines/ |archive-date=5 October 2013|publisher=Nielsen Norman Group}}</ref><ref>{{citation|url=http://sixrevisions.com/web_design/essential-tips-for-designing-an-effective-homepage/|archive-url=https://web.archive.org/web/20130821151637/http://sixrevisions.com/web_design/essential-tips-for-designing-an-effective-homepage/ |archive-date=21 August 2013|date=20 August 2009|first=Kayla|last=Knight|publisher=Six Revisions|title=Essential Tips for Designing an Effective Homepage}}</ref> हालाँकि, 2000 के दशक में चिकित्सकों ने यह देखना प्रांरम्भ कर दिया था कि वेबसाइट ट्रैफ़िक की बढ़ती संख्या मुखपृष्ठ को बायपास कर रही थी, सीधे खोज इंजन, ई-न्यूज़लेटर्स और RSS फ़ीड्स के माध्यम से आंतरिक सामग्री पृष्ठों पर जा रही थी।<ref>{{citation|url=http://www.uie.com/brainsparks/2005/09/29/is-home-page-design-relevant-anymore/|publisher=User Interface Engineering|first=Jared|last=Spool|date=29 September 2005|archive-date=16 September 2013|archive-url=https://web.archive.org/web/20130916092857/http://www.uie.com/brainsparks/2005/09/29/is-home-page-design-relevant-anymore/ |title=Is Home Page Design Relevant Anymore?}}</ref> कई चिकित्सकों को यह तर्क देने के लिए प्रेरित करते हुए कि अधिकांश लोगों की सोच से होमपेज़ कम महत्वपूर्ण हैं।<ref>{{citation|title=10 Usability Tips Based on Research Studies|url=http://sixrevisions.com/usabilityaccessibility/10-usability-tips-based-on-research-studies/|first=Cameron|last=Chapman|date=15 September 2010|archive-url=https://web.archive.org/web/20130902031226/http://sixrevisions.com/usabilityaccessibility/10-usability-tips-based-on-research-studies/ |archive-date=2 September 2013|publisher=Six Revisions}}</ref><ref>{{citation|url=http://uxmyths.com/post/717779908/myth-the-homepage-is-your-most-important-page|title=Myth #17: The homepage is your most important page|first=Zoltán|last=Gócza|archive-url=https://web.archive.org/web/20130602172028/http://uxmyths.com/post/717779908/myth-the-homepage-is-your-most-important-page |archive-date=2 June 2013}}</ref><ref>{{citation|url=http://giraffeforum.com/wordpress/2010/04/18/the-decline-of-the-homepage/|archive-url=https://web.archive.org/web/20130524221238/http://giraffeforum.com/wordpress/2010/04/18/the-decline-of-the-homepage/ |archive-date=24 May 2013|title=The decline of the homepage|first=Gerry|last=McGovern|date=18 April 2010}}</ref><ref>{{citation|title=Prioritizing Design Time: A Long Tail Approach|first=Joshua|last=Porter|date=24 April 2006|publisher=User Interface Engineering|archive-url=https://web.archive.org/web/20130514075119/http://www.uie.com/articles/prioritizing_design_time/ |archive-date=14 May 2013|url=http://www.uie.com/articles/prioritizing_design_time/}}</ref> जेरेड स्पूल ने 2007 में तर्क दिया कि किसी साइट का होमपेज वास्तव में किसी वेबसाइट का सबसे कम महत्वपूर्ण पेज होता है।<ref>{{citation|url=http://www.uie.com/brainsparks/2007/08/06/usability-tools-podcast-home-page-design/|archive-url=https://web.archive.org/web/20130429113949/http://www.uie.com/brainsparks/2007/08/06/usability-tools-podcast-home-page-design/ |archive-date=29 April 2013|first=Jared|last=Spool|date=6 August 2007|title=Usability Tools Podcast: Home Page Design}}</ref> | ||
2012 और 2013 में, हिंडोला (जिसे 'स्लाइडर्स' और 'रोटेटिंग बैनर' भी कहा जाता है) मुखपृष्ठों पर एक अत्यंत लोकप्रिय डिज़ाइन तत्व बन गया है, जिसका उपयोग | 2012 और 2013 में, हिंडोला (जिसे 'स्लाइडर्स' और 'रोटेटिंग बैनर' भी कहा जाता है) मुखपृष्ठों पर एक अत्यंत लोकप्रिय डिज़ाइन तत्व बन गया है, जिसका उपयोग प्रायः एक सीमित स्थान में विशेष रुप से प्रदर्शित या हाल की सामग्री को प्रदर्शित करने के लिए किया जाता है।<ref>{{citation|title=Best practices in carousel design for effective web marketing|first=Chris|last=Bates|date=9 October 2012|publisher=Smart Insights|url=http://www.smartinsights.com/conversion-optimisation/home-page-optimisation/carousels-design-best-practice/|archive-url=https://web.archive.org/web/20130403013507/http://www.smartinsights.com/conversion-optimisation/home-page-optimisation/carousels-design-best-practice/ |archive-date=3 April 2013}}</ref><ref name=Messner2013>{{citation|url=http://www.usability.gov/get-involved/blog/2013/04/image-carousels.html |title=Image Carousels: Getting Control of the Merry-Go-Round|first=Katie|last=Messner|publisher=Usability.gov|date=22 April 2013|archive-url=https://web.archive.org/web/20131010094459/http://www.usability.gov/get-involved/blog/2013/04/image-carousels.html |archive-date=10 October 2013}}</ref> कई चिकित्सकों का तर्क है कि हिंडोला एक अप्रभावी डिजाइन तत्व है और एक वेबसाइट के खोज इंजन अनुकूलन और उपयोगिता को नुकसान पहुंचाता है।<ref name=Messner2013/><ref>{{citation|url=http://searchengineland.com/homepage-sliders-are-bad-for-seo-usability-163496|archive-date=22 November 2013|archive-url=https://web.archive.org/web/20131122031942/http://searchengineland.com/homepage-sliders-are-bad-for-seo-usability-163496 |title=Homepage Sliders: Bad For SEO, Bad For Usability|first=Harrison|last=Jones|date=19 June 2013}}</ref><ref>{{citation|url=https://cxl.com/blog/dont-use-automatic-image-sliders-or-carousels/|title=Image Carousels and Sliders? Don't Use Them. (Here's why.)|archive-url=https://web.archive.org/web/20191210184941/https://cxl.com/blog/dont-use-automatic-image-sliders-or-carousels/ |archive-date=10 December 2019|first=Peep|last=Laja|date=8 June 2019|publisher=CXL}}</ref> | ||
== व्यवसाय == | == व्यवसाय == | ||
वेबसाइट बनाने में दो प्राथमिक कार्य | वेबसाइट बनाने में दो प्राथमिक कार्य सम्मिलित होते हैं: वेब डिज़ाइनर और[[ वेब डेवलपर | वेब डेवलपर]], जो प्रायः एक वेबसाइट पर एक साथ मिलकर काम करते हैं।<ref name ="careersinwebdesign">{{cite book|last=Oleksy|first=Walter|title=वेब डिजाइन में करियर| year=2001|publisher=The Rosen Publishing Group, Inc.|location=New York|isbn=9780823931910 |pages=[https://archive.org/details/careersinwebdesi0000olek/page/9 9]–11|url=https://archive.org/details/careersinwebdesi0000olek|url-access=registration}}</ref> वेब डिज़ाइनर विज़ुअल पहलू के लिए ज़िम्मेदार होते हैं, जिसमें वेब पेज का लेआउट, रंग और टाइपोग्राफी सम्मिलित है। वेब डिज़ाइनरों को एचटीएमएल और सीएसएस जैसी भाषा की वृद्धि ओं का कार्यसाधक ज्ञान भी होगा, हालाँकि उनके ज्ञान की सीमा एक वेब डिज़ाइनर से दूसरे में भिन्न होगी। विशेष रूप से छोटे संगठनों में, एक व्यक्ति को पूरे वेब पेज को डिजाइन और प्रोग्रामिंग करने के लिए आवश्यक कौशल की आवश्यकता होगी, जबकि बड़े संगठनों के पास केवल दृश्य पहलू के लिए जिम्मेदार वेब डिजाइनर हो सकता है। | ||
आगे की नौकरियां जो एक वेबसाइट के निर्माण में | आगे की नौकरियां जो एक वेबसाइट के निर्माण में सम्मिलित हो सकती हैं उनमें सम्मिलित हैं: | ||
*[[ ग्राफिक डिजाइनर ]] साइट के लिए लोगो, लेआउट और बटन जैसे दृश्य बनाने के लिए | *[[ ग्राफिक डिजाइनर ]] साइट के लिए लोगो, लेआउट और बटन जैसे दृश्य बनाने के लिए | ||
* इंटरनेट पर विपणन और प्रचार तकनीकों का उपयोग करके, साइट पर दर्शकों को लक्षित करने पर रणनीतिक समाधानों के माध्यम से वेब उपस्थिति बनाए रखने में मदद करने के लिए इंटरनेट मार्केटिंग विशेषज्ञ | * इंटरनेट पर विपणन और प्रचार तकनीकों का उपयोग करके, साइट पर दर्शकों को लक्षित करने पर रणनीतिक समाधानों के माध्यम से वेब उपस्थिति बनाए रखने में मदद करने के लिए इंटरनेट मार्केटिंग विशेषज्ञ | ||
*एसईओ लेखकों को शोध करने और किसी विशेष वेबसाइट में | *एसईओ लेखकों को शोध करने और किसी विशेष वेबसाइट में सम्मिलित करने के लिए सही शब्दों की सिफारिश करने और वेबसाइट को अधिक सुलभ बनाने और कई खोज इंजनों पर पाए जाने की सिफारिश करने के लिए | ||
* साइट के लक्षित दर्शकों से अपील करने के लिए पृष्ठ की लिखित सामग्री बनाने के लिए इंटरनेट कॉपीराइटर<ref name="different jobs" /> | * साइट के लक्षित दर्शकों से अपील करने के लिए पृष्ठ की लिखित सामग्री बनाने के लिए इंटरनेट कॉपीराइटर<ref name="different jobs" /> उपयोगकर्ता अनुभव उपयोगकर्ता अनुभव डिज़ाइन (यूएक्स) डिज़ाइनर उपयोगकर्ता-केंद्रित डिज़ाइन विचारों के पहलुओं को सम्मिलित करता है जिसमें सूचना वास्तुकला, उपयोगकर्ता-केंद्रित डिज़ाइन, उपयोगकर्ता परीक्षण, इंटरैक्शन डिज़ाइन और कभी-कभी दृश्य डिज़ाइन सम्मिलित होते हैं। | ||
== यह भी देखें == | == यह भी देखें == | ||
{| style="width:100%;" | {| style="width:100%;" | ||
|- valign=top | |- valign=top | ||
| style="width:33%;"| | | style="width:33%;"| | ||
*[[Aesthetics]] | *[[Aesthetics|एस्थेटिक्स]] | ||
*[[Color theory]] | *[[Color theory|रंग का सिद्धांत]] | ||
*[[Composition (visual arts)]] | *[[Composition (visual arts)|कम्पोजीशन (विसुआल आर्ट्स)]] | ||
*[[Cross-browser]] | *[[Cross-browser|क्रॉस ब्राउज़र]] | ||
*[[Design education]] | *[[Design education|डिजाइन की शिक्षा]] | ||
*[[Design principles and elements]] | *[[Design principles and elements|डिजाइन के सिद्धांत और तत्व]] | ||
*[[Drawing]] | *[[Drawing|ड्रॉइंग]] | ||
*[[Dark pattern]] | *[[Dark pattern|डार्क पैटर्न]] | ||
*[[European Design Awards]] | *[[European Design Awards|यूरोपीय डिजाइन पुरस्कार]] | ||
*[[First Things First 2000 manifesto]] | *[[First Things First 2000 manifesto|फर्स्ट थिंग्स फर्स्ट 2000 मेनिफेस्टो]] | ||
| style="width:33%;"| | | style="width:33%;"| | ||
*[[Graphic art software]] | *[[Graphic art software|ग्राफिक आर्ट सॉफ्टवेयर]] | ||
*[[Graphic design occupations]] | *[[Graphic design occupations|ग्राफ़िक डिज़ाइन ओक्कुपेशंस]] | ||
*[[Graphics]] | * [[Graphics|ग्राफ़िक्स]] | ||
*[[Information graphics]] | *[[Information graphics|इनफार्मेशन ग्राफ़िक]] | ||
*[[:Category:Graphic design schools| | *[[:Category:Graphic design schools|ग्राफिक डिजाइन संस्थानों की सूची]] | ||
*[[List of graphic designers| | *[[List of graphic designers|उल्लेखनीय ग्राफिक डिजाइनरों की सूची]] | ||
*[[Logotype]] | *[[Logotype|लोगोटाइप]] | ||
*[[Outline of web design and web development]] | *[[Outline of web design and web development|वेब डिजाइन और वेब विकास की रूपरेखा]] | ||
*[[Progressive Enhancement]] | *[[Progressive Enhancement|प्रगतिशील वृद्धि]] | ||
| style="width:33%;"| | | style="width:33%;"| | ||
* [[Style guide]] | * [[Style guide|स्टाइल गाइड]] | ||
* [[Web 2.0]] | * [[Web 2.0|वेब 2.0]] | ||
* [[Web colors]] | * [[Web colors|वेब कलर्स]] | ||
* [[Web safe fonts]] | * [[Web safe fonts|वेब सुरक्षित फोंट]] | ||
* [[Web usability]] | * [[Web usability|वेब युसबिलिटी]] | ||
* [[Web application framework]] | * [[Web application framework|वेब एप्लीकेशन फ्रेमवर्क]] | ||
* [[Website builder]] | * [[Website builder|वेबसाइट बिल्डर]] | ||
* [[Website wireframe]] | * [[Website wireframe|वेबसाइट]] [[Website wireframe|वायरफ्रेम]] | ||
|} | |} | ||
=== संबंधित अनुशासन === | === संबंधित अनुशासन === | ||
{| style="width:100%;" | {| style="width:100%;" | ||
|- valign=top | |- valign=top | ||
| style="width:33%;"| | | style="width:33%;"| | ||
*[[Communication design]] | *[[Communication design|संचार डिजाइन]] | ||
*[[Copywriting]] | *[[Copywriting|कॉपीराइटिंग]] | ||
*[[Desktop publishing]] | *[[Desktop publishing|डेस्कटॉप प्रकाशन]] | ||
*[[Digital illustration]] | * [[Digital illustration|डिजिटल इलस्ट्रेशन]] | ||
*[[Graphic design]] | *[[Graphic design|ग्राफिक डिजाइन]] | ||
*[[Interaction design]] | *[[Interaction design|इंटरेक्शन डिजाइन]] | ||
| style="width:33%;"| | | style="width:33%;"| | ||
*[[Information design]] | *[[Information design|सूचना डिजाइन]] | ||
* [[Light-on-dark color scheme]] | * [[Light-on-dark color scheme|लाइट-ऑन-डार्क कलर स्कीम]] | ||
*[[Marketing communications]] | *[[Marketing communications|मार्केटिंग संचार]] | ||
*[[Motion graphic design]] | *[[Motion graphic design|मोशन ग्राफिक डिजाइन]] | ||
*[[New media]] | *[[New media|नया मीडिया]] | ||
* | * सर्च इंजन अनुकूलन (एसईओ) | ||
| style="width:33%;"| | | style="width:33%;"| | ||
*[[Technical Writer]] | *[[Technical Writer|तकनीकी लेखक]] | ||
*[[Typography]] | *[[Typography|टाइपोग्राफी]] | ||
*[[User experience]] | *[[User experience|प्रयोगकर्ता का अनुभव]] | ||
*[[User interface design]] | *[[User interface design|यूजर इंटरफेस डिजाइन]] | ||
*[[Web development]] | *[[Web development|वेब विकास]] | ||
*[[Computer animation#Web animations| | *[[Computer animation#Web animations|वेब एनिमेशन]] | ||
|} | |} | ||
== टिप्पणियाँ == | == टिप्पणियाँ == | ||
{{Reflist|group=note|liststyle=lower-roman}} | {{Reflist|group=note|liststyle=lower-roman}} | ||
{{Reflist|30em}} | {{Reflist|30em}} | ||
== बाहरी कड़ियाँ == | == बाहरी कड़ियाँ == | ||
* [http://www.w3.org/standards/webdesign/ | * [http://www.w3.org/standards/webdesign/ डब्ल्यू 3 सी consortium for वेब standards] | ||
* {{curlie|Computers/Internet/Web_Design_and_Development|Web design and development}} | * {{curlie|Computers/Internet/Web_Design_and_Development|Web design and development}} | ||
[[Category: Machine Translated Page]] | [[Category:Articles with Curlie links]] | ||
[[Category: | [[Category:Articles with hatnote templates targeting a nonexistent page]] | ||
[[Category:CS1 English-language sources (en)]] | |||
[[Category:CS1 maint]] | |||
[[Category:Lua-based templates]] | |||
[[Category:Machine Translated Page]] | |||
[[Category:Pages with script errors]] | |||
[[Category:Short description with empty Wikidata description]] | |||
[[Category:Templates Vigyan Ready]] | |||
[[Category:Templates that add a tracking category]] | |||
[[Category:Templates that generate short descriptions]] | |||
[[Category:Templates using TemplateData]] | |||
Latest revision as of 13:11, 29 August 2023
वेब डिज़ाइन में वेवसाइटों के उत्पादन और रखरखाव में कई अलग-अलग कौशल और अनुशासन सम्मिलित हैं। वेब डिज़ाइन के विभिन्न क्षेत्रों में वेब ग्राफ़िक डिज़ाइन सम्मिलित है;यूजर इंटरफेस डिजाइन (यूआई डिजाइन); संलेखन, मानकीकृत कोड और मालिकाना सॉफ्टवेयर सहित; उपयोगकर्ता अनुभव डिजाइन (यूएक्स डिजाइन); और खोज इंजन अनुकूलन है। प्रायः कई लोग टीमों में डिजाइन प्रक्रिया के विभिन्न पहलुओं को कवर करते हुए काम करेंगे, यदपि कुछ डिजाइनर उन सभी को कवर करेंगे।[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] अधिकांश उपयोगकर्ता अनुभव डिज़ाइन और इंटरैक्टिव डिज़ाइन को यूज़र इंटरफ़ेस डिज़ाइन में माना जाता है।
उन्नत इंटरैक्टिव कार्यों के लिए प्लग-इन (कंप्यूटिंग) की आवश्यकता हो सकती है | प्लग-इन यदि उन्नत कोडिंग भाषा कौशल नहीं है। यह चुनना कि अन्तरक्रियाशीलता का उपयोग करना है या नहीं जिसके लिए प्लग-इन की आवश्यकता होती है, उपयोगकर्ता अनुभव डिज़ाइन में एक महत्वपूर्ण निर्णय है। यदि प्लग-इन अधिकांश ब्राउज़रों के साथ पहले से इंस्टॉल नहीं आता है, तो एक जोखिम है कि उपयोगकर्ता के पास सामग्री तक पहुँचने के लिए प्लग-इन स्थापित करने के बारे में न तो जानकारी होगी और न ही धैर्य होगा। यदि फ़ंक्शन को उन्नत कोडिंग भाषा कौशल की आवश्यकता होती है, तो फ़ंक्शन उपयोगकर्ता अनुभव में वृद्धि की मात्रा की तुलना में कोड के लिए समय या धन में बहुत महंगा हो सकता है। एक जोखिम यह भी है कि उन्नत अन्तरक्रियाशीलता पुराने ब्राउज़रों या हार्डवेयर कॉन्फ़िगरेशन के साथ असंगत हो सकती है। किसी ऐसे फ़ंक्शन को प्रकाशित करना जो मज़बूती से काम नहीं करता है, उपयोगकर्ता के अनुभव के लिए कोई प्रयास न करने की तुलना में संभावित रूप से खराब है। यह लक्षित दर्शकों पर निर्भर करता है कि क्या इसकी आवश्यकता होने या किसी जोखिम के लायक होने की संभावना है।
प्रगतिशील वृद्धि
प्रगतिशील वृद्धि वेब डिज़ाइन में एक रणनीति है जो पहले वेब सामग्री पर जोर देती है, जिससेयूनिवर्सल डिजाइन को वेब पेज की मूल सामग्री और कार्यक्षमता की अनुमति मिलती है, जबकिउपयोगकर्ता (कंप्यूटिंग) अतिरिक्त ब्राउज़र सुविधाओं या तेज़ इंटरनेट एक्सेस के साथ उन्नत संस्करण प्राप्त करते हैं।
व्यवहार में, इसका अर्थ है एचटीएमएल के माध्यम से सामग्री परोसना और सीएसएस के माध्यम से स्टाइलिंग और एनीमेशन को तकनीकी रूप से संभव सीमा तक लागू करना, फिर जावास्क्रिप्ट के माध्यम से और संवर्द्धन लागू करना। पृष्ठों के पाठ को तुरंत एचटीएमएल स्रोत कोड के माध्यम से लोड किया जाता है, इसके बजाय सामग्री को आरंभ करने और सामग्री को लोड करने के लिए जावास्क्रिप्ट की प्रतीक्षा करने के बजाय, जो सामग्री को न्यूनतम लोडिंग समय और बैंडविड्थ के साथ और पाठ-आधारित ब्राउज़र के माध्यम से पढ़ने योग्य होने की अनुमति देता है, और पश्चगामी संगतता को अधिकतम करता है।[14] एक उदाहरण के रूप में, विकिपीडिया सहित मीडियाविकि आधारित साइटें प्रगतिशील संवर्द्धन का उपयोग करती हैं, क्योंकि जावास्क्रिप्ट और यहां तक कि सीएसएस के निष्क्रिय होने पर भी वे प्रयोग करने योग्य रहते हैं, क्योंकि पृष्ठों की सामग्री पृष्ठ के एचटीएमएल स्रोत कोड में सम्मिलित होती है, जबकि प्रति-उदाहरण एवरपीडिया पृष्ठों को लोड करने के लिए जावास्क्रिप्ट पर निर्भर करता है। 'सामग्री बाद में; जावास्क्रिप्ट निष्क्रिय के साथ एक खाली पृष्ठ दिखाई देता है।
पृष्ठ अभिन्यास
उपयोगकर्ता इंटरफ़ेस डिज़ाइन का एक भाग पृष्ठ लेआउट की गुणवत्ता से प्रभावित होता है। उदाहरण के लिए, एक डिज़ाइनर इस बात पर विचार कर सकता है कि लेआउट डिज़ाइन करते समय साइट का पृष्ठ लेआउट विभिन्न पृष्ठों पर संगत रहना चाहिए या नहीं। लेआउट डिज़ाइन में ऑब्जेक्ट्स को संरेखित करने के लिए पृष्ठ पिक्सेल चौड़ाई को भी महत्वपूर्ण माना जा सकता है। सबसे लोकप्रिय निश्चित-चौड़ाई वाली वेबसाइटों में सामान्यतः वर्तमान सबसे लोकप्रिय मॉनिटर आकार पर, वर्तमान सबसे लोकप्रिय स्क्रीन रिज़ॉल्यूशन पर, वर्तमान सबसे लोकप्रिय ब्राउज़र विंडो से मिलान करने के लिए समान सेट चौड़ाई होती है। बड़ी स्क्रीन पर सौंदर्यशास्त्र की चिंताओं के लिए अधिकांश पृष्ठ केंद्र-संरेखित हैं।
पाठक की स्क्रीन (खिड़की का आकार, खिड़की के सापेक्ष फ़ॉन्ट आकार, आदि) के विवरण के आधार पर द्रव लेआउट के लिए ब्राउज़र को उपयोगकर्ता-विशिष्ट लेआउट समायोजन करने की अनुमति देने के लिए 2000 के आसपास द्रव लेआउट की लोकप्रियता में वृद्धि हुई थी वे एचटीएमएल-टेबल-आधारित लेआउट और ग्रिड (पृष्ठ अभिन्यास) के विकल्प के रूप में विकसित हुए। पृष्ठ अभिन्यास डिजाइन सिद्धांतों और कोडिंग तकनीक दोनों में ग्रिड-आधारित डिज़ाइन लेकिन अपनाने में बहुत धीमी थी।[note 1] यह स्क्रीन रीडर और अलग-अलग खिड़कियों के आकार के कारण था, जिस पर डिजाइनरों का कोई नियंत्रण नहीं है। तदनुसार, एक डिज़ाइन को इकाइयों (साइडबार, सामग्री ब्लॉक, वेब बैनर क्षेत्र, नेविगेशन क्षेत्र) में विभाजित किया जा सकता है जो कि ब्राउज़र को भेजे जाते हैं और जो ब्राउज़र द्वारा डिस्प्ले विंडो में फिट किया जाएगा, जितना अच्छा हो सकता है। यदपि इस तरह का प्रदर्शन प्रायः प्रमुख सामग्री इकाइयों की सापेक्ष स्थिति को बदल सकता है, साइडबार इसके किनारे की बजाय मुख्य भाग के नीचे विस्थापित हो सकते हैं। यह हार्ड-कोडेड ग्रिड-आधारित लेआउट की तुलना में अधिक लचीला प्रदर्शन है जो डिवाइस विंडो में फिट नहीं होता है। विशेष रूप से, ब्लॉक के भीतर सामग्री को अप्रभावित रखते हुए सामग्री ब्लॉक की सापेक्ष स्थिति बदल सकती है। यह पृष्ठ को क्षैतिज रूप से स्क्रॉल करने के लिए उपयोगकर्ता की आवश्यकता को भी कम करता है।
उत्तरदायी वेब डिज़ाइन सी एसएस3 पर आधारित एक नया दृष्टिकोण है, और सीएसएस के उन्नत उपयोग के माध्यम से पृष्ठ की स्टाइल शीट के भीतर प्रति-उपकरण विनिर्देश का एक गहरा स्तर है। @media नियम मार्च 2018 में गूगल ने घोषणा की कि वे मोबाइल-फर्स्ट इंडेक्सिंग प्रांरम्भ करेंगे।[15] उत्तरदायी डिज़ाइन का उपयोग करने वाली साइटें यह सुनिश्चित करने के लिए अच्छी स्थिति में हैं कि वे इस नए दृष्टिकोण को पूरा करती हैं।
टाइपोग्राफी
वेब डिज़ाइनर टाइपफ़ेस की एक विस्तृत श्रृंखला या टाइपफेस # टाइपफेस की शैली का उपयोग करने के बजाय वेबसाइट टाइपफेस की विविधता को केवल कुछ समान शैली तक सीमित करना चुन सकते हैं। अधिकांश ब्राउज़र एक विशिष्ट संख्या में सुरक्षित फोंट को पहचानते हैं, जो डिजाइनर मुख्य रूप से जटिलताओं से बचने के लिए उपयोग करते हैं।
फ़ॉन्ट डाउनलोडिंग को बाद में सी एसएस3 के फोंट मॉड्यूल में सम्मिलित किया गया था और तब से इसे सफारी 3.1, ओपेरा 10 और मोज़िला फ़ायरफ़ॉक्स 3.5 में लागू किया गया है। इसने बाद में वेब टाइपोग्राफी के साथ-साथ फ़ॉन्ट डाउनलोडिंग के उपयोग में रुचि बढ़ाई है।
अधिकांश साइट लेआउट पाठ को पैराग्राफ में विभाजित करने के लिए नकारात्मक स्थान सम्मिलित करते हैं और केंद्र-संरेखित पाठ से भी बचते हैं।[16]
मोशन ग्राफिक्स
मोशन ग्राफिक्स के उपयोग से पृष्ठ अभिन्यास और यूजर इंटरफेस भी प्रभावित हो सकते हैं। गति ग्राफिक्स का उपयोग करने या न करने का विकल्प वेबसाइट के लिए लक्षित बाजार पर निर्भर हो सकता हैl मोशन ग्राफिक्स की अपेक्षा की जा सकती है या कम से कम मनोरंजन-उन्मुख वेबसाइट के साथ बेहतर प्राप्त किया जा सकता है। यदपि , अधिक गंभीर या औपचारिक रुचि (जैसे व्यवसाय, समुदाय, या सरकार) के साथ दर्शकों को लक्षित करने वाली वेबसाइट को केवल मनोरंजन या सजावट के उद्देश्यों के लिए एनिमेशन अनावश्यक और विचलित करने वाला लग सकता है। इसका मतलब यह नहीं है कि अधिक गंभीर सामग्री को एनिमेटेड या वीडियो प्रस्तुतियों के साथ बढ़ाया नहीं जा सकता है जो सामग्री के लिए प्रासंगिक है। किसी भी मामले में, गति ग्राफिक डिजाइन अधिक प्रभावी दृश्यों या विचलित करने वाले दृश्यों के बीच अंतर कर सकता है।
मोशन ग्राफिक्स जो साइट विज़िटर द्वारा प्रांरम्भ नहीं किए गए हैं, वे एक्सेसिबिलिटी के मुद्दे पैदा कर सकते हैं। वर्ल्ड वाइड वेब कंसोर्टियम एक्सेसिबिलिटी मानकों के लिए आवश्यक है कि साइट विज़िटर एनिमेशन को अक्षम करने में सक्षम हों।[17]
कोड की गुणवत्ता
वेबसाइट डिजाइनर इसे मानकों के अनुरूप होना अच्छा अभ्यास मान सकते हैं। यह सामान्यतः विवरण के माध्यम से किया जाता है जो निर्दिष्ट करता है कि तत्व क्या कर रहा है। मानकों के अनुरूप होने में विफलता एक वेबसाइट को अनुपयोगी या त्रुटि-प्रवण नहीं बना सकती है, लेकिन मानक पठनीयता के लिए पृष्ठों के सही लेआउट से संबंधित हो सकते हैं और साथ ही यह सुनिश्चित कर सकते हैं कि कोडित तत्व उचित रूप से बंद हैं। इसमें कोड में त्रुटियां, कोड के लिए एक अधिक संगठित लेआउट, और यह सुनिश्चित करना सम्मिलित है कि आईडी और कक्षाएं ठीक से पहचानी गई हैं। खराब कोडित पृष्ठों को कभी-कभी बोलचाल की भाषा में टैग सूप कहा जाता है। डब्ल्यू 3 सी मार्कअप सत्यापन सेवा [9]केवल तभी किया जा सकता है जब एक सही डॉक्टयपे घोषणा की जाती है, जिसका उपयोग कोड में त्रुटियों को उजागर करने के लिए किया जाता है। सिस्टम उन त्रुटियों और क्षेत्रों की पहचान करता है जो वेब डिज़ाइन मानकों के अनुरूप नहीं हैं। इस जानकारी को तब उपयोगकर्ता द्वारा ठीक किया जा सकता है।[18]
उत्पन्न सामग्री
वेबसाइटें दो तरह से उत्पन्न होती हैं: स्थिर या गतिशील।
स्थिर वेबसाइटें
एक स्थिर वेबसाइट एक स्थिर वेबसाइट के प्रत्येक पृष्ठ के लिए एक अद्वितीय फ़ाइल संग्रहीत करती है। हर बार जब उस पृष्ठ का अनुरोध किया जाता है, वही सामग्री लौटा दी जाती है। यह सामग्री वेबसाइट के डिजाइन के दौरान एक बार बनाई गई है। यह सामान्यतः मैन्युअल रूप से लिखा जाता है, यदपि कुछ साइटें एक गतिशील वेबसाइट के समान एक स्वचालित निर्माण प्रक्रिया का उपयोग करती हैं, जिसके परिणाम लंबे समय तक पूर्ण पृष्ठों के रूप में संग्रहीत किए जाते हैं। ये स्वचालित रूप से बनाई गई स्थैतिक साइटें 2015 के आसपास जेकिल (सॉफ्टवेयर) और एडोब सरस्वती जैसे जनरेटर के साथ अधिक लोकप्रिय हो गईं थी।[19]एक स्थिर वेबसाइट के लाभ यह हैं कि वे होस्ट करने के लिए सरल थे, क्योंकि उनके सर्वर को केवल स्थिर सामग्री परोसने की आवश्यकता थी, न कि सर्वर-साइड स्क्रिप्ट को निष्पादित करने की। इसके लिए कम सर्वर प्रशासन की आवश्यकता थी और सुरक्षा छेदों को उजागर करने की संभावना कम थी। वे कम लागत वाले सर्वर हार्डवेयर पर पेजों को अधिक तेजी से सर्व कर सकते हैं। यह लाभ कम महत्वपूर्ण हो गया क्योंकि सस्ती वेब होस्टिंग भी गतिशील सुविधाओं की पेशकश करने के लिए विस्तारित हुई, और आभासी मशीन ने कम लागत पर कम अंतराल के लिए उच्च प्रदर्शन की पेशकश की थी।
लगभग सभी वेबसाइटों में कुछ स्थिर सामग्री होती है, क्योंकि सहायक संपत्ति जैसे चित्र और स्टाइल शीट सामान्यतः स्थिर होती हैं, यहां तक कि अत्यधिक गतिशील पृष्ठों वाली वेबसाइट पर भी होती हैं।
डायनेमिक वेबसाइट्स
डायनेमिक वेबसाइट्स फ्लाई पर उत्पन्न होती हैं और वेब पेज बनाने के लिए सर्वर-साइड तकनीक का उपयोग करती हैं। वे सामान्यतः एक या एक से अधिक बैक-एंड डेटाबेस से अपनी सामग्री निकालते हैं: कुछ एक कैटलॉग को क्वेरी करने या संख्यात्मक जानकारी को सारांशित करने के लिए रिलेशनल डेटाबेस में डेटाबेस क्वेरीज़ हैं, और अन्य सामग्री की बड़ी इकाइयों को स्टोर करने के लिए मोंगोडीबी या नोएसक्यूएल जैसेदस्तावेज़ डेटाबेस का उपयोग कर सकते हैं। जैसे ब्लॉग पोस्ट या विकी लेख हैं।
डिजाइन प्रक्रिया में, गतिशील पृष्ठों का प्रायः मजाक उड़ाया जाता है या स्थिर पृष्ठों का उपयोग करके वेबसाइट को वायरफ्रेम किया जाता है। डायनेमिक वेब पेजों को विकसित करने के लिए आवश्यक कौशल एक स्थिर पेज की तुलना में बहुत व्यापक है, जिसमें सर्वर-साइड और डेटाबेस कोडिंग के साथ-साथ क्लाइंट-साइड इंटरफ़ेस डिज़ाइन सम्मिलित है। यहां तक कि मध्यम आकार की गतिशील परियोजनाएं भी लगभग हमेशा एक टीम प्रयास होती हैं।
जब डायनामिक वेब पेज पहले विकसित हुए, तो उन्हें सामान्यतः सीधे पर्ल,पीएचपी या सक्रिय सर्वर पेज जैसी भाषाओं में कोडित किया गया था। इनमें से कुछ, विशेष रूप से पीएचपी और एएसपी, ने एक 'टेम्प्लेट' दृष्टिकोण का उपयोग किया जहां एक सर्वर-साइड पेज पूर्ण क्लाइंट-साइड पेज की संरचना जैसा दिखता था, और डेटा 'टैग' द्वारा परिभाषित स्थानों में डाला गया था। पर्ल जैसी विशुद्ध रूप से प्रक्रियात्मक कोडिंग भाषा में कोडिंग की तुलना में यह विकास का एक तेज साधन था।
इन दोनों दृष्टिकोणों को अब कई वेबसाइटों के लिए सामग्री प्रबंधन प्रणालियों जैसे उच्च-स्तरीय एप्लिकेशन-केंद्रित टूल द्वारा दबा दिया गया है। ये सामान्य-उद्देश्य वाले कोडिंग प्लेटफॉर्म के शीर्ष पर बनते हैं और मानते हैं कि एक वेबसाइट कई अच्छी तरह से मान्यता प्राप्त मॉडलों में से एक के अनुसार सामग्री की पेशकश करने के लिए मौजूद है, जैसे समय-अनुक्रमित ब्लॉग, विषयगत पत्रिका या समाचार साइट, विकी, या उपयोगकर्ता मंच। ये उपकरण ऐसी साइट के कार्यान्वयन को बहुत आसान बनाते हैं, और बिना किसी कोडिंग की आवश्यकता के विशुद्ध रूप से संगठनात्मक और डिज़ाइन-आधारित कार्य करते हैं।
स्वयं सामग्री का संपादन (साथ ही टेम्प्लेट पृष्ठ) साइट के माध्यम से और तृतीय-पक्ष सॉफ़्टवेयर के उपयोग से दोनों ही किया जा सकता है। सभी पृष्ठों को संपादित करने की क्षमता केवल विशिष्ट श्रेणी के उपयोगकर्ताओं (उदाहरण के लिए, व्यवस्थापक, या पंजीकृत उपयोगकर्ता) को प्रदान की जाती है। कुछ मामलों में, अनाम उपयोगकर्ताओं को कुछ वेब सामग्री को संपादित करने की अनुमति दी जाती है, जो कम बार होती है (उदाहरण के लिए, मंचों पर - संदेश जोड़ना)। गुमनाम परिवर्तन वाली साइट का एक उदाहरण विकिपीडिया है।
होमपेज डिजाइन
जैकब नीलसन (उपयोगिता सलाहकार) और काइल सौसी सहित उपयोगिता विशेषज्ञों ने प्रायः वेबसाइट की सफलता के लिए होमपेज डिजाइन पर जोर दिया है और दावा किया है कि वेबसाइट पर होमपेज सबसे महत्वपूर्ण पेज है।[20]नीलसन, जेकब; ताहिर, मैरी (October 2001), मुखपृष्ठ की उपयोगिता: 50 वेबसाइटें विखंडित, न्यू राइडर्स पब्लिशिंग, ISBN 978-0735711020[21][22] हालाँकि, 2000 के दशक में चिकित्सकों ने यह देखना प्रांरम्भ कर दिया था कि वेबसाइट ट्रैफ़िक की बढ़ती संख्या मुखपृष्ठ को बायपास कर रही थी, सीधे खोज इंजन, ई-न्यूज़लेटर्स और RSS फ़ीड्स के माध्यम से आंतरिक सामग्री पृष्ठों पर जा रही थी।[23] कई चिकित्सकों को यह तर्क देने के लिए प्रेरित करते हुए कि अधिकांश लोगों की सोच से होमपेज़ कम महत्वपूर्ण हैं।[24][25][26][27] जेरेड स्पूल ने 2007 में तर्क दिया कि किसी साइट का होमपेज वास्तव में किसी वेबसाइट का सबसे कम महत्वपूर्ण पेज होता है।[28] 2012 और 2013 में, हिंडोला (जिसे 'स्लाइडर्स' और 'रोटेटिंग बैनर' भी कहा जाता है) मुखपृष्ठों पर एक अत्यंत लोकप्रिय डिज़ाइन तत्व बन गया है, जिसका उपयोग प्रायः एक सीमित स्थान में विशेष रुप से प्रदर्शित या हाल की सामग्री को प्रदर्शित करने के लिए किया जाता है।[29][30] कई चिकित्सकों का तर्क है कि हिंडोला एक अप्रभावी डिजाइन तत्व है और एक वेबसाइट के खोज इंजन अनुकूलन और उपयोगिता को नुकसान पहुंचाता है।[30][31][32]
व्यवसाय
वेबसाइट बनाने में दो प्राथमिक कार्य सम्मिलित होते हैं: वेब डिज़ाइनर और वेब डेवलपर, जो प्रायः एक वेबसाइट पर एक साथ मिलकर काम करते हैं।[33] वेब डिज़ाइनर विज़ुअल पहलू के लिए ज़िम्मेदार होते हैं, जिसमें वेब पेज का लेआउट, रंग और टाइपोग्राफी सम्मिलित है। वेब डिज़ाइनरों को एचटीएमएल और सीएसएस जैसी भाषा की वृद्धि ओं का कार्यसाधक ज्ञान भी होगा, हालाँकि उनके ज्ञान की सीमा एक वेब डिज़ाइनर से दूसरे में भिन्न होगी। विशेष रूप से छोटे संगठनों में, एक व्यक्ति को पूरे वेब पेज को डिजाइन और प्रोग्रामिंग करने के लिए आवश्यक कौशल की आवश्यकता होगी, जबकि बड़े संगठनों के पास केवल दृश्य पहलू के लिए जिम्मेदार वेब डिजाइनर हो सकता है।
आगे की नौकरियां जो एक वेबसाइट के निर्माण में सम्मिलित हो सकती हैं उनमें सम्मिलित हैं:
- ग्राफिक डिजाइनर साइट के लिए लोगो, लेआउट और बटन जैसे दृश्य बनाने के लिए
- इंटरनेट पर विपणन और प्रचार तकनीकों का उपयोग करके, साइट पर दर्शकों को लक्षित करने पर रणनीतिक समाधानों के माध्यम से वेब उपस्थिति बनाए रखने में मदद करने के लिए इंटरनेट मार्केटिंग विशेषज्ञ
- एसईओ लेखकों को शोध करने और किसी विशेष वेबसाइट में सम्मिलित करने के लिए सही शब्दों की सिफारिश करने और वेबसाइट को अधिक सुलभ बनाने और कई खोज इंजनों पर पाए जाने की सिफारिश करने के लिए
- साइट के लक्षित दर्शकों से अपील करने के लिए पृष्ठ की लिखित सामग्री बनाने के लिए इंटरनेट कॉपीराइटर[1] उपयोगकर्ता अनुभव उपयोगकर्ता अनुभव डिज़ाइन (यूएक्स) डिज़ाइनर उपयोगकर्ता-केंद्रित डिज़ाइन विचारों के पहलुओं को सम्मिलित करता है जिसमें सूचना वास्तुकला, उपयोगकर्ता-केंद्रित डिज़ाइन, उपयोगकर्ता परीक्षण, इंटरैक्शन डिज़ाइन और कभी-कभी दृश्य डिज़ाइन सम्मिलित होते हैं।
यह भी देखें
संबंधित अनुशासन
|
टिप्पणियाँ
- ↑
<table>-based markup and spacer .GIF images
- ↑ 1.0 1.1 Lester, Georgina. "वेबसाइट बनाने में शामिल विभिन्न लोगों की विभिन्न नौकरियां और जिम्मेदारियां". Arts Wales UK. Retrieved 2012-03-17.
- ↑ CPBI, Ryan Shelley. "वेबसाइट डिज़ाइन का इतिहास: वेब के निर्माण के 30 साल [2022 अपडेट]". www.smamarketing.net (in English). Retrieved 2022-10-12.
- ↑ "लंबी जीवनी". Retrieved 2012-03-16.
- ↑ "मोज़ेक ब्राउज़र" (PDF). Archived from the original (PDF) on 2013-09-02. Retrieved 2012-03-16.
- ↑ Zwicky, E.D, Cooper, S and Chapman, D.B. (2000). इंटरनेट फ़ायरवॉल का निर्माण. United States: O’Reily & Associates. p. 804. ISBN 1-56592-871-7.
{{cite book}}: CS1 maint: uses authors parameter (link) - ↑ 6.0 6.1 6.2 6.3 Niederst, Jennifer (2006). वेब डिजाइन संक्षेप में. United States of America: O'Reilly Media. pp. 12–14. ISBN 0-596-00987-9.
- ↑ 7.0 7.1 Chapman, Cameron, The Evolution of Web Design, Six Revisions, archived from the original on 30 October 2013
- ↑ "AMO.NET अमेरिका का मल्टीमीडिया ऑनलाइन (इंटरनेट एक्सप्लोरर 6 पूर्वावलोकन)". amo.net. Retrieved 2020-05-27.
- ↑ 9.0 9.1 "W3C मार्कअप सत्यापन सेवा".
- ↑ "वेब डिज़ाइन क्या है?". The Interaction Design Foundation (in English). Retrieved 2022-10-12.
- ↑ THORLACIUS, LISBETH (2007). "वेब डिजाइन में सौंदर्यशास्त्र की भूमिका". Nordicom Review. 28 (28): 63–76. doi:10.1515/nor-2017-0201. S2CID 146649056.
- ↑ "वेब डिज़ाइनर क्या है? (2022 गाइड)". BrainStation® (in English). Retrieved 2022-10-28.
- ↑ Castañeda, J.A Francisco; Muñoz-Leiva, Teodoro Luque (2007). "वेब स्वीकृति मॉडल (डब्ल्यूएएम): उपयोगकर्ता अनुभव के मॉडरेटिंग प्रभाव". Information & Management. 44 (4): 384–396. doi:10.1016/j.im.2007.02.003.
- ↑ "प्रगतिशील संवर्द्धन का उपयोग करके एक लचीला दृश्यपटल का निर्माण". GOV.UK (in English). Retrieved 27 October 2021.
- ↑ "मोबाइल-फर्स्ट इंडेक्सिंग को रोल आउट किया जा रहा है". Official Google Webmaster Central Blog (in English). Retrieved 2018-06-09.
- ↑ Stone, John (2009-11-16). "प्रभावी वेब टाइपोग्राफी के 20 क्या करें और क्या न करें". Retrieved 2012-03-19.
- ↑ World Wide Web Consortium: Understanding Web Content Accessibility Guidelines 2.2.2: Pause, Stop, Hide
- ↑ W3C QA. "मेरी वेब साइट मानक है! और तुम्हारा?". Retrieved 2012-03-21.
- ↑ Christensen, Mathias Biilmann (2015-11-16). "स्टेटिक वेबसाइट जेनरेटर की समीक्षा की गई: जेकेल, मिडिलमैन, रूट्स, ह्यूगो". Smashing Magazine. Retrieved 2016-10-26.
- ↑ Soucy, Kyle, Is Your Homepage Doing What It Should?, Usable Interface, archived from the original on 8 June 2012
- ↑ Nielsen, Jakob (10 November 2003), The Ten Most Violated Homepage Design Guidelines, Nielsen Norman Group, archived from the original on 5 October 2013
- ↑ Knight, Kayla (20 August 2009), Essential Tips for Designing an Effective Homepage, Six Revisions, archived from the original on 21 August 2013
- ↑ Spool, Jared (29 September 2005), Is Home Page Design Relevant Anymore?, User Interface Engineering, archived from the original on 16 September 2013
- ↑ Chapman, Cameron (15 September 2010), 10 Usability Tips Based on Research Studies, Six Revisions, archived from the original on 2 September 2013
- ↑ Gócza, Zoltán, Myth #17: The homepage is your most important page, archived from the original on 2 June 2013
- ↑ McGovern, Gerry (18 April 2010), The decline of the homepage, archived from the original on 24 May 2013
- ↑ Porter, Joshua (24 April 2006), Prioritizing Design Time: A Long Tail Approach, User Interface Engineering, archived from the original on 14 May 2013
- ↑ Spool, Jared (6 August 2007), Usability Tools Podcast: Home Page Design, archived from the original on 29 April 2013
- ↑ Bates, Chris (9 October 2012), Best practices in carousel design for effective web marketing, Smart Insights, archived from the original on 3 April 2013
- ↑ 30.0 30.1 Messner, Katie (22 April 2013), Image Carousels: Getting Control of the Merry-Go-Round, Usability.gov, archived from the original on 10 October 2013
- ↑ Jones, Harrison (19 June 2013), Homepage Sliders: Bad For SEO, Bad For Usability, archived from the original on 22 November 2013
- ↑ Laja, Peep (8 June 2019), Image Carousels and Sliders? Don't Use Them. (Here's why.), CXL, archived from the original on 10 December 2019
- ↑ Oleksy, Walter (2001). वेब डिजाइन में करियर. New York: The Rosen Publishing Group, Inc. pp. 9–11. ISBN 9780823931910.