【.com快译】谷歌浏览器无疑是世界上最流行的浏览器之一。如今，GoogleChrome的用户数量远超Mozilla、Firefox、Safari、Opera和MicrosoftEdge等主流浏览器。在短短十多年的时间里，谷歌浏览器成功占据了全球65%以上的市场份额。Chrome迅速崛起的一个关键因素：其庞大的扩展库。然而，面对这些复杂的扩展包，用户难免会产生“选择恐惧症”。在本文中，我们将重点介绍17个适用于Web开发人员和设计人员的Chrome扩展程序，希望它们能提高您的工作效率。1.ColorZilla-颜色选择器和生成器ColorZilla是八年前推出的，它是历史悠久的颜色选择器扩展包之一。ColorZilla使用户能够从浏览器上的任何像素获取颜色读数，并将它们以RGBHEX格式粘贴到任何程序中。与下面提到的SitePalette类似，ColorZilla还允许用户生成渐变色并从任何网站提取调色板。该扩展还维护用户最近选择的颜色的历史索引。2.SitePalette-PaletteGenerator如果您在目标网站上发现了漂亮悦目的颜色组合，这个小插件可以帮助您快速提取并生成相应的调色板。同时，SitePalette还允许您直接从网站下载各种预览调色板图像、PDF文件，并生成可共享的链接。此外，SitePalette还可以与coolers.co和GoogleArtPallete无缝集成。3.FontFaceNinja-字体标识符过去，开发人员需要通过检查Chrome开发工具中的元素来找出当前使用的字体名称。现在，他们可以依靠FontFaceNinja来识别网页上使用的各种字体。目前，FontFaceNinja的下载量已超过280,000次。使用扩展就像将鼠标悬停在需要识别的任何网页文本元素上一样简单。它的弹出窗口将显示字体的相应名称，以及一个小的预览窗口。从这里，您可以为您最喜爱的字体添加书签并保存以备日后重用。4.Marmoset-代码快照生成器有时，网页设计师和开发人员可能需要创建代码快照，以达到某种审美效果，或某种项目目的。Marmoset允许您通过单击创建各种代码的快照。此服务功能对于设计一些社交媒体帖子或作品集网站非常有用。5.LambdaTest截图——跨浏览器测试的扩展作为应用开发者，我们经常需要对网站应用进行各种浏览器类型的测试，以确保应用在各种平台上都能友好显示。但是，如果我们通过VMware及其相应的设置来安装多个浏览器和平台，往往是一项繁琐的工作。现在，LambdaTest提供了一个基于云的平台，用户可以针对不同设备对2000多种真实浏览器及其版本进行各种跨浏览器测试，从而保证目标网站的兼容性和显示效果。对于桌面设备，您可以在Windows和macOS上进行测试；对于移动设备，您可以在Android和iOS上进行测试。LambdaTest是Chrome的一个扩展，可以帮助用户批量执行自动截图测试。您可以同时在25台设备上执行屏幕截图测试。一旦发现任何UI异常，您可以通过其项目管理工具将相应的错误信息分享给您的同事。6.PageRuler-大小和大小检查器PageRuler帮助Web开发人员快速检测页面上任何元素的大小和位置。用户可以使用此扩展在屏幕上使用标尺绘制图形，以检查单个元素的长度、宽度、高度和位置。7.Dimensions–Dimensions&SizeInspectorDimensions帮助测量网页上不同元素之间的距离。用户可以实时测量鼠标指针某一点到其边界的向上、向下、向左、向右的距离。因此，该工具可以测量图像、输入字段、按钮、视频、GIF、文本和图标之间的距离。另一个Dimensions功能：如果您的设计师将Jpeg或PNG格式的页面设计模型（mockups）交给您，Dimensions将确保您以合适的尺寸适应Chrome并运行它。当然，您唯一需要注意的是Dimensions不一定适用于所有图像格式。8.CheckMyLinks-BrokenLinkCheckerCheckMyLinks“抓取”整个目标页面，验证每个链接，并报告其有效性。用户只需单击一下即可将这些损坏的链接复制到剪贴板。可以看出，CheckMyLinks可以帮助用户识别和更正有效页面上的任何损坏链接，这对于网站的搜索引擎优化(SEO)和避免Google的网站爬虫对错误的惩罚至关重要。9.ClearCacheClearCache有助于清除页面上的缓存，以及浏览的数据，并且不需要用户响应任何弹出窗口、对话框或Chrome的设置窗口。此外，用户可以通过扩展选项细粒度自定义清除数据，包括：应用缓存、cookie、下载、文件系统、表单数据、历史记录、索引数据库、本地存储、插件数据、密码和WebSQL，等。您可以一次删除所有全局cookie，或只删除特定域的cookie。10.Wappalyzer-SiteAnalyzer(TechnicalIdentifier)在看到一个很酷的网站时，热爱技术的开发者主要关注的是该网站采用了哪些前卫的技术和实现方式。Wappalyzer是ElbertAlias于2009年创建的跨平台工具，以Chrome扩展程序的形式向用户揭示目标网站使用的技术名称。它可以自动检测1000多种技术，包括：各种建站器、框架、软件库、插件、CMS、数据库、服务器软件、小部件和分析工具。11.Ghostery——隐私工具Ghostery是一个隐私扩展工具，可以消除目标网站的弹窗广告，通过内置的广告拦截器跟踪和保护用户数据，进而防止第三方工具被跟踪。此外，它还自带自定义仪表盘，方便用户查看被屏蔽的相关信息。12.JSONViewer–JSON美化和查看器如果你在网页中广泛使用过各种API，尤其是RestFulAPI，以及JSON数据的相关内容，那么JSONViewer将有助于将JSON文件显示为具有更可读的树状缩进格式.13.WindowResizer-ScreenSizeMockup作为响应式设计代码的扩展工具，Resizer可以模拟所有流行设备的任何屏幕尺寸和分辨率。这对于在不同屏幕尺寸上测试布局和验证响应式媒体查询是否按预期工作很重要。但是，WindowResizer只能调整窗体的大小，让用户了解网站在不同屏幕尺寸下的显示效果。为了更准确和全面的响应测试，用户需要使用真实的移动浏览器进行验证。14.SessionsBuddy-Tab/SessionManager对于使用慢速系统的开发者来说，在处理多个选项卡时难免会出现持续卡顿的情况。因此，用户在丢失打开的标签页和处理StackOverflow问题时需要高效的标签页管理。SessionsBuddy提供了一个界面简单的书签管理器。它可以帮助用户保存他们的会话并在他们稍后打开浏览器时恢复它。因此，您无需担心在浏览器窗口异常关闭或系统崩溃时丢失您的会话。15.CSSViewer–CSS属性查看器CSSViewer可以提取窗口或源代码中所有有价值的CSS属性，并将它们显示在其浮动窗口中。当您将鼠标悬停在目标网页上的某个元素上时，CSSViewer将在浮动窗口中列出所有关键的CSS属性，包括：字体、字体大小、文本系列、粗细、行间距、对齐方式、颜色、背景、字符框高度、宽度、填充、边距、位置、效果和其他杂项。16.EditThisCookie-Cookie管理器EditThisCookie是Chrome扩展库中最受欢迎的cookie管理器之一，拥有超过270万用户。此工具允许您添加、删除、搜索、编辑、阻止和保护（只读）cookie。此外，您还可以导入JSON或cookies.txt格式的cookie。17.WebDeveloper-WebDevelopmentKit此扩展在浏览器中添加了一个工具栏，其中包含完整的Web开发工具包。该工具分为10个单独的选项卡，它们是：禁用、Cookies、CSS、表单、图像、信息、杂项、大纲、大小调整和工具。这些工具的功能包括：禁用Javascript、插件、弹出窗口、cookie管理器、CSS属性查看器和编辑器、表单和图像操作、窗口调整器、缓存管理、页面标尺和属性检查器等。原标题:2019年面向Web开发人员和设计师的17个Chrome扩展程序，作者：NikhilTyagi
