मल्टी-डिवाइस वेब डिज़ाइन पर दो अलग-अलग दृष्टिकोणों की तुलना करना
उत्तरदायी और अनुकूली वेब डिज़ाइन बहु-डिवाइस अनुकूल वेबसाइट बनाने के लिए दोनों विधियां हैं जो विभिन्न प्रकार के स्क्रीन आकारों पर अच्छी तरह से काम करती हैं। जबकि उत्तरदायी वेब डिज़ाइन की सिफारिश Google द्वारा की जाती है और यह दो दृष्टिकोणों की अधिक लोकप्रिय है, मल्टी-डिवाइस वेब डिज़ाइन के लिए इन दोनों विधियों में उनकी ताकत और उनकी कमजोरियां हैं।
चलिए उत्तरदायी और अनुकूली वेब डिज़ाइन के बीच मतभेदों पर नज़र डालें, विशेष रूप से इन महत्वपूर्ण क्षेत्रों पर ध्यान केंद्रित करते हुए:
- विकास की आसानी
- डिजाइन पर आपके पास नियंत्रण का स्तर है
- डिवाइस / स्क्रीन समर्थन की रोटी
- भविष्य के अनुकूल समाधान कैसे है
- कुल मिलाकर डाउनलोड गति और साइट प्रदर्शन
कुछ परिभाषाएं
उत्तरदायी और अनुकूली वेब डिज़ाइन की हमारी साइड-बाय-साइड तुलना में आने से पहले, इन दो दृष्टिकोणों की उच्च-स्तरीय परिभाषा को देखने के लिए एक पल लें।
उत्तरदायी वेबसाइटों में एक तरल लेआउट होता है जो स्क्रीन आकार के उपयोग के बावजूद बदलता है और अनुकूलित करता है। यदि ब्राउज़र का आकार बदलता है तो मीडिया प्रश्न उत्तरदायी साइटों को "फ्लाई पर" बदलने की अनुमति देते हैं।
अनुकूली डिज़ाइन प्री-निर्धारित ब्रेकपॉइंट्स के आधार पर निश्चित आकार का उपयोग करता है ताकि पृष्ठ के पहले लोड होने पर पता लगाए गए स्क्रीन आकार के लिए सबसे उपयुक्त लेआउट संस्करण प्रदान किया जा सके।
उन व्यापक परिभाषाओं के साथ, चलो फोकस के हमारे प्रमुख क्षेत्रों में आते हैं।
विकास की आसानी
उत्तरदायी और अनुकूली वेब डिज़ाइन के बीच सबसे महत्वपूर्ण अंतर इस तरह से है कि इन समाधानों को वेबसाइट पर लागू किया जाता है। चूंकि उत्तरदायी डिजाइन पूरी तरह से तरल लेआउट बनाता है, यह उन परियोजनाओं पर सबसे अच्छा उपयोग किया जाता है जहां आप जमीन से साइट को फिर से डिजाइन कर रहे हैं। उत्तरदायी बनने के लिए किसी मौजूदा वेबसाइट के कोड को फिर से निकालने का प्रयास करना अक्सर एक परेशान संबंध होता है क्योंकि आपके पास उस स्तर का नियंत्रण नहीं होता है जो आपके पास होता है यदि आप उस कोड को स्क्रैच से विकसित कर रहे थे और उस प्रक्रिया के शुरुआती चरणों के लिए उत्तरदायी डिज़ाइन को ध्यान में रखते थे । इसका अर्थ यह है कि जब आप किसी साइट को उत्तरदायी होने के लिए पुन: स्थापित करते हैं, तो आपको उस मौजूदा कोडबेस के भीतर रहने के लिए समझौता करने के लिए मजबूर होना पड़ता है।
यदि आप मौजूदा फिक्स्ड-चौड़ाई वाली वेबसाइट के साथ काम कर रहे हैं, तो अनुकूली दृष्टिकोण का मतलब है कि आप उस आकार को छोड़ सकते हैं जिसे साइट को बरकरार रखने के लिए डिज़ाइन किया गया था और आवश्यकतानुसार अतिरिक्त अनुकूली ब्रेकपॉइंट्स को जोड़ना है। कुछ मामलों में, यदि कोई प्रोजेक्ट का बजट छोटा होता है, और यदि यह केवल थोड़ी सी मात्रा में विकास कार्य को समायोजित करेगा, तो आप छोटी स्क्रीन / मोबाइल-केंद्रित आकारों के लिए केवल नए अनुकूली ब्रेकपॉइंट जोड़ना चुन सकते हैं। इसका मतलब यह है कि आप सभी स्क्रीनों को एक ही लेआउट का उपयोग करने की अनुमति देंगे - शायद एक 960 ब्रेकपॉइंट संस्करण जो कि मूल रूप से उस साइट के लिए डिज़ाइन किया गया था।
अनुकूली दृष्टिकोण के ऊपर यह है कि आप किसी मौजूदा साइट के कोड का बेहतर लाभ उठा सकते हैं, लेकिन डाउनसाइड्स में से एक यह है कि आप समर्थन के लिए चुने गए प्रत्येक ब्रेकपॉइंट के लिए अलग-अलग लेआउट टेम्पलेट्स बना रहे हैं। यह दीर्घकालिक अवधि में इस समाधान को विकसित और बनाए रखने के लिए आवश्यक वर्कलोड पर असर डालेगा।
डिजाइन नियंत्रण
उत्तरदायी वेबसाइटों की ताकत यह है कि उनकी तरलता उन्हें अनुकूलन दृष्टिकोण में निर्धारित प्री-सेट ब्रेकपॉइंट्स के विपरीत सभी स्क्रीन आकारों को अनुकूलित और समर्थन करने की अनुमति देती है। हकीकत यह है कि उत्तरदायी साइटें कुछ महत्वपूर्ण स्क्रीन आकारों (आमतौर पर आकार जो बाजार पर उपलब्ध लोकप्रिय उपकरणों से मेल खाते हैं) पर बहुत अच्छी लग सकती हैं, लेकिन दृश्य डिजाइन अक्सर उन लोकप्रिय संकल्पों के बीच टूट जाता है।
उदाहरण के लिए, 1400 पिक्सल के चौड़े स्क्रीन लेआउट, 960 पिक्सल के मध्य-स्क्रीन आकार और 480 पिक्सेल पर छोटी स्क्रीन देखने पर साइट बहुत अच्छी लग सकती है, लेकिन इन आकारों के बीच के बीच के बारे में क्या है? एक डिजाइनर के रूप में, इन आकारों के आकार और पृष्ठ के दृश्य रूप में इनके बीच आप पर कोई नियंत्रण नहीं है, अक्सर आदर्श से कम होता है।
अनुकूली वेबसाइट के साथ, आपके द्वारा उपयोग किए जाने वाले विभिन्न लेआउट पर अधिक डिज़ाइन नियंत्रण होता है क्योंकि वे आपके स्थापित ब्रेकपॉइंट्स के आधार पर निश्चित आकार होते हैं। उन अजीब राज्यों के बीच अब कोई समस्या नहीं है क्योंकि आपने ध्यान से प्रत्येक "लुक" (प्रत्येक ब्रेकपॉइंट के प्रदर्शन का अर्थ) तैयार किया है जो आगंतुकों को दिया जाएगा।
डिजाइन नियंत्रण के इस स्तर के रूप में आकर्षक लग सकता है, आपको अवगत होना चाहिए कि यह कीमत पर आता है। हां, आपके पास हर ब्रेकपॉइंट के रूप में पूर्ण नियंत्रण है, लेकिन इसका मतलब है कि आपको उन अद्वितीय लेआउट के लिए डिज़ाइन करने के लिए आवश्यक डिज़ाइन समय का निवेश करना होगा। जितना अधिक ब्रेकपॉइंट आप डिजाइन करने के लिए चुनते हैं, उतनी ही अधिक समय आपको उस प्रक्रिया पर खर्च करने की आवश्यकता होगी।
समर्थन की रोटी
उत्तरदायी और अनुकूली वेब डिज़ाइन दोनों विशेष रूप से आधुनिक ब्राउज़रों में, बहुत मजबूत समर्थन का आनंद लेते हैं।
अनुकूली वेबसाइटों को स्क्रीन आकार के पहचान के लिए सर्वर साइड घटकों या जावास्क्रिप्ट की आवश्यकता होती है। जाहिर है, यदि एक अनुकूली साइट को जावास्क्रिप्ट की आवश्यकता है, तो इसका मतलब है कि उस साइट को सही ढंग से काम करने के लिए ब्राउज़र को सक्षम होना आवश्यक है। यह आपके लिए एक बड़ी चिंता नहीं हो सकता है क्योंकि अधिकांश लोगों के पास अपने ब्राउज़र में जावास्क्रिप्ट होगा, लेकिन जब भी किसी साइट पर किसी भी चीज़ पर महत्वपूर्ण निर्भरता हो, तो यह ध्यान दिया जाना चाहिए।
उत्तरदायी वेबसाइटें और मीडिया क्वेरी जो उन्हें शक्ति देती हैं वे सभी आधुनिक ब्राउज़रों में अच्छी तरह से काम करेंगे। आपके पास केवल एक ही समस्या है जो संस्करण 8 के बाद से इंटरनेट एक्सप्लोरर के सबसे पुराने संस्करणों के साथ हैं और नीचे मीडिया प्रश्नों का समर्थन नहीं करते हैं। इसके आसपास काम करने के लिए , जावास्क्रिप्ट पॉलीफिल का अक्सर उपयोग किया जाता है , जिसका मतलब है कि यहां जावास्क्रिप्ट पर भी निर्भरता है, कम से कम आईई के उन पुराने संस्करणों के लिए। दोबारा, यह आपके लिए बहुत चिंता नहीं हो सकता है, खासकर यदि आपकी साइट एनालिटिक्स दिखाती है कि आपको उन पुराने ब्राउज़र संस्करणों का उपयोग करके कई आगंतुक नहीं मिलते हैं।
भविष्य की मित्रता
उत्तरदायी वेबसाइटों की द्रव प्रकृति उन्हें भविष्य-मित्रता की बात करते समय अनुकूली साइटों पर लाभ प्रदान करती है। ऐसा इसलिए है क्योंकि उन उत्तरदायी साइटों को केवल ब्रेकपॉइंट्स के पहले स्थापित सेट को समायोजित करने के लिए नहीं बनाया गया है। वे सभी स्क्रीनों को फिट करने के लिए अनुकूल हैं, जिनमें वे वास्तव में आज बाजार में नहीं हो सकते हैं। इसका मतलब यह है कि यदि कोई नया स्क्रीन रेज़ोल्यूशन अचानक लोकप्रिय हो जाता है तो उत्तरदायी साइटों को "निश्चित" होने की आवश्यकता नहीं होगी।
डिवाइस परिदृश्य में अविश्वसनीय विविधता को देखते हुए (अगस्त 2015 तक, बाजार पर 24,000 से अधिक विशिष्ट एंड्रॉइड डिवाइस थे), ऐसी साइटें जो स्क्रीन की इस विस्तृत श्रृंखला को समायोजित करने के लिए सबसे अच्छी है, भविष्य-मित्रता के लिए महत्वपूर्ण रूप से महत्वपूर्ण है। ऐसा इसलिए है क्योंकि भविष्य में भविष्य में कोई भी कम विविधता प्राप्त करने की संभावना नहीं है, जिसका अर्थ है कि विशिष्ट स्क्रीन या आकार के लिए डिज़ाइन करना असंभव हो जाएगा, अगर हम पहले से ही उस वास्तविकता तक नहीं पहुंच पाए हैं।
इस तुलनात्मक परिदृश्य के दूसरी तरफ, यदि कोई साइट अनुकूली है और यह नए संकल्पों को समायोजित नहीं करती है जो बाजार में महत्वपूर्ण हो सकती हैं, तो आपको उस साइट पर उस ब्रेकपॉइंट को जोड़ने के लिए मजबूर होना पड़ सकता है। यह परियोजनाओं पर डिजाइन और विकास का समय जोड़ता है और इसका मतलब यह है कि उन अनुकूली साइटों को लगातार निगरानी के लिए निगरानी की जानी चाहिए ताकि बाजार में कोई नया ब्रेकपॉइंट पेश नहीं किया जा सके जो साइट पर जोड़ा जाना चाहिए। दोबारा, डिवाइस विविधता के साथ यह है कि, नए आकारों की जांच करने के लिए लगातार और नए ब्रेकपॉइंट्स के साथ उन्हें समायोजित करना एक चुनौतीपूर्ण चुनौती है जो उस साइट पर समर्थन करने के लिए आवश्यक है जिस पर आपको साइट का समर्थन करना होगा और उस रखरखाव की लागत कंपनी या संगठन जिसके लिए साइट के लिए है।
प्रदर्शन
डाउनलोड गति / प्रदर्शन दृष्टिकोण से खराब समाधान होने के कारण उत्तरदायी वेब डिज़ाइन पर लंबे समय से आरोप लगाया गया है (कई मामलों में गलत तरीके से)। यह काफी हद तक इस तथ्य के कारण है कि इस दृष्टिकोण के शुरुआती दिनों में, कई वेब डिज़ाइनर ने साइट के मौजूदा सीएसएस पर छोटे स्क्रीन मीडिया प्रश्नों का सामना किया था। इसने उन सभी छवियों और संसाधनों को मजबूर कर दिया जिनके लिए सभी उपकरणों पर बड़ी स्क्रीन वितरित की जानी चाहिए, भले ही उन छोटी स्क्रीनों ने उन्हें अपने अंतिम लेआउट में उपयोग न किया हो। उत्तरदायी डिजाइन उन दिनों से एक लंबा सफर तय कर चुका है और वास्तविकता यह है कि आज गुणवत्ता उत्तरदायी साइटें प्रदर्शन समस्याओं से ग्रस्त नहीं हैं।
धीरे-धीरे डाउनलोड गति और फूला हुआ वेबसाइट एक उत्तरदायी वेबसाइट समस्या नहीं है - यह एक समस्या है जो सभी वेबसाइटों पर पाई जा सकती है। छवियां जो बहुत भारी हैं, सोशल मीडिया, अत्यधिक स्क्रिप्ट्स और अधिक से फ़ीड करती हैं और साइट को कम करती हैं, लेकिन उत्तरदायी और अनुकूली वेबसाइट दोनों को तेजी से लोड करने के लिए बनाया जा सकता है। बेशक , उन्हें ऐसे तरीके से भी बनाया जा सकता है जो प्रदर्शन को प्राथमिकता नहीं देता है, लेकिन यह स्वयं समाधान का एक गुण नहीं है, बल्कि साइट के विकास में शामिल टीम का प्रतिबिंब है।
लेआउट से परे
अनुकूली वेब डिज़ाइन के सबसे आकर्षक पहलुओं में से एक यह है कि आपके पास सेट ब्रेकपॉइंट्स के लिए साइट के डिज़ाइन पर नियंत्रण नहीं है, बल्कि उन साइट संस्करणों के लिए वितरित संसाधन भी हैं। उदाहरण के लिए, इसका मतलब है कि रेटिना छवियों को केवल रेटिना उपकरणों पर भेजा जा सकता है, जबकि गैर-रेटिना स्क्रीन फ़ाइल आकार में छोटी छवियों को अधिक उचित छवियां प्राप्त करती हैं। अन्य साइट संसाधन (जावास्क्रिप्ट फ़ाइलें, सीएसएस शैलियों, इत्यादि) को केवल तभी वितरित किया जा सकता है जब उनकी आवश्यकता होती है और इसका उपयोग किया जाएगा।
अनुकूली वेब डिज़ाइन का यह उपयोग सरल समीकरण से बहुत दूर है "यदि आप किसी वेबसाइट को दोबारा तैयार कर रहे हैं, तो अनुकूली उपयोग करने का एक आसान तरीका हो सकता है।" पूरी रीडिज़ाइन समेत सभी साइटें, एक अधिक अनुकूल अनुभव के लिए एक स्मार्ट दृष्टिकोण से लाभान्वित हो सकती हैं।
यह परिदृश्य इस "उत्तरदायी बनाम अनुकूली" बहस की नीची प्रकृति दिखाता है। हालांकि यह सच है कि एक अनुकूली दृष्टिकोण साइट रेट्रोफिट के लिए उत्तरदायी से बेहतर अनुकूल हो सकता है, यह पूर्ण रीडिज़ाइन के लिए भी एक अच्छा समाधान हो सकता है। इसी तरह, कुछ मामलों में एक संवेदनशील साइट को मौजूदा साइट के कोड-बेस पर जोड़ा जा सकता है, जिससे वह साइट पूरी तरह उत्तरदायी दृष्टिकोण के सभी लाभ प्रदान करती है।
कौन सा दृष्टिकोण बेहतर है?
जब उत्तरदायी बनाम अनुकूली वेब डिज़ाइन की बात आती है, तो कोई स्पष्ट "विजेता" नहीं होता है, हालांकि उत्तरदायी निश्चित रूप से अधिक लोकप्रिय दृष्टिकोण है। सच में, "बेहतर" दृष्टिकोण एक विशिष्ट परियोजना की जरूरतों पर निर्भर करता है। इसके अलावा, इसे "या तो / या" स्थिति होने की आवश्यकता नहीं है। ऐसे कई वेब पेशेवर हैं जो साइटें बना रहे हैं जो अनुकूली डिज़ाइन (बेहतर डिज़ाइन नियंत्रण, साइट संसाधनों की स्मार्ट लोडिंग) की ताकत के साथ सर्वश्रेष्ठ उत्तरदायी वेब डिज़ाइन (तरल चौड़ाई, भविष्य का समर्थन) को जोड़ती हैं।
आम तौर पर आरईएस (सर्वर साइड घटक के साथ उत्तरदायी वेब डिज़ाइन) के रूप में जाना जाता है, यह दृष्टिकोण दर्शाता है कि वास्तव में कोई भी "एक आकार सभी समाधान फिट बैठता है।" दोनों उत्तरदायी वेब डिज़ाइन और अनुकूली में उनकी ताकत और उनकी चुनौतियां होती हैं, इसलिए आपको यह निर्धारित करने की आवश्यकता है कि कौन सा आपकी विशिष्ट परियोजना के लिए सबसे अच्छा काम करेगा, या यदि एक हाइब्रिड समाधान वास्तव में आपको सबसे अच्छा लगा सकता है।