我的浏览器中安装了大约30个扩展程序，可简化生活并在Internet上工作。 在本文中，我想为开发网站时经常使用的排字机共享10个相关的Google Chrome扩展程序。
1. PerfectPixel
在www.wrike.com上开发新块时使用PerfetPixel的示例
站点到像素的布局给初学者和有经验的专业人员都造成了麻烦。 PerfectPixel将布局图像覆盖在浏览器中的布局顶部。 在扩展设置中，您可以调整布局的透明度和布局，从而可以考虑所有必要的尺寸和缩进。 使用此插件将简化布局，并减少提交项目时的编辑次数。 在我的扩展集中， PerfectPixel因其功能和可用性而位居第一。
链接以安装扩展
2. Wappalyzer
Wappalyzer案例研究，网址为collaborate.wrike.com/2019/london
在站点上使用什么工具和技术总是很有趣的。 Wappalyzer提供有关CMS，JS框架，CSS库，分析工具等的信息。 想象一下，该网站上的动画是一个免费的CSS库，您可以在项目中使用它。 这将减少必要工具的搜索时间，并了解该站点使用的技术。
链接以安装扩展
3. HTML5大纲视图
标题层次结构， 网址为habr.com/en/company/wrike
HTML 5 Outliner在网站页面上显示标题列表。 该扩展有助于构造标题并识别层次结构中的违例。 例如， HTML 5 Outliner在部分标签中显示有关h2标签缺失的警告。 这是确定布局中标题正确使用的快速便捷的方法之一。
链接以安装扩展
4. Wireframify
www.wrike.com上的 Wireframify案例研究
设计师使用线框（一组线，块和签名）设计站点。 这种方法使您可以根据页面上块的缩进，大小和位置来创建项目体系结构。 Wireframify包括线框形式的站点的另一种形式，这将有助于避免错误使用：
- 负保证金；
- 使用填充对齐元素；
- 使用CSS属性左右缩进；
链接以安装扩展
5. PageLiner
PageLiner案例研究， 网址为www.wrike.com/apps
在图形编辑器中，您可以使用基准线对齐元素或显示站点网格。 排版人员可以使用PageLiner在浏览器中启用此功能。 该扩展程序显示与相同的Adobe Photoshop中类似的指南。 使用PageLiner，对齐元素要容易得多。
链接以安装扩展
6. Web开发人员
Web开发人员功能列表
Web Developer向浏览器添加了其他工具栏。 其中有10个标签：“禁用”，“ Cookie”，“ CSS”，“表单”，“图像”，“信息”，“杂项”，“轮廓”，“调整大小”和“工具”。 扩展功能使您可以：
- 禁用CSS，JS和图像；
- 检查HTML，CSS的有效性；
- 操作CSS样式；
- 测试HTML表单
- 显示必要的信息元标签；
- 调整浏览器窗口的大小
- 清除缓存；
Web Developer仍然是开发人员中流行的扩展。 可以将其与现实生活中的多功能工具进行比较：您始终拥有必要的工具集。
链接以安装扩展
7.用户CSS
用户CSS示例， 网址为www.wrike.com/customers
假设您想直接在浏览器中修复CSS，但是之后必须重新加载页面。 您所有的成就都消失了，您必须再次进行更改。 使用User CSS ，这将保存您的样式。 不用担心CSS消失了。 该扩展程序的功能将允许您在移至其他页面时测试编写的CSS。
链接以安装扩展
8. StyleURL
Wrike上StyleURL的案例研究www.wrike.com/customers
用户CSS不会取代浏览器开发者面板。 如果您习惯使用devtools，并且同时又不想在更新浏览器后丢失更改，请安装StyleURL 。 该扩展将记住您的更改，并提供将工作保存在单独的文件中或上传到github gist的功能。
链接以安装扩展
9.网站改进的辅助功能检查器
网站改进了辅助功能检查器案例研究， 网址为www.wrike.com/newsroom
Siteimprove可访问性检查器是一种工具，用于检查HTML是否符合可访问性标准，以便为所有人提供对内容的访问。 该扩展程序显示错误以及详细信息。 在他们的描述中，您可以找到WCAG 2的脚注，并直接链接到有关辅助功能的详细文章。
链接以安装扩展
10.标签书
标签簿示例
每个人都以自己的方式使用书签。 有些人保存了用于快速访问站点的链接，而有些人则使用书签来存储有用的信息。 使用Tabsbook，您可以将书签变成知识库。 扩展界面显示了树状文件夹结构，可轻松导航书签。 所有数据都存储在云中，这使您可以从任何设备访问它。
链接以安装扩展
扩展将对所有不了解扩展程序的初学者和经验丰富的专业人员很有用。 在注释中写下您使用的扩展名。
在设计师专用的Chrome插件的前10个链接和程序员专用的实用的Google Chrome扩展的十大链接中，可以找到更多有用的浏览器扩展。