सामान्य गलतियां

इस पेज में कुछ सबसे सामान्य गलतियों के बारे में बताया गया है, जो वेबमास्टर मोबाइल के लिए डिज़ाइन करते समय करते हैं.

ब्लॉक की गई JavaScript, सीएसएस और इमेज फ़ाइलें

सबसे अच्छी रेंडरिंग और इंडेक्सिंग के लिए, Googlebot को हमेशा आपकी वेबसाइट की ओर से इस्तेमाल की जाने वाली JavaScript, सीएसएस और इमेज फ़ाइलें एक्सेस करने दें, ताकि Googlebot आपकी साइट को औसत उपयोगकर्ता की तरह देख सके. अगर आपकी साइट की robots.txt फ़ाइल इन एसेट को क्रॉल करने की अनुमति नहीं देती है, तो इससे सीधे नुकसान पहुंचता है कि आपकी सामग्री को हमारे एल्गोरिद्म कितनी अच्छी तरह से रेंडर और इंडेक्स करते हैं. इसकी वजह से आपकी साइट की रैंकिंग में गिरावट आ सकती है.

  1. पक्का कर लें कि Googlebot, Search Console में यूआरएल की जांच करने वाला टूल इस्तेमाल करके आपकी JavaScript, सीएसएस, और इमेज फ़ाइलें क्रॉल कर सकता है. यह टूल आपको बताता है कि Googlebot आपकी सामग्री को कैसे देखता और रेंडर करता है. साथ ही, इससे आपको साइट को इंडेक्स किए जाने में आ रही समस्याओं को पहचानने और उन्हें ठीक करने में मदद मिलेगी.

  2. Search Console में अपनी robots.txt को जाँचें और टेस्ट करें.

  3. मोबाइल-अनुकूलन परीक्षण की मदद से अपने मोबाइल पेज की जाँच करके पता लगाएं कि क्या हमारे सिस्टम आपकी वेबसाइट को मोबाइल उपयोगकर्ताओं के सही पाते हैं या नहीं.

  4. अगर आप मोबाइल पेजों के लिए अलग यूआरएल देते हैं, तो साइट के मोबाइल और डेस्कटॉप यूआरएल की जाँच कर लें. इससे आप यह जान पाएंगे कि दूसरे लिंक पर भेजने वाले लिंक की पहचान की जा सकती है और इसके पेज को क्रॉल किया जा सकता है.

ऐसी सामग्री जो चलाई नहीं जा सकती

कुछ तरह के वीडियो या सामग्री मोबाइल डिवाइस पर चलाने लायक नहीं होती है, जैसे लाइसेंस वाला मीडिया या ऐसी सुविधाएं जिनके लिए Flash या ऐसे दूसरे प्लेयर की ज़रूरत होती है, जो आम तौर पर मोबाइल डिवाइस पर काम नहीं करते हैं. जब किसी वेबसाइट के पेज पर ऐसी सामग्री दिखाई देती है जो चल नहीं सकती, तो उसे देख कर उपयोगकर्ता बहुत परेशान होते हैं.

जब उपयोगकर्ता किसी ऐसे पेज पर जाते हैं जिसकी सामग्री मोबाइल डिवाइस पर काम नहीं करती है, तो उन्हें नीचे दिखाए गए गड़बड़ी संदेश जैसा संदेश दिखाई देता है:

वीडियो चलाने लायक नहीं है

इससे उपयोगकर्ताओं को मोबाइल पर खराब अनुभव मिलता है!

मालिकाना हक वाले वीडियो प्लेयर का इस्तेमाल करने या मोबाइल पर काम न करने वाले फ़ॉर्मैट में सामग्री डालने के बजाय, हम वीडियो या ऐनिमेशन को शामिल करने के लिए HTML5 मानक टैग का इस्तेमाल करने की सलाह देते हैं.

ऐनिमेशन वाली सामग्री दिखाने के लिए, सभी वेब ब्राउज़र पर काम करने वाले HTML5 ऐनिमेशन का इस्तेमाल करें. Google Web Designer, HTML5 में इन ऐनिमेशन को बनाना आसान करता है.

  • अपने सभी उपयोगकर्ताओं को अच्छा अनुभव देने के लिए ऐनिमेशन के HTML5 मानकों का इस्तेमाल करें.
  • वीडियो एम्बेड करने की ऐसी सुविधा का इस्तेमाल करें जो सभी डिवाइस पर चलाने लायक हो.
  • वीडियो का ट्रांसक्रिप्ट उपलब्ध कराएं. इससे वे लोग आपकी साइट का इस्तेमाल कर पाएंगे जो सहायक ब्राउज़िंग तकनीकों का इस्तेमाल करते हैं या जिनके पास ऐसे ब्राउज़र हैं जो मालिकाना हक वाले वीडियो फ़ॉर्मैट नहीं चला सकते हैं.

ज़्यादा जानकारी के लिए, Google की वेब की बुनियादी बातें साइट पर वीडियो के इस्तेमाल के सबसे अच्छे तरीकों के बारे में पढ़ें.

गलत रीडायरेक्ट

अगर आपके पास अलग-अलग मोबाइल यूआरएल हैं, तो हमारा सुझाव है कि आप हर एक डेस्कटॉप यूआरएल पर मौजूद मोबाइल उपयोगकर्ता को सही मोबाइल यूआरएल पर रीडायरेक्ट करें. दूसरे पेज पर (जैसे कि हमेशा होम पेज पर) रीडायरेक्ट करना गलत होगा.

उदाहरण:

  • आपकी डेस्कटॉप साइट के सर्वर को मोबाइल साइट के होम पेज पर रीडायरेक्ट करने के लिए कॉन्फ़िगर किया गया है. इस बात का कोई फ़र्क नहीं पड़ता कि असल में किस यूआरएल का अनुरोध किया गया है. भले ही, मोबाइल साइट में डेस्कटॉप पेज को रीडायरेक्ट करने के लिए उसके जैसा ही पेज हो.
  • डेस्कटॉप साइट के आपके यूआरएल, ऐसे यूआरएल पैरामीटर के साथ डायनैमिक रूप से जनरेट होते हैं जो उस जैसे मोबाइल यूआरएल के साथ अच्छी तरह मैप नहीं करते हैं. उदाहरण के लिए, अगर डेस्कटॉप साइट पर किसी खास तारीख की रेल समय-सारिणी (टाइम-टेबल) खोज रहे उपयोगकर्ता को मोबाइल साइट पर सामान्य समय-सारिणी की खोज वाले पेज पर रीडायरेक्ट कर दिया जाएगा, तो वह बहुत परेशान हो जाएगा. हमारा सुझाव है कि अगर आपके पास एक समान मोबाइल यूआरएल है, तो आप रीडायरेक्शन को सही तरीके से कॉन्फ़िगर करें, ताकि उपयोगकर्ता उसी पेज पर पहुंचें जिसकी वे तलाश कर रहे हैं.

  • आपकी डेस्कटॉप साइट कुछ मोबाइल डिवाइस को रीडायरेक्ट करती है, लेकिन बाकी डिवाइस को नहीं. उदाहरण के लिए, हो सकता है कि कोई साइट सिर्फ़ Android उपयोगकर्ताओं को मोबाइल साइट पर रीडायरेक्ट करे और iPhone या Windows Phone उपयोगकर्ताओं को रीडायरेक्ट न करे.

  • Search Console का इस्तेमाल करें. अगर हमें पता चलता है कि आपकी साइट का कोई भी पेज स्मार्टफ़ोन उपयोगकर्ताओं को होम पेज पर रीडायरेक्ट कर रहा है, तो हम आपको एक मैसेज भेजेंगे. इस मैसेज को पाने के लिए उपयोगकर्ता के रूप में आपकी पुष्टि ज़रूरी है.

  • अपने सर्वर को इस तरह से सेटअप करें, जिससे स्मार्टफ़ोन इस्तेमाल करने वालों को आपकी स्मार्टफ़ोन साइट से मिलते-जुलते यूआरएल (ऐसे यूआरएल, जो एक जैसी सामग्री दिखाते हैं) पर रीडायरेक्ट किया जा सके.

  • अगर आपकी साइट के किसी पेज के लिए उसका स्मार्टफ़ोन वर्शन मौजूद नहीं है, तो उपयोगकर्ताओं को स्मार्टफ़ोन साइट पर रीडायरेक्ट करने के बजाय उन्हें डेस्कटॉप पेज पर रखें. ऐसे मामले में कुछ भी गलत करने से बेहतर होगा कुछ भी न करना.

  • रिस्पॉन्सिव (बदलने वाले) वेब डिज़ाइन का इस्तेमाल करके देखें, जो डेस्कटॉप और स्मार्टफ़ोन के उपयोगकर्ताओं एक जैसी सामग्री देता है.

सिर्फ़-मोबाइल के लिए 404

कुछ साइटें, यूआरएल एक्सेस करने वाले डेस्कटॉप उपयोगकर्ताओं को सामग्री दिखाती हैं, लेकिन मोबाइल उपयोगकर्ताओं के लिए गड़बड़ी वाला पेज दिखाती हैं.

सिर्फ़-मोबाइल के लिए 404

अगर आप देखते हैं कि कोई उपयोगकर्ता मोबाइल डिवाइस से डेस्कटॉप पेज पर जा रहे हैं और आपके पास अलग यूआरएल पर समान मोबाइल पेज है, तो उन्हें 404 या सॉफ़्ट 404 पेज दिखाने के बजाय उस यूआरएल पर रीडायरेक्ट करें. इससे उनको बेहतरीन उपयोगकर्ता अनुभव मिलेगा. इसके साथ ही, यह भी पक्का करें कि मोबाइल फ़्रेंडली पेज खुद ही कोई गड़बड़ी वाला पेज न हो.

अच्छे रीडायरेक्ट
  • Search Console का इस्तेमाल करें. अगर आप साइट के लिए पुष्टि किए गए उपयोगकर्ता हैं, तो हम आपको 'मैसेज केंद्र' में एक सूचना भेजेंगे.

  • अगर आपके पास किसी अलग यूआरएल पर स्मार्टफ़ोन साइट है, तो अपना सर्वर सेट अप करें, ताकि वह स्मार्टफ़ोन उपयोगकर्ताओं को आपकी स्मार्टफ़ोन साइट पर समान यूआरएल पर रीडायरेक्ट करे.

  • अगर आप डायनैमिक सेवा का इस्तेमाल करते हैं, तो पुष्टि करें कि उपयोगकर्ता-एजेंट की पहचान सही ढंग से कॉन्फ़िगर की गई है.

  • अगर आपकी साइट पर ऐसा कोई पेज नहीं है जो स्मार्टफ़ोन पर भी काम करता है, तो उपयोगकर्ताओं को डेस्कटॉप पेज पर रखें. उपयोगकर्ता को गड़बड़ी पेज दिखाने के बजाय वह सामग्री दिखाना बेहतर है, जिसे वह खोज रहे हैं.

  • जब हो सके, रिस्पॉन्सिव (बदलने वाले) वेब डिज़ाइन का इस्तेमाल करें. इस कॉन्फ़िगरेशन की मदद से आप उपयोगकर्ताओं को एक जैसी सामग्री दिखा सकते हैं, चाहे वे किसी भी डिवाइस का इस्तेमाल कर रहे हों.

पेज पर अचानक दिखने वाले विज्ञापनों से बचें

कई वेबसाइट पेज पर अचानक दिखने वाले विज्ञापन या ऐसे ओवरले दिखाती हैं जो उपयोगकर्ता के देखे जा रहे पेज की सामग्री को कुछ हद तक या पूरी तरह छिपा देते हैं. पेज पर अचानक दिखने वाले ये विज्ञापन, आम तौर पर मोबाइल डिवाइस पर वेबसाइट के बुनियादी ऐप्लिकेशन, मेल की सूची के लिए साइन-अप करवाने वाले फ़ॉर्म या विज्ञापनों का प्रचार करते हुए नज़र आते हैं, जिनसे उपयोगकर्ता का अनुभव खराब हो सकता है. कुछ मामलों में तो पेज पर अचानक दिखने वाले विज्ञापन को इस तरह डिज़ाइन किया जाता है कि उपयोगकर्ता के लिए उसे खारिज करना और पेज की असली सामग्री देख पाना मुश्किल हो जाता है. मोबाइल डिवाइस पर स्क्रीन की जगह सीमित होती है जिसकी वजह से पेज पर अचानक दिखने वाला कोई भी विज्ञापन उपयोगकर्ता के अनुभव पर गलत ढंग से असर डालता है.

ऐप्लिकेशन डाउनलोड के लिए पेज पर अचानक दिखने वाले विज्ञापन

कई वेबमास्टर अपनी मोबाइल वेबसाइट पर आने वाले दर्शकों के सामने अपने कारोबार के बनाए ऐप्लिकेशन का प्रचार करते हैं. अगर इसमें सावधानी न बरती जाए, तो इसकी वजह से इंडेक्सिंग की समस्याएं खड़ी हो सकती हैं और वेबसाइट पर आने वाले लोगों को साइट का इस्तेमाल करने में परेशानी हो सकती है.

पेज पर अचानक दिखने वाले विज्ञापनों से बचें
पेज पर अचानक दिखने वाला यह विज्ञापन उपयोगकर्ता को काम पूरे करने से रोक रहा है.
ऐप्लिकेशन बैनर
एक बैनर जिसके ज़रिए उपयोगकर्ता, ऐप्लिकेशन को देखने के साथ-साथ अपना काम पूरा कर सकते हैं.
  • अपने ऐप्लिकेशन का प्रचार पेज की सामग्री के मुताबिक करने के लिए एक बैनर का इस्तेमाल करें. इस बैनर का इस्तेमाल नीचे बताए गए तरीकों से किया जा सकता है:
    • ब्राउज़र के साथ काम करने वाला बैनर जैसे कि Safari के लिए स्मार्ट ऐप्लिकेशन बैनर या Chrome के लिए खास ऐप्लिकेशन बैनर.
    • किसी सामान्य छोटे विज्ञापन से मिलता-जुलता एक एचटीएमएल बैनर या इमेज जिसे डाउनलोड के लिए सही ऐप्लिकेशन स्टोर से लिंक किया जाता है.

जब कोई वेबसाइट उपयोगकर्ताओं को अलग-अलग मोबाइल यूआरएल पर दिखाई जाती है तो एक आम चलन है कि डेस्कटॉप के लिए ऑप्टिमाइज़ किए गए वर्शन के लिंक दिए जाएं और इसी तरह डेस्कटॉप पेज का लिंक मोबाइल पेज पर दिया जाए. इसमें आम गड़बड़ी यह होती है कि लिंक ऐसे पेज पर ले जाते हैं जो प्रासंगिक नहीं हैं जैसे कि डेस्कटॉप साइट के होम पेज से मोबाइल पेज को लिंक करना.

  • अपने लिंक की जाँच करके यह पक्का करें कि वे सही अलग वर्शन के सही पेज पर ले जा रहे हैं.

धीमे मोबाइल पेज

यह ज़रूर देख लें कि आपकी मोबाइल साइट तेज़ी से लोड होती हो. अगर उपयोगकर्ताओं को आपकी सामग्री देखने के लिए लंबे समय तक इंतजार करना पड़ता है, तो वे बहुत ज़्यादा निराश हो सकते हैं.

Google PageSpeed Insights का इस्तेमाल करके यह पता लगाएं क्या आपके पेज पर ऐसी कोई समस्या है जिससे आपके पेज धीमे हो सकते हैं. इसके लिए “साइट लोड होने की रफ़्तार” सब-सेक्शन ध्यान से देखें. उन समस्याओं पर ध्यान देने की कोशिश करें जिनके साथ “ठीक किया जाना चाहिए” लिखा है.

ज़्यादा जानकारी के लिए, देखें:

अपने व्यूपोर्ट को सही ढंग से सेट करें

अगर आपकी साइट पर आने वाले लोग अलग-अलग स्क्रीन आकारों वाले कई तरह के डिवाइस का इस्तेमाल करते हैं, तो आपके पेज को व्यूपोर्ट मेटा टैग का इस्तेमाल करके एक व्यूपोर्ट तय करना चाहिए. इस टैग से ब्राउज़र को बताया जाता है कि पेज के आयाम और माप को डिवाइस पर काम करने लायक कैसे बनाया जाए. ये रही दो सामान्य समस्याएं:

  • तय चौड़ाई वाले व्यूपोर्ट का इस्तेमाल करना. इससे पेज सभी डिवाइस आकारों के लिए अच्छी तरह से फ़िट नहीं बैठता (और ऐसे बहुत से डिवाइस आकार हैं). इस बारे में ज़्यादा पढ़ें.
  • किसी अवास्तविक रूप से चौड़े कम से कम व्यूपोर्ट को मानना, जो छोटे डिवाइस का इस्तेमाल करने वाले उपयोगकर्ताओं को सामग्री पढ़ने के लिए क्षैतिज रूप से स्क्रोल करने के लिए मजबूर कर सकता है. ऐसा तब होता है जब पेज सीएसएस घोषणाओं में पूरे मानों का इस्तेमाल करते हैं, या एक खास चौड़ाई वाले ब्राउज़र (जैसे कि 980 पिक्सेल) में सबसे अच्छी तरह देखे जाने वाले इमेज का इस्तेमाल करते हैं. इस गड़बड़ी को ठीक करने के लिए, यह पक्का कर लें कि पेज सीएसएस में मौजूद चीज़ों के लिए मिलती-जुलती चौड़ाई और जगह के मानों का इस्तेमाल करते हैं, और यह भी देखें कि इमेज को मापा जा सकता है. ज़्यादा जानें.

छोटा फ़ॉन्ट आकार

किसी मोबाइल डिवाइस पर फ़ॉन्ट आकार को बहुत छोटा करने से बचें, क्योंकि इससे वेबसाइट पर आने वालों को पढ़ने के लिए “पिंच करके ज़ूम” करना होगा. अपने वेब पेजों के लिए एक व्यूपोर्ट बताने के बाद, अपने फ़ॉन्ट आकारों को व्यूपोर्ट के अंदर सही तरीके से मापने के लिए सेट करें. सही आकार के फ़ॉन्ट इस्तेमाल करने के सबसे अच्छे तरीकों के बारे में ज़्यादा जानने के लिए हमारा लेख पढ़ने लायक आकारों में फ़ॉन्ट इस्तेमाल करें देखें.

छूकर इस्तेमाल किए जाने वाले एलिमेंट बहुत करीब हैं

बटन और लिंक जैसे छूकर इस्तेमाल किए जाने वाले एलिमेंट को एक-दूसरे के बहुत करीब इस तरह सेट करने से बचें कि मोबाइल उपयोगकर्ता किसी बगल वाली चीज़ पर टैप किए बिना अपनी पसंद की चीज़ पर आसानी से टैप न कर पाए. इन गड़बड़ियों को ठीक करने के लिए आपके बटनों और नेविगेशन लिंक का आकार और जगह ऐसी रखें जो आपके मोबाइल दर्शकों के लिए सही हों. टैप की जाने वाली जगहों को सही आकार दें में ज़्यादा पढ़ें.