संभावना है कि आपने देखा है कि कैसे iPhone वेब पेजों को फ्लिप और विस्तारित कर सकता है। यह आपको एक नज़र में संपूर्ण वेब पेज दिखा सकता है या पाठ को पढ़ने योग्य बनाने के लिए ज़ूम इन कर सकता है। एक अर्थ में, चूंकि iPhone सफारी का उपयोग करता है, वेब डिज़ाइनरों को iPhone पर काम करने वाला वेब पेज बनाने के लिए कुछ खास नहीं करना चाहिए। लेकिन क्या आप वाकई चाहते हैं कि आपका पेज केवल काम करे -- या अलग दिखें और चमकें?
जब आप एक वेब पेज बनाएं, आपको यह सोचने की ज़रूरत है कि इसे कौन देखेगा और वे इसे कैसे देखने जा रहे हैं। कुछ बेहतरीन साइटें इस बात का ध्यान रखती हैं कि पेज किस प्रकार के डिवाइस पर देखा जा रहा है, जिसमें रिज़ॉल्यूशन, रंग विकल्प और उपलब्ध फ़ंक्शन शामिल हैं। वे इसका पता लगाने के लिए केवल डिवाइस पर निर्भर नहीं हैं।
मोबाइल उपकरणों के लिए साइट बनाने के लिए सामान्य दिशानिर्देश
- जितना हो सके उतने उपकरणों पर परीक्षण करें। पहली चीज़ जो आपको करनी चाहिए वह है अपनी साइट को iPhone पर और कई अलग-अलग देखना मोबाइल उपकरणों या एमुलेटर जैसा आप कर सकते हैं। जब आप अपने सभी परीक्षणों के लिए एमुलेटर का उपयोग कर सकते हैं, तो वे वास्तव में आपको उतना ही अनुभव नहीं देते हैं जितना कि छोटी स्क्रीन पर एक वेबसाइट के माध्यम से नेविगेट करने का प्रयास करते हैं। आपको यथासंभव वास्तविक उपकरणों पर परीक्षण करना चाहिए।
- अपने पृष्ठों को इनायत से नीचा दिखाना। आप के लिए अपने पेज लिख सकते हैं फ्लैश-सक्षम, वाइडस्क्रीन ब्राउज़र, लेकिन सुनिश्चित करें कि महत्वपूर्ण जानकारी एक छोटे मॉनिटर में भी दिखाई दे रही है जो किसी विशेष सुविधा (जैसे कुकीज़, अजाक्स, फ्लैश, जावास्क्रिप्ट, आदि) को संभाल नहीं सकता है। एक्सएचटीएमएल बेसिक से परे कुछ भी कुछ सेल फोन से परे होगा। जबकि अधिकांश स्मार्टफोन उन सभी चीजों को संभाल सकते हैं, अन्य मोबाइल डिवाइस नहीं कर सकते।
- एक वायरलेस-विशिष्ट पृष्ठ बनाएं -- और इसे ढूंढना आसान बनाएं। यदि आप अपने सेल फ़ोन और वायरलेस ग्राहकों के लिए एक विशिष्ट पृष्ठ बनाने जा रहे हैं -- तो उसे उपलब्ध कराएँ। एक बढ़िया तरीका यह है कि लिंक को अपने दस्तावेज़ के शीर्ष पर वायरलेस पेज पर रखा जाए, और फिर हैंडहेल्ड मीडिया प्रकार का उपयोग करके उस लिंक को गैर-हैंडहेल्ड डिवाइस से छिपा दिया जाए। आखिरकार, ज्यादातर लोग आपके होम पेज पर आते हैं, यहां तक कि सेल फोन पर भी -- और अगर आपके वायरलेस पेज का लिंक नहीं है, तो पेज का उपयोग करने में बहुत मुश्किल होने पर वे चले जाएंगे।
स्मार्टफ़ोन के लिए वेब पेज लेआउट
स्मार्टफोन बाजार के लिए पेज लिखते समय आपको सबसे पहली बात यह याद रखनी चाहिए कि अगर आप नहीं चाहते हैं तो आपको कोई बदलाव नहीं करना पड़ेगा। उपलब्ध अधिकांश स्मार्टफ़ोन के बारे में सबसे अच्छी बात यह है कि वे वेबकिट ब्राउज़र (आईओएस पर सफारी और एंड्रॉइड पर क्रोम) का उपयोग करते हैं वेब पेज प्रदर्शित करें, इसलिए यदि आपका पृष्ठ सफारी या क्रोम में ठीक दिखता है, तो यह अधिकांश स्मार्टफ़ोन पर ठीक दिखाई देगा (बस बहुत कुछ छोटा)। लेकिन कुछ चीजें हैं जो आप ब्राउज़िंग अनुभव को और अधिक सुखद बनाने के लिए कर सकते हैं:
- याद रखें कि स्क्रीन छोटी है। स्मार्टफ़ोन उन सभी स्तंभों को छोटी विंडो में संघनित कर देंगे, और इससे उन्हें ज़ूम किए बिना पढ़ना बहुत कठिन हो सकता है। अधिकांश उपयोगकर्ता ज़ूम करने के आदी हैं, लेकिन यह थकाऊ हो सकता है। पाठ का एक लंबा स्तंभ पढ़ने में आसान होता है।
- पृष्ठों को छोटे टुकड़ों में विभाजित करें। सेल फोन पर टेक्स्ट के लंबे खंडों को पढ़ना मुश्किल हो सकता है, इसलिए उन्हें कई पेजों पर रखने से उन्हें पढ़ना आसान हो जाता है।
iPhones पर लिंक और नेविगेशन
- यूआरएल जितने छोटे होंगे, उतना अच्छा होगा। यदि आपने कभी सेल फोन पर यूआरएल टाइप करने की कोशिश की है, तो आप जान लेंगे कि यह दर्द है (शायद उन किशोरों के लिए जो बहुत सारे टेक्स्ट संदेश भेजने के आदी हैं)। IPhone पर भी, लंबे URL में टाइप करना थकाऊ है। उन्हें छोटा रखें।
- लेकिन लंबे लिंक टेक्स्ट को टैप करना आसान है। जब एक पृष्ठ पर जहां कई अलग-अलग शब्द अलग-अलग लेखों से जुड़े होते हैं, एक-दूसरे के ठीक बगल में, ज़ूम किए बिना सही को टैप करना बहुत मुश्किल हो सकता है। बहुत से लोग बस हार मान लेंगे और कहीं और चले जाएंगे। 3 से 5 शब्दों वाले लिंक 1-शब्द लिंक की तुलना में फ़ोन पर क्लिक करना आसान होता है।
- अपने नेविगेशन को स्क्रीन के सबसे ऊपर न रखें। आप जो जानकारी चाहते हैं उसे खोजने के लिए स्क्रीन और लिंक की स्क्रीन के माध्यम से पेज करने से ज्यादा कष्टप्रद कुछ नहीं है। यदि आपने उन वेब पेजों को देखा है जो सेल फोन के लिए डिज़ाइन किए गए थे, तो आप देखेंगे कि सबसे पहले जो चीजें दिखाई देती हैं वे हैं सामग्री और शीर्षक। फिर, उसके नीचे नेविगेशन है।
- अपने नेविगेशन को छिपाने से न डरें।नेविगेशन लिंक छिपाना सीएसएस या जावास्क्रिप्ट के साथ और उन्हें केवल तभी प्रकट करना जब उपयोगकर्ता इसके लिए पूछता है, स्मार्टफोन उपयोगकर्ताओं के लिए पेज को आसान बनाने का एक तरीका है।
स्मार्टफ़ोन पर छवियों के लिए युक्तियाँ
- चित्र छोटे होने चाहिए। हां, एंड्रॉइड और आईफ़ोन छवियों को ज़ूम इन और ज़ूम आउट कर सकते हैं, लेकिन वे जितने छोटे होंगे, दोनों आयामों और डाउनलोड समय में, आपके वायरलेस ग्राहक उतने ही खुश होंगे। छवियों का अनुकूलन हमेशा एक अच्छा विचार है, लेकिन सेल फोन पेजों के लिए, यह महत्वपूर्ण है।
- छवियों को जल्दी से डाउनलोड करना होगा। जब आप किसी मोबाइल डिवाइस से छवियों को देख रहे होते हैं तो वे वेब पेजों पर बहुत अधिक स्थान लेते हैं। और जब वे अक्सर बहुत अच्छे होते हैं और पूर्ण-स्क्रीन वेब ब्राउज़र पर देखे जाने पर पृष्ठों को बेहतर बनाते हैं, तो वे अक्सर मोबाइल डिवाइस पर आड़े आ जाते हैं। साथ ही जब कोई स्मार्टफोन उपयोगकर्ता सेलुलर नेटवर्क पर होता है, तो आखिरी चीज जिसके लिए वे भुगतान करना चाहते हैं, वह है विशाल छवियों या नेविगेशन आइकन का एक गुच्छा डाउनलोड करना।
- बड़ी छवियों को पृष्ठ के शीर्ष पर न रखें। नेविगेशन की तरह ही, पृष्ठ के शीर्ष पर लोड होने के लिए 3 से 4 स्क्रीनफुल वाली छवि की प्रतीक्षा करना बहुत कठिन हो सकता है। और यह वेब पेजों पर बेहद आम है। इसका एकमात्र अपवाद यह है कि यदि पाठक जानता है कि क्लिक करने पर उन्हें एक छवि प्राप्त होने वाली है, जैसे कि एक फोटो गैलरी में।
मोबाइल के लिए डिजाइन करते समय किन बातों का ध्यान रखें?
मोबाइल के अनुकूल पेज बनाते समय आपको कई चीजों से बचना चाहिए। जैसा कि ऊपर उल्लेख किया गया है, यदि आप वास्तव में इन्हें अपने पृष्ठ पर रखना चाहते हैं, तो आप कर सकते हैं, लेकिन सुनिश्चित करें कि साइट उनके बिना काम करती है।
- Chamak: अधिकांश मोबाइल फ़ोन फ़्लैश का समर्थन नहीं करते हैं, इसलिए इसे अपने वायरलेस पृष्ठों पर शामिल करना एक अच्छा विचार नहीं है।
- कुकीज़: कई सेल फोन में कुकी सपोर्ट नहीं होता है। iPhones के पास है कुकी समर्थन.
- फ्रेम्स: भले ही ब्राउज़र उनका समर्थन करता हो, स्क्रीन के आयामों के बारे में सोचें। फ़्रेम केवल मोबाइल उपकरणों पर काम नहीं करते -- वे पढ़ने में बहुत कठिन या असंभव होते हैं।
- टेबल: मोबाइल पेज पर लेआउट के लिए टेबल का उपयोग न करें। और सामान्य रूप से टेबल से बचने की कोशिश करें। वे हर सेलफोन पर समर्थित नहीं हैं (हालाँकि iPhones और अन्य स्मार्टफ़ोन उनका समर्थन करते हैं) और आप अजीब परिणामों के साथ समाप्त हो सकते हैं।
- नेस्टेड टेबल: यदि आपको किसी तालिका का उपयोग करना है, तो सुनिश्चित करें कि इसे किसी अन्य तालिका में घोंसला न बनाएं। डेस्कटॉप ब्राउज़रों के लिए इनका समर्थन करना कठिन होता है, और, अधिक से अधिक, पृष्ठ को अधिक धीरे-धीरे लोड करते हैं।
- निरपेक्ष उपाय: दूसरे शब्दों में, वस्तुओं के आयामों को पूर्ण आकार (जैसे पिक्सेल, मिलीमीटर, या इंच) में परिभाषित न करें। यदि आप किसी चीज़ को 100px चौड़े के रूप में परिभाषित करते हैं, तो एक मोबाइल डिवाइस पर जो आधी स्क्रीन हो सकती है और दूसरे पर यह चौड़ाई से दो गुना हो सकती है। सापेक्ष आकार (जैसे ईएमएस और प्रतिशत) सबसे अच्छा काम करते हैं।
- फोंट्स: यह मत समझो कि इनमें से कोई भी फोंट्स आप सेल फोन पर उपलब्ध होने के लिए उपयोग करने के लिए उपयोग कर रहे हैं।