01 من 06
تنشيط واستخدام وضع التصميم المستجيب في Safari 9
إن كوننا مطور ويب في عالم اليوم يعني دعم مجموعة من الأجهزة والمنصات ، والتي يمكن أن تكون مهمة شاقة في بعض الأحيان. حتى مع التعليمة البرمجية الأكثر تصميمًا والتي تلتزم بأحدث معايير الويب ، لا يزال بإمكانك العثور على أجزاء من موقعك على الويب قد لا تبدو أو تتصرف بالطريقة التي تريدها بها على أجهزة أو قرارات معينة. عندما تواجه تحدي دعم مثل هذه المجموعة الواسعة من السيناريوهات ، فإن امتلاك أدوات المحاكاة الصحيحة تحت تصرفك يمكن أن يكون لا يقدر بثمن.
إذا كنت من بين العديد من المبرمجين الذين يستخدمون نظام Mac ، فإن أدوات تطوير مطوري Safari تأتي دائمًا في متناول اليد. مع إصدار Safari 9 ، اتسع نطاق هذه الوظيفة بشكل كبير ، ويرجع ذلك بشكل أساسي إلى وضع التصميم المستجيب الذي يسمح لك بمعاينة كيفية عرض موقعك على مختلف درجات دقة الشاشة وكذلك على أجهزة iPad و iPhone و iPod التي تعمل باللمس.
يوضح هذا البرنامج التعليمي كيفية تنشيط وضع التصميم المستجيب بالإضافة إلى كيفية استخدامه لتلبية احتياجات التطوير الخاصة بك.
أولاً ، افتح متصفح Safari.
02 من 06
تفضيلات سفاري
انقر على Safari في قائمة المتصفح ، الموجودة أعلى الشاشة. عندما تظهر القائمة المنسدلة ، حدد خيار التفضيلات_ والمحاطة بدائرة في المثال أعلاه.
الرجاء ملاحظة أنه يمكنك استخدام اختصار لوحة المفاتيح التالي بدلاً من عنصر القائمة المذكور آنفًا: COMMAND + COMMA (،)
03 من 06
إظهار قائمة التطوير
يجب الآن عرض مربع حوار تفضيلات Safari ، مع تراكب نافذة المتصفح. أولاً ، انقر فوق الرمز المتقدم الذي يمثله الترس الموجود في الركن الأيمن العلوي من النافذة.
يجب أن تكون تفضيلات المستعرض المتقدمة مرئية الآن. في الجزء السفلي ، يوجد خيار مصحوبًا بمربع اختيار ، يسمى قائمة إظهار التطوير في شريط القوائم ومحاطة بدائرة في المثال أعلاه. انقر على مربع الاختيار مرة واحدة لتنشيط هذه القائمة.
04 من 06
أدخل وضع التصميم السريع الاستجابة
يجب أن يتوفر خيار جديد الآن في قائمة Safari الخاصة بك ، الموجودة أعلى الشاشة ، المسمى Develop . انقر على هذا الخيار. عندما تظهر القائمة المنسدلة ، حدد إدخال وضع التصميم المستجيب _ المحاطة بدائرة في المثال أعلاه.
الرجاء ملاحظة أنه يمكنك استخدام اختصار لوحة المفاتيح التالي بدلاً من عنصر القائمة المذكور أعلاه: OPTION + COMMAND + R
05 من 06
وضع التصميم المستجيب
يجب الآن عرض صفحة الويب النشطة في وضع التصميم المتجاوب ، كما هو موضح في المثال أعلاه. من خلال تحديد أحد أجهزة iOS المدرجة مثل iPhone 6 ، أو أحد دقة الشاشة المحددة المتاحة مثل 800 × 600 ، يمكنك عرض كيفية عرض الصفحة على هذا الجهاز أو في دقة العرض هذه.
بالإضافة إلى الأجهزة والحلول المعروضة ، يمكنك أيضًا توجيه Safari لمحاكاة وكيل مستخدم مختلف - مثل وكيل من متصفح مختلف - عن طريق النقر على القائمة المنسدلة الموضحة أعلى رموز الدقة مباشرةً.
06 من 06
تطوير القائمة: خيارات أخرى
بالإضافة إلى وضع التصميم المتجاوب ، تقدم قائمة تطوير Safari 9's العديد من الخيارات المفيدة الأخرى - بعضها مدرجة أدناه.
- Open Page With: يتيح لك فتح صفحة الويب النشطة في أي متصفح آخر مثبت حاليًا على جهاز Mac.
- وكيل المستخدم: يؤدي تغيير وكيل المستخدم إلى تحديد خوادم الويب لتعريف متصفحك على أنه شيء آخر بخلاف Safari 9.
- Connect Web Inspector: يقوم مفتش الويب في Safari 9 بعرض جميع موارد صفحة الويب ، مما يوفر إمكانية الاطلاع على معلومات CSS ومقاييس DOM وبنيتها ، بالإضافة إلى شفرة المصدر الأصلية.
- إظهار وحدة تحكم الأخطاء: أحد أكثر الخيارات استخدامًا على نطاق واسع في قائمة التطوير ، تعرض وحدة التحكم هذه أخطاء جافا سكريبت و HTML و XML والتحذيرات.
- إظهار مصدر الصفحة: يسمح لك بعرض شفرة مصدر صفحة الويب النشطة والبحث فيها.
- إظهار موارد الصفحة: يؤدي تحديد هذا الخيار إلى عرض المستندات والبرامج النصية و CSS والموارد الأخرى من الصفحة الحالية.
- إظهار Snippet Editor: يوفر القدرة على تحرير أجزاء التعليمات البرمجية وتنفيذها ، بدلاً من صفحة كاملة. هذه الميزة مفيدة للغاية من منظور الاختبار.
- Show Extension Builder: يتيح لك إنشاء إضافات Safari الخاصة بك عن طريق تعبئة التعليمة البرمجية وفقًا لذلك وإلحاق البيانات الوصفية.
- بدء التسجيل الزمني: يسجل عددًا من العناصر بما في ذلك طلبات الشبكة ، وتنفيذ جافا سكريبت ، وعرض الصفحة ، والأحداث الأخرى الخاصة بالفترة المحددة من قبل المستخدم وكلها قابلة للعرض داخل WebKit Inspector.
- تخزين مؤقت فارغ: يؤدي النقر على هذا الخيار إلى حذف كل ذاكرة التخزين المؤقت المخزنة داخل Safari ، وليس فقط ملفات التخزين المؤقت القياسية لموقع الويب.
- تعطيل ذاكرة التخزين المؤقت: عند تعطيل التخزين المؤقت ، يتم تنزيل الموارد من موقع ويب في كل مرة يتم فيها تقديم طلب وصول بدلاً من استخدام ذاكرة التخزين المؤقت المحلية.
- السماح بـ JavaScript من حقل البحث الذكي: تم التعطيل افتراضيًا لأسباب تتعلق بالأمان ، تسمح لك هذه الميزة بإدخال عناوين URL التي تحتوي على javascript: في شريط عناوين Safari.
- تعامل شهادات SHA-1 على أنها غير آمنة: اختصارًا لخوارزمية التجزئة الآمنة ، ثبت أن دالة هاش SHA-1 أقل أمانًا مما كان يعتقد في الأساس من إضافة هذا الخيار في Safari 9.
القراءة ذات الصلة
إذا وجدت هذا البرنامج التعليمي مفيدًا ، فاحرص على التحقق من الإرشادات التفصيلية الأخرى لـ Safari 9.
- كيفية إدارة الموقع دفع الإخطارات
- كيفية تصدير صفحة ويب إلى ملف PDF
- كيفية تكوين ملحقات سفاري 9 لتحديث تلقائيا
- كيفية استخدام ميزة المواقع المثبتة