أدوات تطوير المواقع

أدوات تطوير المواقع 
تصغير|توضح الصورة لوحة واجهة المستخدم الخاصة بـ Opera Dragonfly
أدوات تطوير المواقع تسمح لمطوري المواقع لاختبار واصلاح اخطاء أكوادهم. هناك اختلاف بين إنشاء مواقع وبيئات التطوير المتكاملة. بيئات التطوير المتكاملة لا تساعد مباشرةً في بناء صفحات المواقع بل هي أدوات تستخدم لاختبار واجهة المستخدم للموقع وتطبيقات المواقع.

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

إضافة إلى أن أدوات تطوير المواقع تسمح لمطور المواقع بالعمل على تقنيات مختلفة، من ضمنها اللغات الخاصة بالتصميم واجهات المواقع (html “hypertext markup language) لغة ترميز النص التشعبي، صفحات الطرز المتراصة Cascading style sheets (لغة تنسيق لصفحات الويب تهتم بشكل وتصميم المواقع), "(DOM “ Document Object Model) نموذج كائن المستند ولغة البرمجة جافا سكريبت.
والعديد من المكونات التي يمكن أن يتعامل معها متصفح الموقع. وهناك طلب متزايد من متصفحات المواقع لإضافة مميزات أخرى لذلك شملت المتصفحات المواقع الشائعة مميزات أكثر موجهة للمطورين.

 دعم أدوات المطورين 

أشهر خمسة متصفحات مواقع لديها دعم لأدوات مطوري المواقعMost popular web browsers  وتسمح لمصممين ومطورين المواقع لنظر في تكوين صفحاتهم. جميع هذه الأدوات تم بنائها في المتصفحات ولا تتطلب تكوين أو وحدات إضافية.

 قوقل كروم - أدوات مطوري المواقع «أو أدوات تطوير البرامج».Chrome DevTools Overview - Google Chrome 
 إنترنت اكسبلورر ومايكروسفت إيدج - أدوات مطوري المواقع (من الإصدار 8).F12 Developer Tools (Windows) | Microsoft Docs Microsoft Edge Developer Tools - Microsoft Edge Development | Microsoft Docs 
 سفاري - أدوات تطوير المواقع من سفاريTools - Safari for Developers - Apple Developer  (من الإصدار 3)Safari version history
 فايرفوكس - وحدة تحكم الموقع / وحدة تحكم المتصفح (من فايرفوكس 4). وحدة تحكم المواقع تنطبق على محتوى واحد من علامة التبويب، خلاف وحدة تحكم المتصفح تنطبق على المتصفح بأكمله وأيضًا توجد العديد من الإضافات مثل firebug “لإكتشفاف أن هنا لك خطأ ".
 أوبرا - Opera Dragonfly

 الخصائص المشتركة 

يتم الوصول إلى أدوات مطوري المواقع في المتصفح بصفة عامة من خلال صفحة الموقع واختبار «فحص عنصر» أو خيار مشابهة من القائمة. وبدلًا من ذلك، يوجد اختصار مشترك أيضًا وهو مفتاح F12.Not Found - Google Chrome 

محرر ومشاهد لغة ترميز النص التشعبي ونموذج كائن المستند يتم تضمينها بشكل مشترك في أدوات تطوير المواقع. الفرق بين ترميز النص التشعبي وعارض نموذج كائن المستند هو ميزة المصدر في متصفحات المواقع في حين أن عارض ترميز النص التشعبي ونموذج كائن المستند يسمح لك بمشاهدة نموذج كائن المستند كما تم تقديمه بالإضافة إلى أنه يسمح لك بإجراء تغييرات على ترميز النص التشعبي وترميز النص التشعبي ومشاهدة التغييرات المنعكسة في الصفحة بعد إجراء التغييرات.Introduction to F12 Developer Tools (Windows) | Microsoft Docs 

بالإضافة لاختيار التغييرات، فعادة تعرض عناصر ترميز النص التشعبي خصائص كائن نموذج كائن المستند، مثل بُعد العرض وخصائص css

 أصول صفحة الموقع والمصادر ومعلومات الشبكة 

عادة يتم تحميل صفحات المواقع وتتطلب محتوى إضافي مثل صور ومخطوطات وخط وملفات خارجية أخرى. أيضا أدوات تطوير المواقع تسمح للمطورين بفحص المصادر التي يتم تحميلها على صفحة الموقع على هيكلة شجرة.Resources Panel - Google Chrome Firefox Debuts New Developer Toolbar - The Mozilla Blog 
أدوات تطوير المواقع تسمح أيضا للمطورين في إمكانية عرض معلومات حول استعمال الشبكة، مثل عرض مدة التحميل واستخدام النطاق الترددي ورؤوس بروتوكول نقل النص الفائق التي يتم إرسالها واستقبالها.Measure Resource Loading Times | Tools for Web Developers | Google Developers 

 التنميط والتدقيق 

يتيح التنميط للمطورين التقاط معلومات حول أداء صفحة الموقع أو تطبيق الموقع. مع هذه المعلومات يستطيع المطورون تحسين أداء النصوص الخاصة بهم.

تزود خصائص التعديل للمطورين اقتراحات، بعد تحليل الصفحة، للتحسينات لتقليل وقت تحميل الصفحة وزيادة الاستجابة.
توفر أدوات تطوير المواقع أيضا عادة ميزات جدول زمني توفر سجلًا للوقت والمدة التي يستغرقها في عرض الصفحة، واستخدام الذاكرة، وأنواع الأحداث التي تحدث.Profiles Panel - Google Chrome F12 developer tools console error messages (Windows) | Microsoft Docs 

تتيح هذه المميزات للمطورين تحسين صفحات المواقع وتطبيقات المواقع.

 تصحيح أخطاء الجافا سكريبت 

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

 الإضافات والمكونات الإضافية 

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

 انظر أيضًا 
 دورة حياة تطوير الأنظمة
 شبكة عنكبوتية عالمية
 المراجع 

تصنيف:أدوات برمجة
تصنيف:تطوير الويب
تصنيف:ويب أو إس