对于网页设计人员或网站开发者来说,更喜欢使用像FF的此类浏览器,原因是其具有强大的辅助插件,可以帮助网页制作与开发提高效率,那么同样对于Google Cchrome浏览器来说也是具有大量的此类插件,本文收集了一些针对Google Cchrome浏览器进行网页制作开发的插件工具。可以有效提高网页设计师或前端开发者的工作效率。

无论是Firefox还是Google Chrome,其强大的扩展都是吸引我们最大的原因之一。下面介绍的是网页设计和网页开发人员会经常用到的32款 Google Cchrome 扩展。

1. FireBug Lite

Firefox有个非常出名的扩展——FireBug,Firebug Lite 就相当于Firefox的FireBug,可以即时预览到编辑、修改 CSS, HTML 和 JavaScript的效果。

2. Resolution Test

Resolution Test 可以修改浏览器窗口的分辨率,从而让网页开发人员能够即时预览页面在不同分辨率下面的表现情况。

3. Speed Tracer

Speed Tracer 可以对网页中的元素进行全方位的检测分析,帮你找出网页运行缓慢的因素,以方便网站开发者优化代码,目前可在windows 和 Linux 两种操作平台下面运行。

4. Web Developer

Web Developer 可以在浏览器工具条上集成多种网页开发工具,是网站开发人员最常用的 Google Chrome 扩展之一。安装Web Developer 扩展之后会在浏览器工具栏添加一个图标,点击图标就可以看到很多的网页开发工具。

5. Pendule

这个插件功能和FireBug很像,安装 Pendule 扩展后可以对 Google Chrome 内置的开发者工具进行扩充。

6. Aviary Screen Capture

Aviary Screen Capture 是由 Aviary.com 提供的一个截屏扩展。安装 Aviary Screen Capture 扩展后可以对当前浏览器可见内容进行截屏,然后跳转到Aviary.com 提供的在线图片编辑页面进行编辑,编辑完成后再保存到本地电脑。

7. Chrome Web Developer Tools

Chrome Web Developer Tools和FireFox Web Developer很像,和Firefox Firebug的功能接近。

8. Chrome Sniffer

Chrome Sniffer 可以帮助开发者检查网页在运行时的框架/CMS和javascript库的情况,在检测框架时,地址栏会出现一个图标。

9. Lorem Ipsum Generator

可以产生随机的文本。

10. PlainClothes

PlainClothes可以让你对网页随意进行样式定义,甚至禁用样式。同样,你也可以让文字内容在任何页面都自动按照你设定的样式进行呈现(在“选择”>“Under the Hood”>”改变字体和语言”里设置)。

11. Internet Explorer Tab

在某些必须使用IE的情况下,这个插件会非常有效。

12. Chrome SEO

Chrome SEO是目前最全面的Chrome SEO扩展。安装Chrome SEO扩展后,你在访问一个网页的时候,可以按照不同分类看到相关的SEO实用参数,包括各个搜索引擎的索引数量、反向链接、流量和排名、被各个书签服务所收藏的次数、被缓存的版本、域名信息(DNS、Whois、IP等),全部显示在扩展按钮的弹出菜单里。

13. SEO Site Tools

SEO Site Tools这个 Google chrome 扩展可以校验CSS代码、HTML代码,以及监测Gzip压缩情况等基本的SEO资料,可以鼠标右键取消该功能。

14. META SEO Inspector

可以用来检查网页的meta属性,并且可以监测no-follow链接属性。

15. Validity

Validity可以使网页在地址栏中快速运行。 只要点击地址栏上的图标就可以激活当前页面。页面的错误量也可在浏览器工具栏中看见。

16. Eye Dropper

Eye Dropper 扩展可以允许用户从当前页面中的任何一个像素提取颜色代码,当然扩展本身也自带了一个很好用的调色板。

17. Color Picker

颜色拾取器,可以快速获取颜色的Hex 和 RGB值。

18. Image Cropper

Google chrome 浏览器的截图扩展。

19. Webpage Screenshot

网页截图扩展,可以把整个页面完整截屏。

20. Picnik

可以让用户非常轻松的编辑在浏览网页过程中看到的图片。在网页加载完之后,点击Picnik按钮,用户将能够获得网站图像的缩略图列表。点击这些缩略图,图像将在Picnik打开,用户可以进行编辑、注释和共享等。

21. MeasureIt!

和Firefox的 MeasureIt! 扩展一模一样的功能,可以测量页面上任何内容的宽度和高度。

22. Pixlr Grabber

Chrome的众多截屏扩展之一。既可以对当前正在浏览网页的可视部分进行截屏,也可以对当前正在浏览网页指定区域进行截屏,更多为数不多可以对整个网页进行截屏的扩展之一。

23. Domain Availability Checker

可以快速监测域名是否被注册。

24. Snippy

可以抓取页面中的部分内容,然后保存下来,供将来只用。最强大的功能在于它可以抓取丰富的内容,并保留格式。所以你用它来抓取文字、图片,链接等诸多格式的内容,并可以保留到Google Doc 上。

25. FlashBlock

FlashBlock 可以阻止所有的flash内容载入。等网页载入后你可以点击选择载入flash,或者是下载flash。

26. Built With Technology Profiler

Built With Technology Profiler这个插件可以帮你识别出当前页面都是用了哪些技术。

27. LastPass

LastPass是一个免费的密码管理扩展和表格填写扩展,让你上网冲浪更便捷。

28. iMacros

如果你喜欢使用网页浏览器,但是每天重复性访问相同的网站,让你感到非常的厌倦,如果填写表格,忘记密码,那么iMacros能帮助你解决这个问题的!iMacros自动化的设计是在网络上最重复性的任务。无论你对Firefox做什么,iMacros可以自动执行它。网络设计人员可以使用的功能测试和回归测试网页的Web应用软件。

29. Chrome Flags

Chrome Flags功能是将正在访问的服务器所在国家的国旗显示在地址栏上。

30. Frame Two Pages

Frame Two Pages能让你在同一个 Chrome 标签中查看两个标签页面的内容,在进行网页对比的时候非常有用。

31. Split Screen

Split Screen和Frame Two Pages有点像,可以将 Chrome 的一个标签分为两个页面,并且可以在每个页面中显示不同的网页。

32. Session Buddy

Session Buddy是一个进程管理扩展,支持保存和查看当前进程,还能显示、更新进程快照,支持崩溃恢复。

32款网页设计和网页开发人员常用的Google chrome浏览器扩展程序相关推荐

  1. WEB网页设计前端(前台)开发的常用工具推荐

    WEB网页设计前端(前台)开发的常用工具推荐 最近我在搞网页设计,包括网站建设的前台界面设计和JS代码的编写,弄一个JS的时候把我给郁闷了,在寻找JS如何通过子节点操作父节点的时候找到了以下免费的网站 ...

  2. 教你玩转HTML(html5)h5网页设计,网站开发-刘青-专题视频课程

    教你玩转HTML(html5)h5网页设计,网站开发-54965人已学习 课程介绍         教你玩转HTML(html5)h5网页设计,网站开 课程收益     教你玩转HTML(html5) ...

  3. 网页设计师和网站开发人员之间的区别是什么!

    前端网页设计 网页制作 网站开发 这些你也可以叫做3个网站建设的核心部分.下面一一分析: 前端网页设计师 前端网页设计师,这在我看来,他将负责网站的整体规划.布局和网站特效的渲染工作,包括视觉上的效果 ...

  4. 《网页设计与前端开发 Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript 从入门到精通》—— 第1章 网页设计基础知识...

    本节书摘来异步社区<网页设计与前端开发 Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript 从入门到精通>一书中的第1章,作者: 何新起 , 任 ...

  5. 【Google】【内部样式表】【外部样式表:听力地点方向题】【设置字体间距】【多类、子元素选择器】【网页设计与网站开发HTML、CSS、JavaScript】【第 8 章】CSS基础——实验题1-6

    以下为本人大一选修课<网页设计与网站开发>的实验作业题,均为本人原创,分享给大家.如有不足之处欢迎指出. 目录 实验1 1.题目 2.代码 3.网页运行效果 实验2 1.题目 2.代码 3 ...

  6. 【JavaScript编写计算工资小程序】【表格细边框设置】【网页设计与网站开发HTML、CSS、JavaScript实例教程】【第十章】JavaScript基础——【传智播客】实验作业题【实验5】

    以下为本人大一选修课<网页设计与网站开发>的实验作业题,均为本人原创,分享给大家.如有不足之处欢迎指出. 1.题目: 实验5.新建页面test5.html,利用JavaScript编写如下 ...

  7. 【简答网页】【网页进阶】【网页设计与网站开发HTML、CSS、JavaScript】【第 8 章】网页基础与工具使用1——实验作业

    以下为本人大一选修课<网页设计与网站开发>的实验作业题,均为本人原创,分享给大家.如有不足之处欢迎指出. 目录 (一).简单网页 (二).网页进阶 注: 若有图片文件,图片文件建议保存到根 ...

  8. 【单选按钮区域实现三选一】【2018腾讯手游排行榜】【HTML表格标签】【网页设计与网站开发HTML、CSS、JavaScript】【第七章】表单——实验作业题【实验3、4、5】

    以下为本人大一选修课<网页设计与网站开发>的实验作业题,均为本人原创,分享给大家.如有不足之处欢迎指出. 目录 1.实验3 题目 代码 实验效果 2.实验4 题目 代码 实验效果 3.实验 ...

  9. 爱尚实训html入门基础篇,爱尚实训网页设计与网页制作的区别

    爱尚实训网页设计与网页制作的区别 网页设计是将策划案中的内容.网站的主题模式,以及结合自己的认识通过艺术的手法表现出来而网页制作通常就是将网页设计师所设计出来的设计稿,按照W3C规范用html语言将其 ...

最新文章

  1. python 替换字符串的方法replace()、正则re.sub()
  2. GO语言教程2:使用VS code进行go语言的编写和运行
  3. 汇编实验4.1文件代号下的文件管理中为什么buf_size为80而buf可以容纳200个字节,矛盾吗?(不矛盾)
  4. dos定义变量算术运算逻辑运算表达式分隔符
  5. PHP 自学教程之MySQL数据库
  6. C语言内存/指针相关
  7. ASP.NET MVC应用程序把文字写在图片上
  8. SQL不重复查找数据及把一列多行内容拼成一行
  9. mac怎么看cpu温度?教你不装软件查看 Mac CPU芯片温度
  10. 计算机毕业设计java+SSM网上购物超市网站(源码+系统+mysql数据库+Lw文档)
  11. resnet34\resnet101网络结构图
  12. python rpc框架对比_RPC简介及框架选择
  13. 目标检测综述学习笔记
  14. ATC52 学习记录
  15. 欧拉恒等式:数学史上的真正完美公式!
  16. 崩坏3服务器修改水晶数量,崩坏3半年不氪金能攒多少水晶 半积年攒水晶数量详情...
  17. 破解webshell方法~
  18. 正则表达式贪婪模式、懒惰模式与独占模式浅析
  19. Android闹钟服务AlarmManager
  20. 如何将CAD图纸由DWG格式转换成PDF格式?

热门文章

  1. 我的世界java版粘土服务器ip,我的世界clay粘土
  2. 强化学习 --- 概述
  3. antv x6画布内容居中
  4. java 输出流转换成输入流_在JAVA中如何将输出流转为输入流的类的实现
  5. 关于加减运算时能否使用等价无穷小的问题
  6. 用ARM进行汇编语言编程(3)逻辑移位和轮换,条件与分支
  7. Python 练习实例5 题目:输入三个整数x,y,z,请把这三个数由小到大输出。
  8. 拉结尔微信好友不同服务器,拉结尔大区互通介绍 玩家轻松跨区组队打怪
  9. 老子《道德经》第六十三章
  10. 小程序开发.微信小程序.组件.视图容器