導讀：原文作者Brian在freelancefolder.com發表了一篇《15 Useful Google Chrome Extensions for Web Designers and Developers》，由伯樂在線敏捷翻譯組編譯，文章介紹了非常有用的15個Chrome插件。以下是全文：

最近我才把谷歌瀏覽器設為默認瀏覽器，而與此同時我開始將它用于我的兼職Web設計和開發項目中。由于我所依賴Firebug的插件，在Chrome瀏覽器并沒有完全的對應插件，所以我還是時不時要用Firefox瀏覽器，但我對谷歌瀏覽器的速度、屏幕空間的利用及很多方面都很滿意。在這篇文章里，我和大家分享我在設計和開發網站時發現的一些最好的谷歌瀏覽器插件，按字母順序列出如下。

1.Aviary Screen Capture屏幕截圖

Aviary Screen Capture讓你能夠截取網頁的屏幕快照。獲得屏幕快照后，用Aviary.com的應用程序在瀏覽器內編輯那幅快照。基本的圖像編輯裝置讓你能夠標記（通過畫箭頭和長方形）、編輯（裁剪、旋轉和調整大小）和獲得精確的像素色彩。

其特性包括：

• 保存在桌面、在線主機、或在其它的Aviary應用程序上編輯
• 即時截圖
• 能夠截取所有網頁和圖像的任何部分
• 能夠截取整張網頁
• 能夠添加看得見的備注，比如箭頭、文本及在你截取的圖片上標出醒目符號
• 裁剪截取的圖片
• 調整截圖的大小、旋轉及翻轉截圖
• 智能選擇和去除截圖的元素
• 從頁面上獲得色彩信息
• 快速啟動6個Aviary設計工具，包括圖像、標記、矢量、調色板、效果和音頻編輯器

2.Chrome SEO搜索引擎優化

Chrome SEO為搜索引擎優化工具提供了方便的路徑。這些工具幫助你做每日搜索引擎優化工作，比如競爭分析、關鍵詞分析、反向鏈接檢查及網頁排名檢查等。

3.Chrome Sniffer嗅探器

Chrome Sniffer使Web開發人員能夠在網站上運行的檢查web框架∕CMS和JavaScript庫。這個插件通過一個圖標，顯示已檢測到的框架。目前，這個插件最多可檢測70個流行的CMS和JavaScript庫。

4.Eye Dropper滴管

Eye Dropper讓你能夠從網頁或高級顏色選擇器上選擇顏色。

5.Firebug Lite for Google Chrome

Firebug Lite for Google Chrome 并不是Firebug的替代品（這很不幸），也不是瀏覽器開發人員的工具。想法，你應該和其它工具一起使用。FirebugLite提供了大量的視覺效果，類似于Firebug的HTML元素、DOM元素及箱狀模式陰影。FirebugLite還具備其他一些很酷的功能，比如用鼠標檢測HTML元素，及實時編輯CSS的特性。

6.IE Tab

借助IE Tab，可以在Chrome Tab上切換顯示網頁。這個插件對想用IE渲染引擎跨瀏覽器測試的開發人員很有幫助。（這是Windows系統下的獨特插件。）

7.Instant Image Editor 即時圖像編輯器

當你按住alt鍵（Linux上的ctrl鍵）的時候，Instant Image Editor讓你在有背景圖像的網頁上可以右鍵點擊任何圖像或元素。你可以用Pixlr在新標簽上即時編輯圖像，Pixlr是在瀏覽器上運行速度快、使用方便的程序。當你右鍵點擊的元素不是圖像時，即時圖像編輯器也會確定這個元素是否有可供編輯的背景圖像。

8.Lorem Ipsum Generator

Lorem Ipsum生成器用簡約和極具吸引力的設計隨機產生“Lorem Ipsum”文本。

9.MeasureIt!

MeasureIt!用于測量網頁上任何元素的寬度和高度。

10.Pendule

Pendule是Chrome為Web開發人員提供的開發工具。這個內置的開發工具的插件包括：查看、重裝和禁用CSS，查看JavaScript、表格編輯，查看、隱藏及獲得圖像的信息，顏色選擇器、量尺、地形圖、標記驗證器等等！

11.PHP ConsolePHP控制臺

PHP Console是Lagger的一個插件，（Lagger：PHP處理錯誤/異常/調試的輕量級靈活的開源PHP庫），它在谷歌瀏覽器控制臺及彈出窗口中顯示PHP錯誤/調試的信息。

12.Speed Tracer速度追蹤器

Speed Tracer 速度追蹤器幫助你在網站應用程序中發現和修復性能問題。當應用程序運行時，這個插件將瀏覽器內的低水平檢測點可視化，并分析它們。

這個應用程序幫助你了解在你的應用程序里時間都花在哪了。這包括由以下原因導致的問題：

• Javascript的解析和執行
• Layout 版面
• CSS樣式重算和選擇器匹配
• DOM事件處理
• 網絡資源加載
• 定時器
• XMLHttpRequest 回調
• 繪圖
• 其它

13.Web Developer

Web Developer 在瀏覽器中增加了一個工具欄，其中有Web開發工具的按鈕。

14.Webpage Screenshot網頁快照

Webpage Screenshot是快速、簡單的插件，它能截取整個網頁。即使網頁很長，也能存儲在一份圖像文件里。這個插件讓你只點擊一下，就能以PNG/JPG格式存儲任何網頁的圖像。

• 有繪圖工具：線條、橢圓、長方形、箭頭等
• 在屏幕快照中添加文本
• 按所需尺寸快速裁剪圖像
• 在準備好圖像之前就能開始編輯
• 可以上傳到Facebook、Twitter、Gmail、MySpace上共享
• 打印：直接發送圖像到打印機
• 存儲在硬盤里：這個獨特的插件讓你能夠將大的圖片存儲在硬盤里
• 能夠截取本地文件：能夠截取“FILE://”
• 附有顏色選擇器：能夠記住你最后使用的顏色
• 也能夠截取水平網站的網頁

15.Window Resizer窗口大小調整器

Window Resizer能夠重新調整瀏覽器窗口的大小以適合各種分辨率。這個插件對網站設計和開發人員特別有用，能夠幫助他們在分辨率不同的瀏覽器上測試版面設計。分辨率清單是完全能夠定制的（增加/刪除/重新排序）。

可以提供三種屏幕類型：

1.臺式電腦（標準的；按具體的分辨率情況重新調整整個窗口的大小）

2.手提電腦（和臺式電腦一樣，但圖標不同；很容易掃描分辨率清單）

3.手機Mobile（和前兩種屏幕不同；適合具體的視圖尺寸，不會占滿整個窗口，因為手機的瀏覽器通常沒有邊界）

原文鏈接：15 Useful Google Chrome Extensions for Web Designers and Developers

譯文鏈接：對Web設計和開發人員有用的15個Chrome插件

總結

以上是生活随笔為你收集整理的对Web设计和开发人员有用的15个Chrome插件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。