فيما يلي بعض المكونات الإضافية شائعة الاستخدام ، والأدوات ، والبرامج ، وما إلى ذلك للتطوير الأمامي الذي قمت بتجميعه وجمعه. إنه يعادل صنع نسخة احتياطية صغيرة من الكمبيوتر. أما بالنسبة لكيفية استخدامه ، فسوف ألخصها في المستقبل. في الوقت الحاضر ، من الأفضل أن تكون Google بنفسك.
【البرنامج المساعد Firefox】
1. FirefBug - Moderator Page
2. YSLOW - أداة تصنيف الويب
3. بكسل مثالي - مقارنة بين HTML وتصميم مسودة
4. استخدام CSS - أداة تحسين كفاءة استخدام CSS
5. سرعة الصفحة- تحسين صفحات الويب بسرعة مماثلة لـ yslow
6. مقياس - أداة القياس في الوقت الفعلي
7. Fiddler - أداة نمط الصفحة المحلية
8. DNS Flusher - أداة تحديث DNS
9. Colorzilla - أداة اختيار الألوان في الوقت الفعلي
10. مطور الويب - تحقق من المعلومات ذات الصلة لصفحة الويب
11. FireMobilesimulator - محاكاة الهواتف المحمولة
12. JavaScript Dubugger - أخطاء JavaScript
13. Greasemonkey - Applet Script
14. Firecookie - ملف تعريف الارتباط
【المكون الإضافي Chrome】
1. لقطة شاشة رائعة - لقطة شاشة صفحة الويب
2. تبديل وكيل المستخدم - قم بتبديل جهاز العرض
3. مطور الويب - تحقق من المعلومات ذات الصلة لصفحة الويب
4. إعادة صياغة النوافذ - تغيير القرار
5. yslow - أداة تصنيف الويب
6. اكتشاف توافق المتصفح
[أدوات URL المشتركة للتنمية الواجهة الأمامية]
مطابقة لون الويب
http://www.peise.net/tools/web/
http://www.peise.net/tools/lilun/lilunxuexi.html
http://www.colorschemer.com/online.html
http://www.workwithcolor.com/hsl- color-picker-01.htm
مولد CSS3
http://www.css3maker.com/
http://www.flickyard.in/autocss3/
http://www.colorzilla.com/gradient-editor/
http://css3pie.com/
http://www.css3.me/
http://ie.microsoft.com/testdrive/graphics/cssgradientbackgroundmaker/
مولد زر CSS3
http://www.wordpressthemeshock.com/css-drop-shadow/
http://css3buttongenerator.com/
CSS صورة مزج
http://csssprites.com/
http://cn.spritegen.website-performance.org/
فحص رمز CSS
http://csslint.net/
Ajax تحميل صورة
http://ajaxload.info/
http://preloaders.net/
جدول الاختراق CSS
http://centricle.com/ref/css/filters/
سوق المتصفح
http://tongji.baidu.com/data/browser
اختبر دعم المتصفح لـ CSS3
http://css3test.com/
http://kimblim.dk/css-tests/selectors/
http://selectivizr.com/
http://www.findmebyip.com/litmus
اكتشف تجربة المستخدم
http://gtmetrix.com/
مولد قالب CSS
http://blog.html.it/layoutgala/
http://www.mycelly.com/
http://www.intensivstation.ch/en/templates/
ضغط CSS
http://www.csscompressor.com/
الخطوط الشائعة ل CSS
http://cssfontstack.com/
http://www.google.com/webfonts#
http://www.dafont.com/
تحويل CSS3
http://www.useragentman.com/ietransformstranslator/
منحنى CSS3 Bezier
http://cubic-bezier.com/#.47،.73،1،.41
أداة شبكة Yui CSS
http://developer.yahoo.com/yui/grids/builder/
تحسين رمز JavaScript وتجميله
http://js.clicki.cc/
رمز العرض التوضيحي
http://jsfiddle.net/
http://jsbin.com/#html،live
http://ikeeper.com/bar/20143449
http://codepad.org/
أدوات النماذج الأولية
https://gomockingbird.com/mockingbird/#
http://www.jotform.com/
【البرمجيات المحلية والاستخدام بشكل شائع ومحرر IDE】
1. ماركمان-مصمم ، يجب أن يكون للمهندسين في الواجهة الأمامية
2. فيم - محرر فائق السوبر
3. Adobe Photoshop CS6 - صور قطع خاصة
4. أي اختبار - تحقق من توافق الصفحة
5. Fiddler2 - طلب الكشف
6. ما وراء Commpar - مقارنة الملف
7. GIT - التحكم في الإصدار الموزع
8. Opera Mobile Emulator - متصفح الهاتف المحمول
9. البساطة - أقل
بعد إتقان معظم الأدوات المذكورة أعلاه ، تهانينا ، فأنت لست بعيدًا عن مصمم أمامي ممتاز ~~