आज अधिकांश लोग मोबाइल गैजेट्स - टैबलेट, फोन के माध्यम से ऑनलाइन हो जाते हैं, इस संबंध में वेबसाइट ऑप्टिमाइजेशन भी एक नए स्तर पर पहुंच रहा है। यदि कोई उपयोगकर्ता अंदर आता है और देखता है कि साइट मोबाइल उपकरणों के लिए अनुकूलित नहीं है: छवि नहीं देखी जा सकती है, बटन बाहर निकल गए हैं, फोंट छोटे और अपठनीय हैं, डिजाइन तिरछा है - 100% में से 99 कि वह बाहर निकल जाएगा और एक और अधिक सुविधाजनक की तलाश शुरू करें। और खोज रोबोट बॉक्स को चेक करेगा कि संसाधन अप्रासंगिक है, अर्थात यह खोज क्वेरी से मेल नहीं खाता है। इसलिए, पृष्ठ का डिज़ाइन विभिन्न मोबाइल उपकरणों के अनुकूल होना चाहिए। साइट का मोबाइल संस्करण क्या है, इसे कैसे बनाया जाता है, और इसे लागू करने का सबसे अच्छा तरीका क्या है? इस लेख में और पढ़ें।
तो आपकी साइट को मोबाइल के अनुकूल बनाने के चार प्रमुख तरीके हैं।
विधि एक - उत्तरदायी डिजाइन
रिस्पॉन्सिव टेम्प्लेट स्क्रीन के आकार के आधार पर साइट की छवि बदलते हैं। एक नियम के रूप में, वे मानक 1600, 1500, 1280, 1100, 1024 और 980 पिक्सेल पर सेट हैं। कार्यान्वयन के लिए, CSS3 मीडिया क्वेरी का उपयोग किया जाता है। साइट का डिज़ाइन स्वयं नहीं बदलता है।
इस पद्धति के फायदों में शामिल हैं:
- सुविधाजनक विकास,चूंकि संरचना स्वयं स्क्रीन मापदंडों के अनुकूल होती है, और किसी भी अपडेट के लिए खरोंच से डिजाइन विकास की आवश्यकता नहीं होती है, यह सीएसएस और एचटीएमएल को ट्विक करने के लिए पर्याप्त है;
- एक यूआरएल - उपयोगकर्ता को कई नामों को याद रखने की आवश्यकता नहीं है, रीडायरेक्ट (एक पते से दूसरे पते पर रीडायरेक्ट) की कोई आवश्यकता नहीं है, जो वेबमास्टर के काम को जटिल बना सकता है, और यह खोज के लिए आसान है एक ही पते के साथ संसाधन को सॉर्ट और रैंक करने के लिए इंजन।
बेशक, अनुकूली टेम्पलेट्स में उनकी कमियां हैं, जो, वैसे, फायदे से ज्यादा हैं। फिर भी, कई डेवलपर्स इस अवधारणा का पालन करते हैं, उदाहरण के लिए, Google Corporation, जिसकी साइट के मोबाइल संस्करण में एक अनुकूली डिज़ाइन है। तो, नुकसान:
- रिस्पॉन्सिव डिज़ाइन मोबाइल पर उन्हीं कार्यों का समर्थन नहीं करता जैसा वह पीसी पर करता है। यदि यह, उदाहरण के लिए, किसी बैंक की वेबसाइट का मोबाइल संस्करण है, जहां विनिमय दर या निकटतम एटीएम के बारे में जानकारी उपयोगकर्ता के लिए महत्वपूर्ण होने की अधिक संभावना है, तो यह डिज़ाइन काफी पर्याप्त है। लेकिन अगर यह कई वर्गों और उपखंडों के साथ एक जटिल संरचित संसाधन है, तो आगंतुकों को शायद ही अनुकूली लेआउट पसंद आएगा।
- धीमा लोडिंग एक पसंदीदा साइट को घृणित साइट में बदल देती है। यह उन संसाधनों के लिए विशेष रूप से सच है जहां एनिमेशन, वीडियो, पॉप-अप और अन्य सक्रिय तत्व बहुतायत में हैं। अधिक वजन के कारण, पृष्ठ बस "धीमा" हो जाएगा, उपयोगकर्ता क्रोधित हो जाएगा और छोड़ देगा, और साइट की खोज स्थिति गिर जाएगी।
- मोबाइल संस्करण को बंद करने में असमर्थता एक और महत्वपूर्ण कमी है। यदि इस तरह के लेआउट से कुछ तत्व छिपा हुआ है, तो आपआप इसे खोलने के लिए कुछ नहीं कर सकते, उन साइटों के विपरीत जहां आप इसे बंद कर सकते हैं और एक नियमित डोमेन पर स्विच कर सकते हैं।
हालांकि, साइट का ऐसा मोबाइल संस्करण बिना किसी विशेष कौशल और लागत के, आपको किसी भी गैजेट के लिए संसाधन को अनुकूलित करने की अनुमति देता है। लेकिन, सूचीबद्ध कमियों को देखते हुए, यह जटिल नेविगेशन और एनीमेशन के बिना, न्यूनतम जानकारी और मल्टीमीडिया के साथ छोटे, सरल संसाधनों के अनुरूप होगा। एक जटिल साइट के लिए, 2 अन्य विधियाँ उपयुक्त हैं।
दूसरी विधि - साइट का एक अलग संस्करण
यह विधि बहुत सामान्य है और मोबाइल डिवाइस पर साइट को अधिक पठनीय बनाने में अक्सर सफल होती है। इसका सार पृष्ठ का एक अलग संस्करण बनाना है, जो एप्लिकेशन के लिए तैयार किया गया है और एक अलग URL या उपडोमेन पर स्थित है, उदाहरण के लिए, m.vk.com। उसी समय, मुख्य कार्यक्षमता संरक्षित है, साइट का डिज़ाइन बस अलग दिखता है। इस पद्धति के फायदे स्पष्ट हैं:
- उपयोगकर्ता के अनुकूल इंटरफेस;
- बदलना और संपादित करना आसान है क्योंकि संस्करण मुख्य संसाधन से अलग मौजूद है;
- कम वजन के कारण, साइट का एक अलग संस्करण अनुकूली टेम्पलेट की तुलना में बहुत तेजी से काम करता है;
- अक्सर मोबाइल से पेज के मुख्य संस्करण में जाना संभव होता है।
लेकिन यहां भी कुछ कमियां थीं:
- एकाधिक पते - साइट का डेस्कटॉप और मोबाइल संस्करण। उपयोगकर्ता को दो विकल्प कैसे याद रखें? वेब मास्टर्स अक्सर डेस्कटॉप संस्करण से मोबाइल संस्करण के लिए एक रीडायरेक्ट (रीडायरेक्ट) लिखते हैं, लेकिन साथ ही, यदि यह पेज मोबाइल में हैसंस्करण मौजूद नहीं है, उपयोगकर्ता को एक त्रुटि प्राप्त होगी। यहाँ, खोज इंजन के साथ कठिनाइयाँ उत्पन्न होती हैं, जिन्हें 2 समान संसाधनों को रैंक करना मुश्किल लगता है, और यह सीधे प्रचार को प्रभावित करता है।
- कंप्यूटर से साइट का मोबाइल संस्करण, यदि उपयोगकर्ता गलती से उस पर जाता है, तो यह हास्यास्पद लगेगा, जो ट्रैफ़िक को भी प्रभावित कर सकता है।
- इस संस्करण में अक्सर भारी कटौती की जाती है, डेस्कटॉप, इसलिए उपयोगकर्ता को बहुत सीमित कार्यक्षमता मिलेगी। लेकिन साथ ही, अगर कुछ गुम है, तो आगंतुक पृष्ठ के पूर्ण संस्करण पर जा सकते हैं।
सामान्य तौर पर, एक अलग मोबाइल साइट अपने आप को सही ठहराती है और मोबाइल उपकरणों के लिए संसाधन को अनुकूलित करने का सबसे सामान्य तरीका है। यह Amazon जैसे बड़े ऑनलाइन स्टोर में लोकप्रिय है।
तीसरा तरीका - आरईएसएस डिजाइन
Google सर्च इंजन मोबाइल डिजाइन की इस दिशा में सक्रिय रूप से समर्थन करता है। साइट को फ़ोन या टैबलेट के अनुकूल बनाने के लिए यह सबसे जटिल, महंगा, लेकिन प्रभावी तरीका है। इसे आरईएसएस कहा जाता है। यह एक संसाधन को मोबाइल एप्लिकेशन में लक्षित कर रहा है जिसे प्रत्येक डिवाइस के लिए अलग से डाउनलोड किया जा सकता है। Android के लिए - GooglePlay के साथ, और Apple के लिए - iTunes के साथ।
इस तरह के एप्लिकेशन तेज, मुफ्त, सुविधाजनक होते हैं, विभिन्न प्रकार की सूचनाओं को समायोजित करने की क्षमता रखते हैं, जबकि फोन की मेमोरी और इंटरनेट ट्रैफिक को खत्म नहीं किया जाता है, जैसे कि किसी ब्राउज़र के माध्यम से साइट पर जाने पर। उन्हें एक्सेस करना आसान है, क्योंकि लिंक हमेशा स्क्रीन पर रहेगा, और ब्राउज़र एड्रेस बार में जटिल नाम दर्ज करने की कोई आवश्यकता नहीं है।
बिल्कुल, यहाँ हैं औरइसकी कमियां, जैसे विकास में जटिलता, बड़ी संख्या में प्रोग्रामर के श्रम की उच्च लागत, कई लेआउट विकल्प बनाने की आवश्यकता। कभी-कभी मोबाइल डिवाइस को एप्लिकेशन द्वारा पहचाना नहीं जाता है। नियमित तकनीकी सहायता, कमियों का सुधार आवश्यक है। फिर भी, इस विकल्प को इसके उत्पादक, अबाधित संचालन के कारण प्रस्तावित तीनों में से सर्वश्रेष्ठ माना जाता है।
मोबाइल वेबसाइट बनाने का सबसे सस्ता तरीका
उपरोक्त सभी विधियों में शामिल है, भले ही यह हमेशा लंबा और कठिन न हो, लेकिन फिर भी एक वेबमास्टर का भुगतान किया हुआ काम होता है। यदि आप इस तरह के विकास की तत्काल आवश्यकता नहीं देखते हैं, तो साइट का एक सरल और मुफ्त मोबाइल संस्करण आपके लिए उपयुक्त होगा। इसे बनाने का सबसे आसान तरीका क्या है?
रिस्पॉन्सिव डिज़ाइन के लिए विशेष टेम्प्लेट (प्लगइन्स) डाउनलोड करें। उदाहरण के लिए, WP मोबाइल डिटेक्टर, वर्डप्रेस मोबाइल पैक, WPSmart मोबाइल और अन्य। वे साइट को फ़ोन पर अधिक सही ढंग से प्रदर्शित करने में मदद करेंगे, जबकि आपको पृष्ठ को मोबाइल संस्करण में बेहतर ढंग से अनुकूलित करने के लिए क्या सुधारा जाना चाहिए, इसके बारे में कुछ सुझाव प्राप्त होंगे।
बेशक, गंभीर संसाधनों के लिए यह विधि शायद ही उपयुक्त है। बल्कि, यह मुफ्त सुविधा छोटी और सरल साइटों, ब्लॉगों, समाचार फ़ीड के लिए है। यह मत भूलो कि Google खोज इंजन, साथ ही यांडेक्स, आज मोबाइल संस्करणों पर गंभीर मांग करता है, इसलिए इस पद्धति का उपयोग करके आपके पदों को कम करने का एक बड़ा मौका है।
इस पद्धति से, सबसे अधिक संभावना है, विज्ञापन और पॉप-अप काट दिए जाएंगेबैनर, लेकिन पेज जल्दी और बिना "लैग्स" के लोड होगा।
मोबाइल संस्करण बनाने के सिद्धांत
इससे कोई फर्क नहीं पड़ता कि साइट का मोबाइल संस्करण मुफ्त में बनाया गया था या वेबमास्टर्स के कर्मचारियों की मदद से, इसे आरईएसएस सिस्टम पर या अनुकूली टेम्पलेट का उपयोग करके बनाया गया था। सबसे महत्वपूर्ण बात यह है कि इसके प्रभावी संचालन के लिए कई अत्यंत महत्वपूर्ण सिद्धांतों का पालन करना आवश्यक है। तो, साइट का मोबाइल संस्करण क्या होना चाहिए? इसे उत्पादक, कुशल और उत्पादक कैसे बनाया जाए?
अनावश्यक सब कुछ हटा दें
न्यूनतमवाद वह है जिसके लिए साइट के मोबाइल संस्करण के विकासकर्ता को प्रयास करना चाहिए। कल्पना कीजिए कि रंगों, बटनों, बैनरों से भरी जानकारी को समझना कितना कठिन है, और जिसे आपको सही सामग्री की तलाश में अंतहीन रूप से स्क्रॉल करना पड़ता है। मोबाइल का डिजाइन सरल और साफ होना चाहिए। अंतरिक्ष को विभाजित करने के लिए 2-3 रंग चुनें (उदाहरण के लिए, ब्रांडेड)। उनमें से एक सफेद हो तो बेहतर। एक छोटे परदे के स्थान को समझने योग्य और पठनीय क्षेत्रों में विभाजित करें। वर्चुअल कुंजियाँ दिखाई देनी चाहिए ताकि उपयोगकर्ता स्पष्ट रूप से जान सके कि कहाँ प्रेस करना है और देखना है - यहाँ उत्पाद है, यहाँ डेटा भरने के लिए प्रपत्र है, यहाँ वितरण और भुगतान की जानकारी है।
डेस्कटॉप संस्करण में उपयोगी और उपयोगकर्ता के लिए जीवन को आसान बनाने वाले सभी अतिरिक्त विकल्प यहां केवल मुश्किलें ही लाएंगे। केवल सबसे महत्वपूर्ण तत्वों को छोड़ दें। एनिमेशन, विज्ञापन बैनर, मल्टीमीडिया, सबसे अधिक संभावना है, केवल साइट या एप्लिकेशन के काम को धीमा कर देगा और इससे ध्यान भटकाएगामुख्य।
संरेखण
अलाइनमेंट का मसला भी कम तीव्र नहीं है, क्योंकि गलत तरीके से करने पर यूजर को केवल महत्वपूर्ण शब्दों के अंत ही मिलेंगे। वाम-संरेखित और लंबवत संरेखण आम तौर पर स्वीकार किए जाते हैं। कल्पना कीजिए कि आप अपने फोन पर समाचार फ़ीड के माध्यम से स्क्रॉल कर रहे हैं। आप इसे ऊपर से नीचे तक करते हैं, बाएं या दाएं नहीं।
एकीकरण
जब संक्रमण की एक लंबी श्रृंखला की कोई संभावना नहीं है, तो कई चरणों को एक में मिलाने का प्रयास करें। उदाहरण के लिए, साइट को कई चरणों में डेटा प्रविष्टि की आवश्यकता होती है - एक नाम, फिर एक पता, जहां प्रत्येक व्यक्तिगत सेल में एक अलग घर, सड़क, अपार्टमेंट आदि होता है। उपयोगकर्ता को कई छोटी कोशिकाओं को हिट करने का प्रयास करने के लिए मजबूर नहीं करने के लिए, उसे केवल 2 - नाम और पता भरने के लिए कहें।
और वियोग
कभी-कभी, इसके विपरीत, बहुत अधिक जानकारी को अलग करने की आवश्यकता होती है। उदाहरण के लिए, ड्रॉप-डाउन मेनू में आपके पास 80 से अधिक शहरों की सूची है जहां डिलीवरी की जाती है। उन्हें क्षेत्र के आधार पर समूहित करें ताकि उपयोगकर्ता को इस विशाल सूची में स्क्रॉल न करना पड़े। जब वह क्षेत्रीय केंद्र या क्षेत्र पर मंडराएगा, तो शहरों की एक और सूची बाहर हो जाएगी।
लिस्टिंग
वैसे, सूचियों के बारे में। उनमें से दो हैं - वर्णानुक्रम में या अन्य क्रम में और प्रतिस्थापन के साथ। उनकी पसंद इस बात पर निर्भर करती है कि क्या सूचीबद्ध किया जाएगा।
फिक्स उपयोगी है यदि उपयोगकर्ता जानता है कि वे क्या ढूंढ रहे हैं। उदाहरण के लिए, शहर, संख्या या तारीख। दूसरा विकल्प लंबे जटिल नामों के लिए या उन मामलों के लिए उपयुक्त है जहां एक और एक ही के कई रूप हैंएक ही नाम, और प्रत्येक ड्रॉप-डाउन सूची उपयोगकर्ता को लक्ष्य के एक कदम और करीब लाती है। ऑटो-प्रतिस्थापन विकल्प का अधिक बार उपयोग किया जाता है जब किसी आगंतुक को सहायता की आवश्यकता होती है। उदाहरण के लिए, एक बुनाई साइट बुनाई सुइयों को खरीदने की पेशकश करती है। उपयोगकर्ता खोज क्वेरी "धातु बुनाई सुई" में प्रवेश करता है, और टूलटिप में वह "बुनाई सुई 5 मिमी", "बुनाई सुई 4.5 मिमी", आदि देखता है।
ऑटोफिल
यह आइटम उन साइटों के लिए विशेष रूप से प्रासंगिक है जो ऑनलाइन कुछ बेचते हैं, और आपको भुगतान, वितरण आदि के लिए मानक फॉर्म भरने होंगे। यदि कोई व्यक्ति फोन से खरीदारी करता है, तो सबसे अधिक संभावना है कि उसके पास समय नहीं है कंप्यूटर तक पहुंचने के लिए, जिसका अर्थ है कि खरीद प्रक्रिया को यथासंभव त्वरित और सुविधाजनक बनाया जाना चाहिए।
इसके लिए फॉर्म में पहले से भरा हुआ डेटा हो सकता है, आप सबसे लोकप्रिय उत्तरों का सहारा ले सकते हैं। उदाहरण के लिए, यदि आप उसी क्षेत्र में काम करते हैं तो आज की तारीख, नकद भुगतान विधि, शहर डालें। उन्हें बदला जा सकता है, लेकिन यदि आप लक्ष्य को मारते हैं, तो उपयोगकर्ता का समय बच जाएगा।
सब कुछ पढ़ा जाता है, सब कुछ देखा जाता है
साइट के मोबाइल संस्करण को डिजाइन करते समय, याद रखें कि हर किसी के फोन अलग होते हैं, और उनकी दृष्टि भी अलग होती है। शायद आपकी साइट एक छोटी स्क्रीन से देखी जाएगी, इसलिए फोंट सरल और पठनीय होने चाहिए, बटन काफी बड़े होने चाहिए ताकि उन्हें दूसरे पृष्ठ पर ले जाए बिना क्लिक किया जा सके, और छवियां अलग से खुलनी चाहिए, बड़ी, खासकर जब यह इंटरनेट पर आता है। स्टोर।
कुछ आंकड़े
मोबाइल उपकरणों के लिए साइट के अनुकूलन के बारे में बोलते हुए, कोई मदद नहीं कर सकता है, लेकिन यह समझने के लिए कि यह प्रक्रिया कितनी महत्वपूर्ण है, यह समझने के लिए आंकड़ों का सहारा लेना चाहिए।ऑनलाइन प्रचार।
नंबर इस प्रकार हैं। आज, गैजेट का उपयोग 87% आबादी द्वारा किया जाता है, जाहिरा तौर पर, छोटे बच्चों और कुछ बुजुर्गों को छोड़कर। अर्थशास्त्रियों का अनुमान है कि अगले 5 वर्षों में मोबाइल कॉमर्स 100 गुना बढ़ जाएगा। साथ ही, केवल 21% साइटें मोबाइल उपकरणों के साथ काम करने के लिए अनुकूलित हैं। इसका मतलब है कि इंटरनेट ट्रैफ़िक और ई-कॉमर्स बाज़ार के केवल 5वें हिस्से पर ही कब्जा है।
इन नंबरों के बारे में सोचें। क्या आपके संसाधन को अनुकूलित करना समझ में आता है? हाँ बिल्कु्ल। इसके अलावा, जबकि इस बाजार में इतनी जगह है, आप इसमें अपना खुद का सेगमेंट बना सकते हैं।
जहां आपको मोबाइल संस्करण की आवश्यकता है
किसी भी मंच के लिए मोबाइल संस्करण का उपयोग करना समझ में आता है जिसका उद्देश्य उच्च रैंकिंग प्राप्त करना है। आखिरकार, यह उपयोगकर्ता पर सीधा प्रभाव डालता है, जिससे उसे आपकी साइट पर बने रहने के लिए आरामदायक स्थिति मिलती है।
मोबाइल संस्करण के बिना मौजूद नहीं हो सकता:
- समाचार पोर्टल, क्योंकि उनमें से अधिकांश को फोन से काम या स्कूल के रास्ते पर देखा जाता है;
- सामाजिक नेटवर्क - इसी कारण से, साथ ही एक ऑनलाइन संचार कारक है, जिसका अर्थ है कि इसके लिए एक सुविधाजनक, समझने योग्य चैट बनाई जानी चाहिए;
- संदर्भ, नौवहन स्थल, आदि, जहां लोग किसी चीज़ की तलाश में जाते हैं;
- ऑनलाइन स्टोर - उन ग्राहकों को आकर्षित करने का अवसर जो खरीदारी में समय बर्बाद नहीं करते, बल्कि मोबाइल इंटरनेट के माध्यम से सब कुछ खरीदते हैं।
निष्कर्ष के बजाय
आज, मोबाइल प्रौद्योगिकियां हैंसक्रिय विकास और विकास, इसलिए, बाजार में नेतृत्व के लिए प्रयास करते हुए, किसी भी कंपनी को यह सुनिश्चित करना चाहिए कि उसका इंटरनेट संसाधन आवश्यकताओं को पूरा करता है। उपयोगकर्ता की बढ़ती मांगों के कारण, साइटों को लगातार अपग्रेड करना पड़ता है और विभिन्न उपकरणों के अनुकूल होना पड़ता है। यह स्पष्ट है कि यदि किसी व्यक्ति को किसी विशेष संसाधन पर रहने में असुविधा होती है, वह किसी उत्पाद या कीमत के बारे में जानकारी प्राप्त नहीं कर सकता है, ऑर्डर नहीं कर सकता है, डिलीवरी के बारे में पता लगा सकता है, तो उसे वह साइट मिल जाएगी जहां यह सब संभव हो सकेगा। इसलिए, प्रतियोगिता जीतने के लिए, एक लचीला, सुविधाजनक, कार्यात्मक और दिलचस्प संसाधन होना जरूरी है।
एंड्रॉइड या आईओएस वेबसाइट का मोबाइल संस्करण ऐसा करने में मदद करेगा। ऐसा करने के लिए, आपको उपरोक्त रीडिज़ाइन विधियों में से एक को चुनना होगा - एक अनुकूली टेम्पलेट, एक सबडोमेन पर एक नई साइट बनाना और उस पर रीडायरेक्ट करना, मुफ्त टेम्प्लेट का उपयोग करना, या एक मोबाइल एप्लिकेशन बनाना जो उपयोगकर्ता के लिए प्रवेश करना आसान बना देगा और पेज पर रहें।
यह दृष्टिकोण न केवल मौजूदा ग्राहकों की वफादारी बनाए रखने में मदद करेगा, बल्कि नए आगंतुकों को आकर्षित करने का अवसर भी प्रदान करेगा।
