Koleksi alatan yang biasa digunakan untuk pereka bahagian hadapan WEB_Pengetahuan asas

Berikut ialah beberapa pemalam, alatan, perisian, dsb. yang biasa digunakan yang saya kumpulkan dan kumpulkan untuk pembangunan bahagian hadapan ia bersamaan dengan membuat sandaran kecil untuk komputer anda, saya akan meringkaskannya pada masa hadapan, anda boleh google sendiri.

【pemalam FireFox】

1. Firefbug —— Alat nyahpepijat halaman

2. YSlow —— Alat penilaian halaman web

3 Pixel Perfect —— Perbandingan antara HTML dan draf reka bentuk

4. Penggunaan CSS —— Alat pengoptimuman kecekapan penggunaan CSS

5. Kelajuan Halaman —— Optimumkan halaman web dengan pantas seperti YSlow

6. Measureit —— Alat ukuran masa nyata

7. Fiddler —— Alat yang berkuasa untuk pelarasan tempatan gaya halaman

8. DNS flusher —— Alat penyegar semula DNS

9. Colorzilla —— Alat pemilihan warna masa nyata

10. Pembangun Web —— Semak maklumat berkaitan halaman web

11. FireMobileSimulator —— Simulasikan telefon mudah alih

12. JavaScript Dubugger —— Penyelesaian Masalah JavaScript

13. Greasemonkey —— Skrip applet

14. Kuki Api —— Kuki

【Pemalam Chrome】

1. Tangkapan Skrin Hebat —— Tangkapan skrin halaman web

2. Penukar Ejen pengguna —— Tukar peranti paparan

3. Pembangun web —— Semak maklumat berkaitan halaman web

4. Penubah Tetingkap —— Tukar resolusi

5. YSlow —— Alat penilaian halaman web

6. Pengesanan keserasian penyemak imbas

[Alat URL yang biasa digunakan untuk pembangunan bahagian hadapan]

Padanan warna web

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

Penjana 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/

Penjana Butang CSS3

http://www.wordpressthemeshock.com/css-drop-shadow/

http://css3buttongenerator.com/

Komposer Imej CSS

http://csssprites.com/

http://cn.spritegen.website-performance.org/

Pemeriksaan kod CSS

http://csslint.net/

imej memuatkan ajax

http://ajaxload.info/

http://preloaders.net/

Jadual godam CSS

http://centricle.com/ref/css/filters/

Pasaran Pelayar

http://tongji.baidu.com/data/browser

Uji sokongan penyemak imbas untuk CSS3

http://css3test.com/

http://kimblim.dk/css-tests/selectors/

http://selectivizr.com/

http://www.findmebyip.com/litmus

Kesan pengalaman pengguna

http://gtmetrix.com/

Penjana Templat CSS

http://blog.html.it/layoutgala/

http://www.mycelly.com/

http://www.intensivstation.ch/ms/templates/

Mampatan CSS

http://www.csscompressor.com/

Fon CSS biasa

http://cssfontstack.com/

http://www.google.com/webfonts#

http://www.dafont.com/

Transformasi CSS3

http://www.useragentman.com/IETransformsTranslator/

Keluk Bezier CSS3

http://cubic-bezier.com/#.47,.73,1,.41

Alat grid CSS YUI

http://developer.yahoo.com/yui/grids/builder/

Pengoptimuman dan pengindahan kod JavaScript

http://js.clicki.cc/

Demo Kod

http://jsfiddle.net/

http://jsbin.com/#html,live

http://ikeepu.com/bar/20143449

http://codepad.org/

Alat reka bentuk prototaip

https://gomockingbird.com/mockingbird/#

http://www.jotform.com/

[Perisian tempatan dan biasa digunakan serta editor IDE]

1. MarkMan —— Pereka bentuk, satu kemestian bagi jurutera hadapan

2. VIM —— Editor yang sangat pantas

3. Adobe PhotoShop CS6 —— Eksklusif untuk pemotongan imej

4. Penguji IE —— Semak keserasian halaman

5. Fiddler2 —— Permintaan pengesanan

6. Beyond Commpar —— Perbandingan fail

7. GIT —— Kawalan versi teragih

8. Opera Mobile Emulator —— Penyemak imbas mudah alih

9. SimpLESS —— KURANG

Tahniah kerana menguasai kebanyakan alatan di atas, anda tidak jauh dari menjadi pereka hadapan yang cemerlang~~