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