16個優秀的Web開發輔助工具推薦

發表於2012-05-24

英文原文:16 Essential Web Development Online Tools,翻譯:iteye

優秀的工具,可以使你的開發工作事半功倍,幫助你建立出高品質的Web應用。

本文整理了16款重要的Web開發工具,涵蓋CSS、JavaScript、影像優化和其他方面的Web開發工作,希望對你的開發工作能有所幫助。

一、CSS工具

1.  Simpless

這是一個免費的離線LESS程式碼編譯器。如果你使用LESS,這是一個偉大的工具,能夠自動檢測程式碼變化,並編譯它。可在Mac、Windows和Linux平臺上使用。

16個優秀的Web開發輔助工具推薦

2.  CSSWrap

一個很酷的CSS文字路徑生成工具。

16個優秀的Web開發輔助工具推薦

3.  LayerStyles

不想去記新的CSS3特性和字首?該工具使用類似於Photoshop圖層樣式的介面,讓你輕鬆配置陰影、背景、邊框和邊界半徑。

16個優秀的Web開發輔助工具推薦

4.  BearCSS

該工具可以根據上傳的HTML文件,採集其中所使用的HTML元素,來生成CSS模板。

16個優秀的Web開發輔助工具推薦

二、JavaScript工具

5.  Bookmarkleter

該工具可以將你的JavaScript程式碼轉換成一個小書籤,幫助你進行程式碼壓縮和URL編碼。

16個優秀的Web開發輔助工具推薦

6.  JSLint

這是一個JavaScript除錯工具。可以查詢程式碼中的潛在問題,並返回一條訊息,告訴你問題以及位置。

16個優秀的Web開發輔助工具推薦

7.  ShowIF

這是一個簡單的if…else工具,允許使用者設定基於客戶端環境(瀏覽器、作業系統、解析度等)的條件,如果條件匹配則執行指定的動作。

16個優秀的Web開發輔助工具推薦

三、影像優化工具

8.  JPEG Mini

在保持JPEG圖片原有品質和格式的情況下,使圖片大小減少為原來的1/5。

16個優秀的Web開發輔助工具推薦

9.  PunyPNG

該工具可以大大降低影像檔案的大小,且沒有任何質量損失。

16個優秀的Web開發輔助工具推薦

10.  SpritePad

一個快速、使用者友好的線上CSS sprite生成器,支援影像拖拽,並可以生成你需要的CSS程式碼。

16個優秀的Web開發輔助工具推薦

11.  SpriteMe

該工具以一種不同的方式來建立CSS sprite。這是一個書籤,可以檢測你網站中的影像,並相應地進行CSS sprite。

16個優秀的Web開發輔助工具推薦

四、其他工具

12.  Browsers

實用的瀏覽器沙箱。你可以執行任何瀏覽器,而無需將它們安裝到你的電腦中。目前只支援Windows平臺。

16個優秀的Web開發輔助工具推薦

13.  SpurApp

該工具使用不同的方法來測試頁面的可用性和佈局,利用的技術包括灰度、交叉點、間隔、對比、模糊、映象等,為你展示你可能會忽略的設計缺陷。

16個優秀的Web開發輔助工具推薦

14.  Pingdom

用於測試網站的載入時間,並分析,幫助你找出瓶頸。

16個優秀的Web開發輔助工具推薦

15.  Loads.in

另一款計算網站載入時間的工具。

16個優秀的Web開發輔助工具推薦

16.  HTML5 Test

測試瀏覽器對HTML5標準和規範的支援情況。

16個優秀的Web開發輔助工具推薦

 

相關文章