SAY討論區

標題: 十款讓 Web 前端開發人員更輕鬆的實用工具 - 網站設計及開發 [打印本頁]

作者: nage999 時間: 2014-1-20 16:09:07 標題: 十款讓 Web 前端開發人員更輕鬆的實用工具 - 網站設計及開發

　　這篇文章介紹十款讓 Web 前端開發人員生活更輕鬆的實用工具。每個 Web 開發人員都有自己的工具箱，這樣工作中碰到的每個問題都有一個好的解決方案供選擇。　　對於每一項工作，開發人員需要特定的輔助工具，所以如果下面這些工具對於你來說都是新的領域，那麼這篇文章是非常有用的，因為這些實用的工具將讓你的工作更有效率。

Spritepad

藉助 SpritePad，你可以在幾分鐘甚至幾秒鐘內創建你的 CSS 精靈。只需拖放您的圖片，立即可以生成 PNG 精靈圖片以及 CSS 代碼。不需要在 Photoshop 中操作，不需要編寫任何的 CSS 樣式。

Html5test

這個 HTML5 測試得分能夠提示您正常使用的瀏覽器對於 HTML5 標準和相關規範的支持情況的指標。

Spur

Spur 是一個有趣和簡單的方法來評判網頁設計的方式，你從來沒有做過的事情。只貼上一個網址（或上傳圖片），你就可以使用七種不同的工具來幫助你。

JPEG Mini

能夠幫助你把 JPEG 格式照片的文件大小減小5倍，同時保持原有的品質和 JPEG 格式。

Site Validator

由W3C 官方驗證對你的網站完成驗證，這包括驗證你網站中的 HTML5 標記。

Codepen

CodePen 是一個在線的 HTML、CSS 和 JavaScript 代碼編輯器，能夠編寫代碼並即時預覽效果。可以用於在線展示的作品，也可以看到其他人在網頁中實現的各種令人驚奇的效果。

Brackets

Brackets 是一款開源的代碼編輯器，專門為前端開發人員和設計師打造，它的核心目標是減少在開發過程中那些效率低下的重複性工作，例如瀏覽器刷新，修改元素的樣式，搜索功能等等。

Codekit

CodeKit 幫助您更快更好地建立網站。網站右側的一分鐘預告片視頻將是一個良好的開始。

Patternizer

Patternizer 是一個在線工具，幫助您使用在線界面生成基於 CSS3 的條紋效果。

CSS3 Click Chart

CSS3點擊圖表是一個方便的 CSS3 屬性參考工具，演示 CSS3 特性的示例代碼以及瀏覽器支持情況的詳細信息。

附件: [180521o34b3i4ysc4.png] 180521o34b3i4ysc4.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTAwfDFkNzY0YzkwfDE3ODI4NDkyNjR8MHww

附件: [18052103dacfohxik.png] 18052103dacfohxik.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTAxfGVjNmY5ZjA3fDE3ODI4NDkyNjR8MHww

附件: [180521kqmkafjtbvy.png] 180521kqmkafjtbvy.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTAyfGI1MGZkYmU2fDE3ODI4NDkyNjR8MHww

附件: [180521z4arw4dwuxr.png] 180521z4arw4dwuxr.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTAzfGJhYWI5N2ZjfDE3ODI4NDkyNjR8MHww

附件: [180521ma54kdaxfnu.png] 180521ma54kdaxfnu.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTA0fDZiMWY0MDRjfDE3ODI4NDkyNjR8MHww

附件: [180521hwnbtx4udis.png] 180521hwnbtx4udis.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTA1fGY4NzgxZjNifDE3ODI4NDkyNjR8MHww

附件: [180521kb0aznam4mo.png] 180521kb0aznam4mo.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTA2fDY3NDBmZjllfDE3ODI4NDkyNjR8MHww

附件: [180521ioiuor3cecs.png] 180521ioiuor3cecs.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTA3fDA0NzNkNjU2fDE3ODI4NDkyNjR8MHww

附件: [180521izycra2cbag.png] 180521izycra2cbag.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 1
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTA4fDUyY2E4ZGQ1fDE3ODI4NDkyNjR8MHww

附件: [180522eju1iswd4li.png] 180522eju1iswd4li.png (2014-1-20 16:09:07, 0 Bytes) / 下載次數 0
http://forum.go2tutor.com/forum.php?mod=attachment&aid=NTA1NTA5fGY1Y2I3ZWZlfDE3ODI4NDkyNjR8MHww

作者: skykingdom 時間: 2014-1-20 18:10:10

我來看看！謝謝

作者: 十兵衛 時間: 2014-1-20 18:54:22

好啊，謝樓主

作者: 阿迅 時間: 2014-1-20 21:13:44

老大,我好崇拜你喲

作者: 牙`蔚 時間: 2014-1-20 22:47:41

幫你回覆一下

作者: Derek_Me 時間: 2014-1-20 22:49:11

其實回帖算是一種沒德德，所以我快成聖人了

作者: mydear888 時間: 2014-1-21 01:57:02

好人一個

作者: yan4327 時間: 2014-1-21 03:20:43

Thank you for your sharing，回覆囉

作者: madbull_zxr750 時間: 2014-1-21 05:23:40

這一篇看起來不錯，可以頂

作者: 牙`蔚 時間: 2014-1-21 06:40:24

我在頂貼~！~

作者: 太陽穴 時間: 2014-1-21 10:00:16

好分享的樓主，我給你一個贊

作者: kengtr 時間: 2014-1-21 13:14:44

不看白不看，看也不白看

作者: 鬼谷先生 時間: 2014-1-21 17:42:13

這篇帖子，我還是第一次在這看到

作者: freegold 時間: 2014-1-21 23:57:42

我幫你這一帖頂起來

作者: 牛奶陽光 時間: 2014-1-22 03:16:36

樓上的話等於沒說~~~

作者: HO0907 時間: 2014-1-22 05:36:26

昨晚多幾分鐘的準備，今天少幾小時的麻煩。

作者: DiorCherie 時間: 2014-1-22 07:47:30

樓主的內容不管你信不信，反正我信了

作者: 弒殺滅神 時間: 2014-1-23 04:39:34

看了你的帖，讓我有一種說不出的感覺

作者: fifidodo3 時間: 2014-1-24 05:55:00

很有吸引力

作者: 切雞飯 時間: 2014-1-25 09:59:45

原來是這樣

作者: 我不是傻鴨 時間: 2014-1-26 03:10:56

我想要`~

作者: 我不是傻鴨 時間: 2014-1-26 10:24:28

真是有你的！

作者: tomato_alex 時間: 2014-1-27 08:18:07

厲害！強~~~~沒的說了！

歡迎光臨 SAY討論區 (http://forum.go2tutor.com/)