[user-scalable=”no”] Meta Name=”viewport” Element Error को कैसे Fix करें | PageSpeed Insights Error Fixed
![[user-scalable="no"] Meta Name="viewport" Element Error को कैसे Fix करें](https://techdiwane.com/wp-content/uploads/2024/10/become-20a_20241117_213203_0000.png "[user-scalable=\"no\"] Meta Name=\"viewport\" Element Error को कैसे Fix करें 1")
क्या आप अपनी वेबसाइट के PageSpeed Insights रिपोर्ट में “[user-scalable=’no’] meta name=’viewport’ element” वाली एरर का सामना कर रहे हैं? यह समस्या अक्सर Blogger और WordPress वेबसाइट्स में देखने को मिलती है और यह आपकी वेबसाइट की accessibility को प्रभावित कर सकती है। आइए, इस समस्या को समझते हैं और इसे ठीक करने का तरीका सीखते हैं।
यह एरर क्या है?
यह एरर तब आती है जब आपकी वेबसाइट के HTML में viewport meta टैग में user-scalable="no" का उपयोग किया गया हो। इस प्रॉपर्टी के कारण यूजर्स आपकी वेबसाइट को ज़ूम इन या ज़ूम आउट नहीं कर पाते, जिससे खासकर कम विजन वाले यूजर्स को दिक्कत हो सकती है।
उदाहरण: आपकी वेबसाइट में मौजूद viewport meta टैग कुछ ऐसा हो सकता है:
html<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
यह समस्या क्यों है?
-
Accessibility की दिक्कत:
- Web Content Accessibility Guidelines (WCAG) के अनुसार, वेबसाइट्स को कम से कम 200% ज़ूम की अनुमति देनी चाहिए।
- ज़ूम को रोकना उन यूजर्स के लिए मुश्किलें पैदा करता है जो कंटेंट को पढ़ने या नेविगेट करने के लिए स्क्रीन मैग्निफायर पर निर्भर करते हैं।
-
PageSpeed Insights Score पर असर:
- Google ऐसी वेबसाइट्स को पेनलाइज़ करता है जिनमें accessibility संबंधी समस्याएं होती हैं।
इस एरर को कैसे ठीक करें?
स्टेप 1: Meta Viewport टैग को अपडेट करें
अपने मौजूदा meta viewport टैग को निम्नलिखित कोड से बदलें:
html<meta content="width=device-width, initial-scale=1, user-scalable=1, minimum-scale=1, maximum-scale=5" name="viewport">
इस अपडेटेड कोड से:
- यूजर्स को ज़ूम इन और आउट करने की अनुमति मिलती है।
- आपकी वेबसाइट accessibility गाइडलाइन्स का पालन करती है।
स्टेप 2: चेंजेस को सेव करें और टेस्ट करें
-
Blogger के लिए:
- Blogger डैशबोर्ड में थीम सेक्शन में जाएं।
- Edit HTML पर क्लिक करें और
<head>सेक्शन में मौजूद<meta name="viewport">टैग को ढूंढें। - इसे अपडेटेड कोड से बदलें।
- सेव कर लें।
-
WordPress के लिए:
- थीम एडिटर का उपयोग करें या WPCode Code Snippets जैसे प्लगइन की मदद लें।
- अपनी थीम की header.php फाइल में
<meta name="viewport">टैग को ढूंढें। - इसे अपडेटेड कोड से बदलें।
- फाइल को सेव करें।
स्टेप 3: PageSpeed Insights पर री-टेस्ट करें
चेंजेस सेव करने के बाद, PageSpeed Insights पर अपनी वेबसाइट को फिर से टेस्ट करें ताकि यह सुनिश्चित हो सके कि एरर फिक्स हो चुकी है।
बेहतर Accessibility के लिए Best Practices
-
उचित ज़ूम की अनुमति दें:
सुनिश्चित करें कि आपकी वेबसाइट को कम से कम 500% तक ज़ूम किया जा सकता है ताकि यूजर्स इसे आसानी से पढ़ सकें। -
रेस्पॉन्सिवनेस टेस्ट करें:
ज़ूम ऑन करने के बाद यह जांचें कि आपकी वेबसाइट अलग-अलग डिवाइस पर कैसी दिखती और काम करती है।
Accessibility क्यों महत्वपूर्ण है?
Accessibility गाइडलाइन्स का पालन करना सिर्फ नियमों को मानना नहीं है, बल्कि यह सुनिश्चित करना है कि हर कोई आपकी वेबसाइट का उपयोग कर सके।
फैक्ट्स:
- वेबसाइट्स को कम से कम 200% ज़ूम की अनुमति देनी चाहिए।
- ज़ूम रोकने से यूजर्स का अनुभव खराब हो सकता है और कानूनी मुद्दे भी हो सकते हैं।
निष्कर्ष
[user-scalable=”no”] एरर को ठीक करने से न केवल आपकी PageSpeed Insights स्कोर में सुधार होता है बल्कि आपकी वेबसाइट अधिक यूजर-फ्रेंडली और एक्सेसिबल भी बनती है। एक छोटे से कोड अपडेट से आप अपने यूजर्स के अनुभव को बेहतर बना सकते हैं।
