تشتمل الأجهزة المحمولة بالفعل على جزء كبير ، إن لم يكن غالبية ، من القراء على الإنترنت للعديد من مواقع الويب ، لذا فإن التأكد من أن موقعك سيبدو ويعمل بشكل صحيح على جهاز iPhone أو جهاز لوحي أمر بالغ الأهمية. هناك العديد من الخدمات التي تقدم معاينات لمخطط الجوال لعنوان URL معين ، ولكن Apple جعل مواقع اختبار الاستعداد للجهاز أسهل بكثير مع Safari 9 في OS X El Capitan. يمكن لميزة جديدة تسمى وضع التصميم المتجاوب أن تستعرض بسرعة ما يبدو عليه موقع الويب على مجموعة متنوعة من أجهزة Apple وكذلك دقة شاشة الهاتف المحمول الشائعة. وإليك كيف يعمل.
من المهم أن نعيد التأكيد على أن وضع التصميم المتجاوب هو ميزة جديدة حصرية لـ Safari 9 في OS X El Capitan ، لذلك ستحتاج إلى تشغيل هذه الإصدارات على الأقل من المتصفح ونظام التشغيل للوصول إليها. إذا كان جهاز Mac يفي بهذا المطلب ، فستحتاج أولاً إلى تمكين وضع مطور Safari. للقيام بذلك ، قم بتشغيل Safari وانقر فوق Safari في شريط القوائم. ثم اختر التفضيلات> متقدم .
في علامة التبويب "خيارات متقدمة" في نافذة "تفضيلات Safari" ، حدد المربع المسمى "إظهار قائمة التطوير في شريط القوائم". كما يوحي اسم الخيار ، سترى قائمة "تطوير" جديدة تظهر في شريط قائمة Safari على يمين "إشارات مرجعية."
بعد ذلك ، أغلق نافذة تفضيلات Safari وانتقل إلى موقع ويب ترغب في اختباره في وضع التصميم المتجاوب. بمجرد أن يتم تحميل موقع الويب بالكامل في متصفحك ، استخدم اختصار لوحة المفاتيح Command-Option-R وسترى نافذة المتصفح تتحول إلى معاينة لواحدة من عدة قرارات للأجهزة المحمولة (يمكنك أيضًا الوصول إلى وضع التصميم المتجاوب بالنقر فوق " تطوير" شريط قوائم Safari وتحديد إدخال وضع التصميم المتجاوب ).
يتيح لك Safari Design Mode وضع معاينة كيف يبدو موقع الويب على جميع قرارات أجهزة Apple المحمولة ، من iPhone 4S 3.5 بوصة إلى iPad Pro بحجم 12.9 بوصة. يمتلك المستخدمون أيضًا خيار تحديد دقة "شبكية" 1x أو 2x أو 3x وتغيير وكيل المتصفح لتقليد سلوك معظم المتصفحات الشائعة مثل Chrome و Firefox و Edge.
بالنسبة لكل جهاز وحجم الشاشة ، يمكن للمستخدمين النقر على أيقونة الجهاز للتغيير بين الاتجاه الرأسي والاتجاه الأفقي ، أو بالنسبة لأجهزة مثل iPad Air و iPad Pro التي تدعم طريقة العرض المقسمة ، يمكنك النقر للتناوب بين تخطيطات العرض المنقسمة المختلفة.
على الرغم من أن Safari Responsive Design Mode يفتقر إلى بعض خيارات الأدوات المشابهة الموجودة مسبقًا ، إلا أن وجوده في Safari مباشرة يمكن أن يكون مدخرًا كبيرًا للوقت لمصممي الويب ، وأداة رائعة للتعلم والاختبار لأصحاب مواقع الويب الذين يرغبون في التأكد من أن زوار هواتفهم المحمولة يحصلون على أفضل تجربة بغض النظر عن دقة الشاشة أو الحجم.
بمجرد الانتهاء من الاختبار ، يمكنك ترك وضع التصميم المتجاوب إما بإغلاق نافذة المتصفح أو علامة تبويبه ، أو الضغط على اختصار Command-Option-R مرة أخرى.
