तकनीकी SEO

मोबाइल-अनुकूलता और टैप-टारगेट ऑडिटर

Google ने 2023 में अपना Mobile-Friendly Test बंद कर दिया था। अपने पेज का HTML पेस्ट करें (और अगर CSS इनलाइन नहीं है तो वह भी) — यह सात असली जाँचें चलाता है: व्यूपोर्ट मेटा, फिक्स्ड डेस्कटॉप-चौड़ाई लेआउट, पढ़ने-योग्य फ़ॉन्ट साइज़, अनुमानित टैप-टारगेट साइज़, पुराने प्लगइन टैग, और WCAG कलर कंट्रास्ट।

जिन जाँचों के लिए CSS चाहिए (लेआउट चौड़ाई, फ़ॉन्ट साइज़, टैप टारगेट, कंट्रास्ट), अगर HTML या इस बॉक्स में कोई CSS नहीं मिलता तो उन्हें छोड़ दिया जाएगा या "पर्याप्त डेटा नहीं" के रूप में चिह्नित किया जाएगा।

यह एक स्टैटिक नियम-आधारित ऑडिट है — यह किसी असली फ़ोन की तरह पेज को रेंडर नहीं करता, इसलिए टैप-टारगेट और लेआउट के नतीजे आपके CSS पर आधारित करीबी अनुमान हैं, पिक्सेल-सटीक माप नहीं।

यह टूल क्या जाँचता है

असली मोबाइल विज़िटर्स और Google के mobile-first इंडेक्स दोनों के लिए मायने रखने वाली सात जाँचें: सही, ज़ूम न रोकने वाला व्यूपोर्ट टैग; कोई हार्ड-कोडेड डेस्कटॉप-चौड़ाई लेआउट न होना; कोई बहुत छोटा, न पढ़ा जा सकने वाला टेक्स्ट न होना; लिंक और बटन पर आरामदायक टैप-टारगेट साइज़; कोई मृत Flash/Java/marquee मार्कअप न होना; और WCAG-अनुरूप टेक्स्ट कंट्रास्ट। पूरा पेज HTML (View Source काम करेगा) पेस्ट करें, और अगर CSS किसी बाहरी स्टाइलशीट में है तो वह भी।

हर जाँच कैसे काम करती है

यहाँ कुछ भी अंदाज़े से नहीं है — हर निष्कर्ष आपके द्वारा पेस्ट किए गए HTML (DOM) और CSS (एक असली रूल पार्सर, जो @media ब्लॉक्स को खोलता है) को पार्स करने से आता है, फिर Google और WCAG द्वारा प्रकाशित उन्हीं सीमाओं को लागू किया जाता है।

व्यूपोर्ट मेटा टैग

जाँचता है कि टैग मौजूद है, width=device-width और initial-scale=1 का उपयोग करता है, और पिंच-टू-ज़ूम को नहीं रोकता (user-scalable=no या maximum-scale 2 से कम, जो WCAG 1.4.4 की विफलता है)।

फिक्स्ड डेस्कटॉप-चौड़ाई लेआउट

आपके CSS में स्ट्रक्चरल सेलेक्टर्स (body, .wrapper, .container, #page, ...) में 601px या उससे अधिक की हार्ड-कोडेड width या min-width के लिए स्कैन करता है — यह क्लासिक संकेत है कि लेआउट को कभी रिस्पॉन्सिव नहीं बनाया गया।

पढ़ने-योग्य फ़ॉन्ट साइज़

12px से कम की किसी भी font-size घोषणा को फ़्लैग करता है, जो बिना पिंच-ज़ूम किए फ़ोन स्क्रीन पर आराम से पढ़ने के लिए सामान्यतः उपयोग की जाने वाली न्यूनतम सीमा है।

टैप-टारगेट साइज़

font-size, line-height और padding (या स्पष्ट width/height) से लिंक, बटन और role="button" एलिमेंट्स की रेंडर की गई ऊँचाई का अनुमान लगाता है, और इसकी तुलना Google Lighthouse तथा WCAG 2.5.5 के ~44-48px मानदंड से करता है।

पुराना प्लगइन कंटेंट

<applet>, <marquee>, <blink>, और Flash (.swf) की ओर इशारा करने वाले किसी भी <embed>/<object> को फ़्लैग करता है — इनमें से कोई भी किसी मौजूदा मोबाइल ब्राउज़र में काम नहीं करता।

कलर कंट्रास्ट (WCAG)

किसी भी CSS नियम के लिए जो टेक्स्ट रंग और बैकग्राउंड रंग दोनों एक साथ सेट करता है, वास्तविक WCAG सापेक्ष-चमक कंट्रास्ट अनुपात की गणना करता है और इसे 4.5:1 (बड़े/बोल्ड टेक्स्ट के लिए 3:1) के AA न्यूनतम मानदंड से जाँचता है।

रिस्पॉन्सिव ब्रेकपॉइंट्स

आपके CSS में @media नियमों की संख्या को इस संकेत के रूप में गिनता है कि लेआउट छोटी स्क्रीन के अनुसार ढलता है — यह केवल जानकारी के लिए है, क्योंकि एक फ़्लूइड लेआउट बिना किसी मीडिया क्वेरी के भी रिस्पॉन्सिव हो सकता है।

अक्सर पूछे जाने वाले प्रश्न

Google ने Mobile-Friendly Test क्यों बंद किया?

Google ने दिसंबर 2023 में अपना स्टैंडअलोन Mobile-Friendly Test टूल बंद कर दिया, और मोबाइल-अनुकूलता की जाँच को Search Console की व्यापक रिपोर्ट्स में समाहित कर दिया, बिना किसी तेज़ सिंगल-पेज चेकर के। यह टूल लॉगिन के बिना, किसी भी पेस्ट किए गए HTML पर तेज़, नियम-आधारित ऑडिट चलाकर उस कमी को पूरा करता है।

मुझे CSS अलग से पेस्ट करने की ज़रूरत क्यों है?

अधिकांश असली पेज अपना CSS एक बाहरी स्टाइलशीट (<link rel="stylesheet">) से लोड करते हैं, जिसे यह टूल केवल पेस्ट किए गए HTML से आपकी ओर से नहीं ला सकता। उस स्टाइलशीट की सामग्री को CSS बॉक्स में पेस्ट करें, और लेआउट, फ़ॉन्ट साइज़, टैप-टारगेट, और कंट्रास्ट की सभी जाँचें उसके आधार पर चलेंगी।

एक अच्छा टैप-टारगेट साइज़ क्या माना जाता है?

Google Lighthouse और WCAG 2.5.5 (Target Size) के अनुसार लगभग 44-48 CSS पिक्सेल ऊँचाई और चौड़ाई। इससे कम होने पर, असली स्क्रीन पर असली अंगूठा आस-पास के लिंक को गलती से छूने की घटनाओं में काफ़ी बढ़ोतरी करता है।

क्या टैप-टारगेट का अनुमान सटीक है?

नहीं — यह आपके घोषित font-size, line-height, और padding (या स्पष्ट width/height) से एक ठोस अनुमान है, न कि किसी लाइव ब्राउज़र रेंडर का। 44-48px की सीमा के करीब के नतीजों को "असली डिवाइस पर सत्यापित करें" मानें, और इससे काफ़ी कम नतीजों को स्पष्ट विफलता मानें।

क्या यह टूल मेरा HTML या CSS कहीं भेजता है?

आपका पेस्ट किया गया HTML/CSS एक बार, HTTPS के ज़रिए, पार्सर चलाने के लिए हमारे सर्वर पर भेजा जाता है (यह ज़रूरी है ताकि सबके लिए एक जैसा रूल इंजन चले), और अनुरोध के बाद इसे संग्रहीत नहीं किया जाता।