मोबाइल उपकरणों में पहले से ही एक बहुत बड़ा हिस्सा शामिल होता है, अगर अधिकांश वेबसाइटों के लिए ऑनलाइन रीडरशिप का बहुमत नहीं है, तो यह सुनिश्चित करें कि आपकी साइट एक iPhone या टैबलेट पर ठीक से दिखाई देगी और कार्य करेगी। कई सेवाएँ हैं जो किसी दिए गए URL के लिए मोबाइल लेआउट पूर्वावलोकन प्रदान करती हैं, लेकिन Apple ने OS X El Capitan में Safari 9 के साथ मोबाइल तत्परता के लिए परीक्षण वेबसाइटों को बहुत आसान बना दिया। रिस्पॉन्सिव डिज़ाइन मोड नामक एक नई सुविधा जल्दी से पूर्वावलोकन कर सकती है कि वेबसाइट विभिन्न एप्पल डिवाइसों के साथ-साथ आम मोबाइल स्क्रीन रिज़ॉल्यूशन पर कैसी दिखती है। यहां देखिए यह कैसे काम करता है।
यह दोहराना महत्वपूर्ण है कि उत्तरदायी डिज़ाइन मोड एक नई विशेषता है जो OS X El Capitan में Safari 9 के लिए अनन्य है, इसलिए आपको इसे एक्सेस करने के लिए कम से कम ब्राउज़र और ऑपरेटिंग सिस्टम के इन संस्करणों को चलाने की आवश्यकता होगी। यदि आपका मैक इस आवश्यकता को पूरा करता है, तो आपको पहले Safari के डेवलपर मोड को सक्षम करना होगा। ऐसा करने के लिए, सफारी लॉन्च करें और मेनू बार में सफारी पर क्लिक करें। फिर प्राथमिकताएँ> उन्नत चुनें ।
सफ़ारी की प्राथमिकताएँ विंडो के उन्नत टैब में, "मेनू बार में मेनू का विकास दिखाएं" लेबल वाला बॉक्स देखें। जैसा कि विकल्प का नाम है, आपको सफारी मेनू बार में दाईं ओर एक नया "विकसित" मेनू दिखाई देगा। "बुकमार्क।"
इसके बाद, Safari Preferences विंडो को बंद करें और उस वेबसाइट पर नेविगेट करें जिसे आप रिस्पॉन्सिव डिज़ाइन मोड में परीक्षण करना चाहते हैं। एक बार जब वेबसाइट आपके ब्राउज़र में पूरी तरह से लोड हो जाती है, तो कीबोर्ड शॉर्टकट कमांड-ऑप्शन-आर का उपयोग करें और आप ब्राउज़र विंडो को कई मोबाइल डिवाइस रिज़ॉल्यूशन में से एक के पूर्वावलोकन में परिवर्तित होते देखेंगे (आप उत्तरदायी डिज़ाइन मोड भी एक्सेस कर सकते हैं जिसे विकसित करके क्लिक करें । सफारी मेन्यू बार और एंटर रिस्पॉन्सिव डिज़ाइन मोड का चयन करना )।
सफारी उत्तरदायी डिजाइन मोड आपको पूर्वावलोकन करता है कि 3.5 इंच के iPhone 4S से 12.9 इंच के आईपैड प्रो तक एप्पल के मोबाइल डिवाइस के सभी प्रस्तावों पर एक वेबसाइट कैसे दिखती है। उपयोगकर्ताओं के पास 1x, 2x या 3x "रेटिना" रिज़ॉल्यूशन का चयन करने और क्रोम एजेंट, फ़ायरफ़ॉक्स और एज जैसे सबसे लोकप्रिय ब्राउज़रों के व्यवहार की नकल करने के लिए ब्राउज़र एजेंट को बदलने का विकल्प भी है।
प्रत्येक डिवाइस और स्क्रीन आकार के लिए, उपयोगकर्ता पोर्ट आइकन पर क्लिक करके पोर्ट्रेट और लैंडस्केप ओरिएंटेशन के बीच बदलाव कर सकते हैं या, iPad Air और iPad Pro जैसे डिवाइसेस के लिए जो स्प्लिट व्यू को सपोर्ट करते हैं, आप विभिन्न स्प्लिट व्यू लेआउट के बीच रोटेट करने के लिए क्लिक कर सकते हैं।
जबकि सफारी उत्तरदायी डिज़ाइन मोड में समान preexisting टूल के कुछ विकल्पों का अभाव है, इसे सीधे Safari में बनाया जाना वेब डिज़ाइनरों के लिए एक बड़ा समय बचाने वाला हो सकता है, और वेबसाइट के मालिकों के लिए एक महान सीखने और परीक्षण उपकरण है जो यह सुनिश्चित करना चाहते हैं कि उनके मोबाइल आगंतुक स्क्रीन रिज़ॉल्यूशन या आकार की परवाह किए बिना सबसे अच्छा अनुभव प्राप्त कर रहे हैं।
एक बार जब आप परीक्षण कर लेते हैं, तो आप ब्राउज़र विंडो या टैब को बंद करके या शॉर्टकट कमांड-ऑप्शन-आर को फिर से दबाकर उत्तरदायी डिज़ाइन मोड को छोड़ सकते हैं।
