اذهب الي المحتوي
منتديات ياللا يا شباب
عاشق الصداقه

أفضل 20 إضافة للمتصفحات لتطوير الويب

Recommended Posts

هناك الكثير من الاضافات والملحقات للمتصفحات التي تساعد في جعل عملية التصفح أكثر سهولة ومتعة، ولكن هناك أيضا إضافات خاصة ل

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

 

 

Firefox

  • Firebug
    لعلها تكون أهم أداة لتطوير وتحليل مواقع الويب، بالنسبة لي على الأقل. تتيح لك هذه الأداة التحليل العميق لكل ما يتعلق بصفحة الموقع، فحص وتعديل HTML، تعديل CSS مباشرة ورؤية التأثير على الفور، مراقبة حركة الشبكة، معرفة وتحليل المشاكل المتعلقة بالجافاسكربت، استكشاف عناصر ومحتويات DOM، والكثير من المزايا المثيرة.
  • Web Developer toolbar
    لا يمكنني تخيل حياتي المهنية في مجال الويب بدون هذه الأداة الرائعة، فهي تجمع كل ما تريد عمله على صفحة الموقع في شريط toolbar، سواء كان تعطيل/تفعيل CSS على الصفحة، تعطيل/تفعيل Javascript، تغيير حجم المتصفح لرؤية الصفحة على عدد من حجم الشاشات 1024 * 768 على سبيل المثال.
  • YSlow
    تم تطوير هذه الإداة من قبل مطوري شركة Yahoo! ليعمل بالتكامل مع إضافة Firebug لتحليل مواقع الويب من جهة المستخدم ليعطي تقرير كامل لكفائة أداء الموقع وبعض النصائح التي يجب اتباعها لرفع سرعة وكفاءة الموقع، والطريقة التي تعمل بها هذه الأداة هي عبر مقارنة الموقع مع نصائح Yahoo لرفع سرعة المواقع.
  • ColorZilla
    تساعد هذه الإضافة مطوري ومصممي الويب في مهام تحديد الألوان على الصفحة وسهولة الحصول على أرقام الألوان المختلفة، وتساعد أيضا في معرفة أي عنصر في الصفحة يحوي اللون المعين مع إمكانية تصغير وتكبير ومعرفة القياس بين أي نقطتين على الصفحة، وبالمناسبة في النسخة الأخيرة تم دمج بعض الخصائص لتعمل بالتكامل مع إضافة Firebug.
  • LiveHTTPHeaders
    تتيح هذه الإضافة لمتصفح Firefox معرفة مايدور خلف كواليس المواقع وتحليل طلبات/معطيات HTTP request/response headers والتي تكون جدا مفيدة في معرفة مشاكل المواقع، معرفة معلومات أكثر عن خادم المواقع، معرفة ما يزرع داخل Cookies من معلومات.
  • Modify Headers
    يمكنك عن طريق هذه الإضافة من إضافة، تعديل وترشيح HTTP request headers.
  • Firefox Accessibility Extension
    تمكن هذه الإضافة من مساعدة الأشخاص ذوي الاحتياجات الخاصة من التصفح بشكل مريح، وفي نفس الوقت تتيح لمطوري الويب من تعديل مواقعهم بما يتناسب مع هذه الفئة من الناس وجعل المواقع قابلة للوصول بشكل أفضل.
  • FireFTP
    FireFTP يتيح استخدام بروتوكول FTP بطريقة سهلة ومريحة من دون الحاجة إلى استخدام أي برنامج آخر غير متصفحك.
  • Fangs
    إداة Fangs تتيح لك تحويل الصفحة الحالية إلى صفحة نصية فقط كما يتم قرائتها من قبل متصفحات الشاشات أو ما تعرف Screen reader والتي يستخدمها المصابون بضعف أو انعدام الرؤية، وهي من الإضافات المهمة إذا كنت مهتم بأن يكون موقعك موافق لمعايير قابلية الوصول.

Internet Explorer

  • Internet Explorer Web Developer Toolbar
    تعتبر هذه الإضافة بمثابة Firebug لمتصفح Internet Explorer، حيث تتيح لك هذه الإضافة من استكشاف عناصر DOM الموجودة في الصفحة وإماكنية تعديلها مباشرة، امكانية التعديل واكتشاف أخطاء Javascript، والكثير من المزايا الرائعة لتطوير أفضل على هذا المتصفح.
  • Visual Web Developer Express Edition
    تمكنك هذه الأداة من تحليل واكتشاف أخطاء Javascript لمتصفح Internet Explorer بشكل أفضل، وهي أداة مكملة للأداة السابق ذكرها IE Web Developer Toolbar، ولمزيد من المعلومات حول كيفية استخدامها فإن Bernie يشرح الطريقة على موقعه.
  • DebugBar
    تضيف هذه الإضافة لمتصفح Internet Explorer ميزة اكتشاف الأخطاء البرمجية المتعلقة بلغة Javascript وDOM، وهي مشابهة تقريبا لإضافة IE Web Developer Toolbar ولكن بمزايا مختلفة قليلا، ففيها محدد الألوان color picker، وإمكانية التقاط الصور للصفحة وارسالها عبر البريد الألكتروني.

Opera

  • Opera Dragonfly
    نعود لأداة مشابهة تقريبا لأداة Firebug ولكن هذه المرة لمتصفح Opera، حيث تتيح لك هذه الإضافة من اكتشاف أخطاء Javascript، التعديل المباشر على عناصر DOM، التعديل المباشر على CSS، والكثير من المزايا المفيدة جدا لمطوري الويب المحترفين. وتم ادماجها تلقائيا مع المتصفح في النسخ المتقدمة.

Safari

  • Web Inspector
    تستكشف هذه الأداة التسلسل الهرمي لعناصر DOM بشكل مباشر، ويمكنك أيضا البحث داخل هذه العناصر.

إضافات عامة (لكل المتصفحات)

  • Firebug Lite
    لمحبي هذه الأداة الرائعة والموجودة على متصفح Firefox، فقد طور القائمون عليها أداة أخف من الأصلية تعمل عن طريق ملف Javascript يتم انشاءه وربطه داخل ملفات HTML أو عن طريق وضعه في المفضله لديك Bookmark.
  • Fiddler Web Debugger
    تتيح لك إضافة Fiddler التحليل لما يحدث من معلومات متبادلة أو حركة المرور التي تحدث بين العميل والخادم HTTP traffic، ومن هذه المعلومات عدد طلبات HTTP requests، وزن الصفحة كاملة، تاريخ cache. وهو بالمناسبة مفيد جدا لمتابعة حركات AJAX التي تحدث خلف الكواليس وحل المشاكل المتعلقة بها.
  • HttpWatch
    هذه أداة مشابهة إلى حد ما Fiddler التي سبق ذكرها، وتنفع لمتصفحات Firefox وInternet Explorer حيث وبالاضافة إلى مراقبة حركة مرور HTTP traffic تقوم أيضا بتقديم تقارير ورسوم بيانية وحفظ المعلومات على امتدادات XML وCSV مما يسهل عملية تحليلها لاحقا.
  • Web Accessibility Toolbar
    هذه الإضافة لمتصفحات Internet Explorer وOpera والتي تتيح لك مزايا فحص مدى قابلية الوصول لموقعك، ومزايا أخرى غيرها.
  • XRAY وMRI
    XRAY يمكن استخدامه لفحص نموذج الصندق لأي عنصر في الصفحة، بينما يقوم MRI بفحص selectors في الصفحة، هذه الأدوات تنفع لمتصفحات Internet Explorer والمتصفحات التي تعتمد على محركات Webkit وMozilla.

نقلاً عن المشروع

شارك هذه المشاركه


رابط المشاركه
شار ك علي موقع اخر

شكرا يا كرينكل على الاضافات الجميلة دى

وفعلا اضافات هامة جدا جدا ..

تقبل تحياتى :hhhh:

شارك هذه المشاركه


رابط المشاركه
شار ك علي موقع اخر

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

زائر
اضف رد علي هذا الموضوع....

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • اضف...

Important Information

By using this site, you agree to our Terms of Use, اتفاقيه الخصوصيه, قوانين الموقع, We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue..