यद्यपि मोबाइल अनुकूलन के बिना वेबसाइटों की संख्या कम हो रही है, कुछ ऐसी वेबसाइटें हैं जो केवल डेस्कटॉप के लिए डिज़ाइन की गई हैं। दुर्भाग्य से, Google की पिछली 'मोबिलाइज़र' वेब सेवा बंद कर दी गई है। सेवा का आध्यात्मिक उत्तराधिकारी Google वेबलाइट है, जिसे मोबाइल देखने के लिए साइटों को संशोधित करने के बजाय धीमे कनेक्शन के अनुकूलन के लिए डिज़ाइन किया गया है। Google की सेवा के अलावा, ऐसे कई अभ्यास और उपकरण हैं जिन पर मोबाइल को ध्यान में रखते हुए साइट विकसित करते समय विचार किया जाना चाहिए।
कदम
2 का भाग 1: Google वेबलाइट के साथ प्रयोग करना
चरण 1. विश्लेषण करें कि वेबलाइट कैसे काम करता है।
वेबलाइट Google द्वारा बनाया गया एक एल्गोरिथम है जो खराब नेटवर्क स्थितियों में उपयोगकर्ताओं को तेज़ और हल्का पृष्ठ लोड प्रदान करता है। इसका मतलब है कि वेबलाइट का कोई यूजर इंटरफेस नहीं है और यह बैकएंड पर काम करता है। मोबाइल प्लेटफ़ॉर्म के लिए स्पष्ट रूप से अनुकूलित एक के बजाय, पृष्ठों को उनके अधिक जटिल तत्वों से हटा दिया जाता है, जो एक स्ट्रिप-डाउन, हल्का अनुभव प्रदान करते हैं।
चरण 2. वेबलाइट के साथ परीक्षण साइट में परिवर्तन।
अपने मोबाइल उपकरण पर, वेबलाइट पते के अंत में बस अपना पूरा साइट URL संलग्न करें (उदाहरण के लिए यदि आपकी वेबसाइट "mywebsite.com" है तो आप https://googleweblight.com/?lite_url=https://mywebsite.com दर्ज करें।) पृष्ठ स्वयं का एक सरल लेकिन कार्यात्मक संस्करण लोड करेगा। हटाए गए तत्वों के साथ, कुछ साइटें मोबाइल डिवाइस स्क्रीन पर बहुत बेहतर दिखाई दे सकती हैं।
चरण 3. सीमाओं को पहचानें।
ध्यान रखें कि यह एक स्पष्ट कनवर्टर टूल नहीं है जिसे उपयोगकर्ता इंटरैक्शन के लिए डिज़ाइन किया गया है। वेबसाइट में मैन्युअल रूप से प्रवेश करते समय चुटकी में इस्तेमाल किया जा सकता है, वेबलाइट को गति के लिए डिज़ाइन किया गया है, उपयोगिता के लिए नहीं।
भाग 2 का 2: मोबाइल संगतता के लिए डिजाइनिंग
चरण 1. मोबाइल डिवाइस की सीमाओं को ध्यान में रखें।
मोबाइल डिवाइस कुछ पहलुओं को साझा करते हैं जो उन्हें अपने डेस्कटॉप समकक्षों से अलग बनाते हैं। मोबाइल उपभोग के लिए साइट बनाते समय ये मुख्य विशेषताएं मुख्य विचार होनी चाहिए।
- छोटी स्क्रीन और लंबवतता: हालांकि मोबाइल उपकरणों पर स्क्रीन रिज़ॉल्यूशन में लगातार सुधार हो रहा है, साइट डिज़ाइन के लिए आकार और रूप कारक चिंता का विषय बना हुआ है। किसी साइट को एकल कॉलम लेआउट में डिज़ाइन करना फ़ोन के लिए सबसे अच्छा है (टैबलेट अक्सर बहुत अधिक समस्या के बिना डेस्कटॉप साइटों का उपयोग कर सकते हैं)।
- टच इंटरफेस: पृष्ठ तत्वों को एक उंगली के आकार को ध्यान में रखकर रखा जाना चाहिए। माउसओवर का उपयोग करने वाले तत्वों को स्पर्श के लिए छोटा या पुन: डिज़ाइन किया जाना चाहिए (उदा. ड्रॉपडाउन मेनू)।
- डेटा गति: मोबाइल उपकरणों के महान लाभों में से एक वाईफाई रेंज के बाहर उपयोग है, लेकिन डेटा कनेक्शन आमतौर पर धीमे और कम विश्वसनीय होते हैं। उपयोगकर्ता इंटरफेस (यूआई) सरल रहना चाहिए और सामग्री दृश्यमान और सुलभ होनी चाहिए। बहुत अधिक अव्यवस्था लोड समय को कम कर देगी और नेविगेशन को कठिन बना देगी।
चरण 2. एक सामग्री प्रबंधन प्रणाली (सीएमएस) सेवा का उपयोग करें।
कम संसाधनों के साथ विकसित होने वालों के लिए, Wordpress या Squarespace जैसी CMS सेवा का उपयोग करना कम लागत, उपयोगकर्ता के अनुकूल मोबाइल डिज़ाइन के लिए एक बढ़िया विकल्प है। उत्तरदायी वेब डिज़ाइन का उपयोग करने वाले विषय मोबाइल साइट के लिए सबसे आसान टेम्पलेट प्रदान करेंगे।
रिस्पॉन्सिव वेब डिज़ाइन वेब डिज़ाइन का एक सिद्धांत है जो फ़्लूइड डिज़ाइन तत्वों के उपयोग को बढ़ावा देता है ताकि प्लेटफ़ॉर्म पर डिज़ाइन और उपयोगिता के सुचारू परिवर्तन की अनुमति मिल सके।
चरण 3. डेस्कटॉप सॉफ़्टवेयर का उपयोग करके मोबाइल डिवाइस स्क्रीन का परीक्षण करें।
कई मुफ्त वेब एप्लिकेशन हैं जो आपको वेबसाइट सौंदर्यशास्त्र और कार्यक्षमता का परीक्षण करने के लिए मोबाइल उपकरणों का अनुकरण करने की अनुमति देते हैं। इन उपकरणों का उपयोग करना उतना ही आसान है जितना कि वांछित परीक्षण उपकरण का चयन करना, फिर पूर्वावलोकन के लिए लक्षित वेबसाइट में प्रवेश करना। अधिकांश में स्क्रीन ओरिएंटेशन, पिक्सेल घनत्व, या यहां तक कि ब्राउज़र चयन जैसे चर के लिए टूल शामिल होंगे। कुछ लोकप्रिय उदाहरण हैं:
- क्रोम डिवाइस मोड एमुलेटर
- mobilephoneemulator.com
- स्क्रीनफ्लाई (क्विर्कटूल का एक सबसेट)
- mobiletest.me (सशुल्क सदस्यता)