คอลเลกชันเครื่องมือที่ใช้กันทั่วไปสำหรับนักออกแบบส่วนหน้าเว็บ

ด้านล่างนี้เป็นปลั๊กอินเครื่องมือซอฟต์แวร์ ฯลฯ สำหรับการพัฒนาส่วนหน้าที่ฉันได้รวบรวมและรวบรวม มันเทียบเท่ากับการสำรองข้อมูลขนาดเล็กของคอมพิวเตอร์ สำหรับวิธีการใช้งานฉันจะสรุปในอนาคต ในปัจจุบันมันจะดีกว่าสำหรับ Google ด้วยตัวคุณเอง

【ปลั๊กอิน Firefox 】

1. Firefbug - Page Moderator

2. YSLOW - เครื่องมือการจัดอันดับเว็บ

3. Pixel Perfect - การเปรียบเทียบ HTML และ Design Draft

4. การใช้งาน CSS - เครื่องมือเพิ่มประสิทธิภาพประสิทธิภาพการใช้งาน CSS

5. ความเร็วหน้า- เพิ่มประสิทธิภาพเว็บเพจอย่างรวดเร็วคล้ายกับ YSLOW

6. การวัด - เครื่องมือวัดแบบเรียลไทม์

7. Fiddler - เครื่องมือสไตล์หน้าท้องถิ่น

8. DNS Flusher - เครื่องมือรีเฟรช DNS

9. Colorzilla - เครื่องมือเลือกสีแบบเรียลไทม์

10. นักพัฒนาเว็บ - ตรวจสอบข้อมูลที่เกี่ยวข้องของหน้าเว็บ

11. FiremobilesImulator - จำลองโทรศัพท์มือถือ

12. JavaScript Dubugger - ข้อผิดพลาด JavaScript

13. Greasemonkey - Applet สคริปต์

14. Firecookie - คุกกี้

【ปลั๊กอิน Chrome 】

1. ภาพหน้าจอที่ยอดเยี่ยม - ภาพหน้าจอหน้าเว็บ

2. สวิตช์ตัวแทนผู้ใช้ - สลับอุปกรณ์แสดงผล

3. นักพัฒนาเว็บ - ตรวจสอบข้อมูลที่เกี่ยวข้องของหน้าเว็บ

4. Resizer Window - เปลี่ยนความละเอียด

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 Picture Synthesizer

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 curve

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. Markman-นักออกแบบที่ต้องมีสำหรับวิศวกรส่วนหน้า

2. VIM - Editor Super Fast

3. Adobe Photoshop CS6 - การตัดรูปภาพพิเศษ

4. IE TESTER - ตรวจสอบความเข้ากันได้ของหน้า

5. Fiddler2 - คำขอตรวจจับ

6. Beyond Commpar - การเปรียบเทียบไฟล์

7. Git - การควบคุมเวอร์ชันแบบกระจาย

8. Opera Mobile Emulator - เบราว์เซอร์มือถือ

9. Simpless - น้อยลง

มีความเชี่ยวชาญส่วนใหญ่ของเครื่องมือข้างต้นขอแสดงความยินดีคุณอยู่ไม่ไกลจากนักออกแบบส่วนหน้ายอดเยี่ยม ~~