दो मोबाइल व्यू की तुलना
iPhone और Android का प्रीव्यू साथ-साथ खुला रखें और एक ही वेबसाइट को दो स्क्रीन साइज़ पर देखें।
Chrome में मोबाइल व्यू, DevTools के बिना
Mobile View Extension – वेबसाइट को मोबाइल व्यू में देखें
जिस पेज पर आप अभी हैं, उसका मोबाइल वर्शन खोलें। Chrome का यह एक्सटेंशन टैब को फ़ोन की तरह दोबारा लोड करता है, दो डिवाइस साइज़ की तुलना करने देता है, localhost पर काम करता है और स्क्रीनशॉट भी लेता है।
Chrome में जोड़ेंमुफ़्त · अकाउंट की ज़रूरत नहीं
ब्राउज़िंग हिस्ट्री इकट्ठा नहीं की जाती
localhost पर काम करता है
localhost:3000/dashboard
iPhone 17 Pro
Oppo A6xRuns over the page you already have openNo tab switching
रिस्पॉन्सिव टेस्टिंग, आसान तरीके से
रोज़ की जाँच के लिए बना मोबाइल व्यू स्विचर।
विंडो के किनारे खींचने, viewport के साइज़ टाइप करने या अलग-अलग टैब के बीच भागने की ज़रूरत नहीं। कंट्रोल उसी पेज के पास रहते हैं जिसे आप टेस्ट कर रहे हैं।
एक क्लिक में व्यू बदलें
फ़्लोटिंग टूलबार में डिवाइस चुनें और पेज मोबाइल व्यू में दोबारा लोड हो जाता है। डेस्कटॉप पर लौटना भी उतना ही आसान है।
आपकी ब्राउज़िंग सिर्फ़ आपकी
कोई अकाउंट नहीं चाहिए। एक्सटेंशन न निजी डेटा इकट्ठा करता है, न ब्राउज़िंग हिस्ट्री।
लॉन्च से पहले localhost टेस्ट करें
लोकल पेजों पर रिस्पॉन्सिव जाँच करें, फिर उन्हीं डिवाइस प्रीसेट के साथ पब्लिश हुई साइट देखें।
जाने-पहचाने डिवाइस पर प्रीव्यू
viewport के साइज़ टाइप करने के बजाय नाम से फ़ोन या टैबलेट चुनें और मोबाइल वेबसाइट की असली जाँच करें।
जो दिख रहा है, वही सेव करें
जब किसी को दिखाना या रिव्यू करना हो, तो टूलबार से चुने गए मोबाइल व्यू का स्क्रीनशॉट लें।
एक साइट · दो स्क्रीन
रिस्पॉन्सिव वेबसाइट को एक साथ दो स्क्रीन पर टेस्ट करें।
छोटे फ़ोन के बगल में बड़ा डिवाइस रखें और एक ही पेज के दोनों वर्शन देखें। इससे टूटती हेडिंग, भीड़ भरा मेन्यू और गायब कंटेंट जल्दी नज़र आते हैं।
- नाम वाले फ़ोन और टैबलेट प्रीसेट
- एक ही URL के दो लाइव व्यू
- पेज छोड़े बिना डिवाइस बदलें
लॉन्च से पहले और बाद में
localhost और लाइव साइट, दोनों के लिए एक ही रिस्पॉन्सिव टेस्ट।
पेज बनाते समय उसकी जाँच करें, फिर पब्लिश हुआ URL उन्हीं डिवाइस प्रीसेट के साथ खोलें। डेवलपमेंट से रिलीज़ तक आपका टेस्टिंग तरीका एक जैसा रहता है।
localhost के लिए तैयार
अस्थायी बिल्ड पब्लिश किए बिना लोकल पेजों का मोबाइल प्रीव्यू देखें।
तुरंत स्क्रीनशॉट
रिव्यू या टीम के साथ शेयर करने के लिए चुने गए डिवाइस व्यू का स्क्रीनशॉट लें।
यह कैसे काम करता है
Chrome में डेस्कटॉप पेज से मोबाइल व्यू तक
01
Chrome के लिए मोबाइल व्यू एक्सटेंशन इंस्टॉल करें और कोई भी वेबसाइट खोलें
02
फ़ोन आइकन पर क्लिक करें और डिवाइस प्रीसेट चुनें, पेज मोबाइल व्यू में दोबारा लोड हो जाएगा
03
दूसरा मोबाइल प्रीव्यू जोड़ें या मौजूदा व्यू का स्क्रीनशॉट लें
गाइड
Chrome में मोबाइल व्यू टेस्टिंग सीखें
Mobile view in PC: लैपटॉप पर वेबसाइट का मोबाइल वर्शन कैसे देखें
कंप्यूटर पर किसी भी वेबसाइट का मोबाइल वर्शन खोलने के चार तरीके, हर तरीका असल में क्या दिखाता है, और जल्दी जाँच के लिए कौन-सा चुनें।
लेख पढ़ें →Chrome mobile emulator: DevTools device mode में मोबाइल व्यू कैसे देखें
Chrome के बिल्ट-इन मोबाइल एमुलेटर की स्टेप-बाय-स्टेप गाइड: device mode खोलें, डिवाइस चुनें या जोड़ें, नेटवर्क और CPU धीमा करें, touch एमुलेट करें और स्क्रीनशॉट लें।
लेख पढ़ें →Localhost on mobile: फ़ोन से localhost वेबसाइट कैसे खोलें और टेस्ट करें
लोकल डेवलपमेंट साइट को असली फ़ोन या मोबाइल व्यू में खोलें: LAN IP और --host, Chrome port forwarding, टनल, एमुलेटर के पते, और आम समस्याओं के हल।
लेख पढ़ें →iPhone screen size और viewport size: सभी मॉडल का पूरा चार्ट
iPhone SE से iPhone 18 Pro Max तक हर मॉडल: इंच में स्क्रीन साइज़, पिक्सेल में resolution, CSS viewport साइज़ और pixel ratio, वेब डिज़ाइनरों के लिए नोट्स के साथ।
लेख पढ़ें →Website screenshot मोबाइल व्यू में कैसे लें (डेस्कटॉप Chrome से)
डेस्कटॉप Chrome से किसी भी वेब पेज का फ़ोन साइज़ वाला स्क्रीनशॉट लें: सिर्फ़ दिखने वाला हिस्सा या पूरा पेज, डिवाइस फ़्रेम के साथ या उसके बिना।
लेख पढ़ें →Responsive design checker: रिस्पॉन्सिव डिज़ाइन टेस्ट करने का सही तरीका
वेबसाइट की रिस्पॉन्सिवनेस जाँचने का स्टेप-बाय-स्टेप तरीका: चौड़ाई का स्वीप, डिवाइस पर जाँच, कंटेंट का स्ट्रेस टेस्ट, ज़ूम और ऑटोमैटिक स्क्रीनशॉट।
लेख पढ़ें →FAQ
इंस्टॉल करने से पहले
Chrome में किसी वेबसाइट को मोबाइल व्यू में कैसे देखें?
Mobile View Extension इंस्टॉल करें, कोई वेबसाइट खोलें और फ़्लोटिंग टूलबार में फ़ोन बटन पर क्लिक करें। डिवाइस प्रीसेट चुनते ही पेज फ़ोन के साइज़ वाले व्यू में दोबारा लोड हो जाता है, ब्राउज़र विंडो का साइज़ बदलने की ज़रूरत नहीं पड़ती।
मोबाइल व्यू पर स्विच करने पर क्या पेज दोबारा लोड होता है?
हाँ। एक्सटेंशन टैब को मोबाइल user agent और viewport के साथ दोबारा लोड करता है, इसलिए साइट डेस्कटॉप लेआउट को सिकोड़कर नहीं, बल्कि अपना असली मोबाइल वर्शन दिखाती है।
क्या मैं अपनी वेबसाइट को एक साथ दो मोबाइल साइज़ पर टेस्ट कर सकता हूँ?
हाँ। एक्सटेंशन एक ही पेज को दो डिवाइस व्यू में साथ-साथ दिखा सकता है, जिससे रिस्पॉन्सिव डिज़ाइन की तुलना जल्दी हो जाती है।
क्या localhost पर भी रिस्पॉन्सिव डिज़ाइन टेस्ट कर सकते हैं?
हाँ। Mobile View Extension लोकल डेवलपमेंट पेजों पर भी काम करता है, इसलिए आप पब्लिश करने से पहले ही वेबसाइट की मोबाइल फ़्रेंडली जाँच कर सकते हैं।
अपनी अगली वेबसाइट को मोबाइल व्यू में देखें।
मोबाइल व्यू Chrome एक्सटेंशन जोड़ें और जिस टैब पर आप काम कर रहे हैं, उसी के डिवाइस प्रीव्यू खोलें।
Chrome में जोड़ें