前端开发工程师的 Chrome 浏览器 插件推荐
Google Chrome 是最好用的几个浏览器之一，自从 2011 年 11 月份赶超 Firefox 之后，已成为当今互联网的主流浏览器。今天，我来分享下自己收集的一系列 Chrome 插件，希望能够提高大家的工作效率。
Devtools Terminal
嵌在浏览器中的终端。开发调试利器！
LiveReload
集成 LiveReload 官方应用（Mac 和 Windows）以及 guard-livereload、yeoman 等第三方工具。帮助开发者快速构建 Web 应用。
BrowserStack Local
本地测试工具，借助它可以快速完成本地 / 内部服务器配置和测试工作，以及 HTML、CSS、JavaScript 静态文件的配置和测试。用 BrowserStack 提供的安全、便捷的云服务，在 700 多个真实的桌面系统和移动浏览器中，测试应用的布局、工作流和交互性。
JSONView
用来验证和查看 JSON 文件。
Postman
接口调试工具。接口编写、调试、文档撰写过程使用它能提升工作效率。有 100 多万用户了。
Window Resizer
调整浏览器窗口大小，模拟各种分辨率。帮助 Web 设计师和开发者测试多种分辨率下的布局效果。
WhatFont
识别网页所使用的字体。
Page Ruler
获取任意网页中元素大小、位置信息。
Web Developer Checklist
自己的网站是否符合 Web 设计、开发的最佳实践？对照这份清单，就能很容易发现网站是否有问题。
Image Downloader
查看和下载网页中的图像。
Alexa Traffic Rank
Alexa Internet 为 Chrome 开发的免费网站流量排名查看工具。在不干扰用户访问网站的情况下，给出当前网站的 Alexa 数据。
Eye Dropper
开源拾色器软件，可以从网页、其他拾色器和你用过的颜色中拾取颜色。
Firebug Lite
它可不是用来替代 Firebug 或 Chrome 的开发者工具，而是配合这些工具来使用。你可以像使用 Firebug 那样，用它来查看 HTML、DOM 元素和盒子模型。它还能提供其他比较酷的功能，比如用鼠标查看 HTML 元素，编辑 CSS 属性后能立马看到效果等。
Web Developer
以工具栏形式提供一系列 Web 开发工具， 这是 Web Developer 官方为 Chrome 开发的版本，他们也为 Firefox、Opera 开发了相应插件。
Responsive Inspector
用于查看被访问网站的媒体特性（media query）。开发响应式 Web 布局时，可以直观地显示 CSS 样式表所定义的分辨率的效果。
BuiltWith
用于查看当前网站使用什么技术搭建。
Corporate Ipsum
随机生成企业相关信息，作为占位文本，方便查看布局效果。
User-Agent Switcher
修改用户代理（User-Agent）字符串，以伪装成某些浏览器和操作系统，还可以伪造特定的 URL。
YSlow
分析网页，根据能够提高网页性能的一组规则，提出性能改进建议。
CSS Shapes Editor
在所选中元素上方显示交互式编辑器，用于新建和调整用 CSS 写的图形。
Pesticide
在当前网页插入 Pesticide CSS，为元素添加明显的边框，方便查看元素位置。
Responsive Web Design Tester
测试移动网站在移动设备上的效果。该插件能够模拟不同尺寸、装有不同浏览器的移动设备。
Palettab
安装后，新开一页卡，就能看到 5 种颜色和字体搭配方案！每次点击新页卡，就能有新发现。
jQuery Audit
在元素面板创建侧边栏，显示 jQuery 委托代理事件、内部数据、当前选中的 DOM 节点、函数和对象等信息。
Font Changer
修改包括 Facebook、Twitter、Google、Youtube 在内的任意网站的字体。可以试试 Google Web Fonts 字体的效果。
HTML5 Outliner
使用网页中的标题和分区信息，创建可点击的大纲视图。
PerfectPixel
在页面上显示半透明的图像，便于逐像素对比调整前后的页面效果，以达到最佳水准。
SelectorGadget
有了这个开源工具，为复杂网站的元素生成 CSS 选择器，以及查看选择器所匹配的元素都将变得轻而易举。
Stylebot
快速修改网站样式。
