كيفية تنشيط واستخدام وضع التصميم المستجيب في سفاري 9

01 من 06

تنشيط واستخدام وضع التصميم المستجيب في Safari 9

© Scott Orgera.

إن كوننا مطور ويب في عالم اليوم يعني دعم مجموعة من الأجهزة والمنصات ، والتي يمكن أن تكون مهمة شاقة في بعض الأحيان. حتى مع التعليمة البرمجية الأكثر تصميمًا والتي تلتزم بأحدث معايير الويب ، لا يزال بإمكانك العثور على أجزاء من موقعك على الويب قد لا تبدو أو تتصرف بالطريقة التي تريدها بها على أجهزة أو قرارات معينة. عندما تواجه تحدي دعم مثل هذه المجموعة الواسعة من السيناريوهات ، فإن امتلاك أدوات المحاكاة الصحيحة تحت تصرفك يمكن أن يكون لا يقدر بثمن.

إذا كنت من بين العديد من المبرمجين الذين يستخدمون نظام Mac ، فإن أدوات تطوير مطوري Safari تأتي دائمًا في متناول اليد. مع إصدار Safari 9 ، اتسع نطاق هذه الوظيفة بشكل كبير ، ويرجع ذلك بشكل أساسي إلى وضع التصميم المستجيب الذي يسمح لك بمعاينة كيفية عرض موقعك على مختلف درجات دقة الشاشة وكذلك على أجهزة iPad و iPhone و iPod التي تعمل باللمس.

يوضح هذا البرنامج التعليمي كيفية تنشيط وضع التصميم المستجيب بالإضافة إلى كيفية استخدامه لتلبية احتياجات التطوير الخاصة بك.

أولاً ، افتح متصفح Safari.

02 من 06

تفضيلات سفاري

© Scott Orgera.

انقر على Safari في قائمة المتصفح ، الموجودة أعلى الشاشة. عندما تظهر القائمة المنسدلة ، حدد خيار التفضيلات_ والمحاطة بدائرة في المثال أعلاه.

الرجاء ملاحظة أنه يمكنك استخدام اختصار لوحة المفاتيح التالي بدلاً من عنصر القائمة المذكور آنفًا: COMMAND + COMMA (،)

03 من 06

إظهار قائمة التطوير

© Scott Orgera.

يجب الآن عرض مربع حوار تفضيلات Safari ، مع تراكب نافذة المتصفح. أولاً ، انقر فوق الرمز المتقدم الذي يمثله الترس الموجود في الركن الأيمن العلوي من النافذة.

يجب أن تكون تفضيلات المستعرض المتقدمة مرئية الآن. في الجزء السفلي ، يوجد خيار مصحوبًا بمربع اختيار ، يسمى قائمة إظهار التطوير في شريط القوائم ومحاطة بدائرة في المثال أعلاه. انقر على مربع الاختيار مرة واحدة لتنشيط هذه القائمة.

04 من 06

أدخل وضع التصميم السريع الاستجابة

© Scott Orgera.

يجب أن يتوفر خيار جديد الآن في قائمة Safari الخاصة بك ، الموجودة أعلى الشاشة ، المسمى Develop . انقر على هذا الخيار. عندما تظهر القائمة المنسدلة ، حدد إدخال وضع التصميم المستجيب _ المحاطة بدائرة في المثال أعلاه.

الرجاء ملاحظة أنه يمكنك استخدام اختصار لوحة المفاتيح التالي بدلاً من عنصر القائمة المذكور أعلاه: OPTION + COMMAND + R

05 من 06

وضع التصميم المستجيب

© Scott Orgera.

يجب الآن عرض صفحة الويب النشطة في وضع التصميم المتجاوب ، كما هو موضح في المثال أعلاه. من خلال تحديد أحد أجهزة iOS المدرجة مثل iPhone 6 ، أو أحد دقة الشاشة المحددة المتاحة مثل 800 × 600 ، يمكنك عرض كيفية عرض الصفحة على هذا الجهاز أو في دقة العرض هذه.

بالإضافة إلى الأجهزة والحلول المعروضة ، يمكنك أيضًا توجيه Safari لمحاكاة وكيل مستخدم مختلف - مثل وكيل من متصفح مختلف - عن طريق النقر على القائمة المنسدلة الموضحة أعلى رموز الدقة مباشرةً.

06 من 06

تطوير القائمة: خيارات أخرى

© Scott Orgera.

بالإضافة إلى وضع التصميم المتجاوب ، تقدم قائمة تطوير Safari 9's العديد من الخيارات المفيدة الأخرى - بعضها مدرجة أدناه.

القراءة ذات الصلة

إذا وجدت هذا البرنامج التعليمي مفيدًا ، فاحرص على التحقق من الإرشادات التفصيلية الأخرى لـ Safari 9.