WEB前端设计师常用工具集锦


Posted in Javascript onDecember 09, 2014

下面是我整理和收集的一些前端开发常用的 插件、工具、软件等不为别的,相当于给电脑做个小备份,至于使用方法,以后我会总结,目前的话还是自行google吧。

【FireFox插件】

1.  Firefbug     ——    页面调式工具

2.  YSlow     ——    网页评级工具

3.  pixel Perfect      ——    HTML与设计稿对比

4.  CSS Usage     ——    CSS使用效率优化工具

5.  Page Speed     ——    快速优化网页类似于YSlow

6.  Measureit     ——    实时测量工具

7.  Fiddler     ——    本地调式页面样式利器

8.  DNS flusher     ——    DNS刷新工具

9.  Colorzilla     ——    实时颜色选取工具

10.  Web Developer     ——    检查网页的相关信息

11.  FireMobileSimulator     ——    模拟手机

12.  JavaScript Dubugger     ——    JavaScript 排错

13.  Greasemonkey     ——    脚本小程序

14.  Firecookie     ——    Cookie

【Chrome插件】

1.  Awesome Screenshot     ——    网页截图

2.  user-Agent Switcher     ——    切换显示设备

3.  web Developer     ——    检查网页的相关信息

4.  Window Resizer     ——    更改分辨率

5.  YSlow     ——    网页评级工具

6.  浏览器兼容性检测

【前端开发常用网址工具】

web色彩搭配

http://www.peise.net/tools/web/

http://www.peise.net/tools/lilun/lilunxuexi.html

http://www.colorschemer.com/online.html

http://www.workwithcolor.com/hsl-color-picker-01.htm

CSS3 生成器

http://www.css3maker.com/

http://www.flickyard.in/autocss3/

http://www.colorzilla.com/gradient-editor/

http://css3pie.com/

http://www.css3.me/

http://ie.microsoft.com/testdrive/Graphics/CSSGradientBackgroundMaker/

CSS3 按钮生成器

http://www.wordpressthemeshock.com/css-drop-shadow/

http://css3buttongenerator.com/

CSS 图片合成器

http://csssprites.com/

http://cn.spritegen.website-performance.org/

CSS代码检查

http://csslint.net/

ajax loading图片

http://ajaxload.info/

http://preloaders.net/

CSS hack表

http://centricle.com/ref/css/filters/

浏览器市场

http://tongji.baidu.com/data/browser

测试浏览器支持CSS3情况

http://css3test.com/

http://kimblim.dk/css-tests/selectors/

http://selectivizr.com/

http://www.findmebyip.com/litmus

检测用户体验

http://gtmetrix.com/

CSS模板生成器

http://blog.html.it/layoutgala/

http://www.mycelly.com/

http://www.intensivstation.ch/en/templates/

CSS压缩

http://www.csscompressor.com/

CSS常用字体

http://cssfontstack.com/

http://www.google.com/webfonts#

http://www.dafont.com/

CSS3 Transform

http://www.useragentman.com/IETransformsTranslator/

CSS3 贝塞尔曲线

http://cubic-bezier.com/#.47,.73,1,.41

YUI CSS grid工具

http://developer.yahoo.com/yui/grids/builder/

JavaScrip代码优化美化

http://js.clicki.cc/

代码演示

http://jsfiddle.net/

http://jsbin.com/#html,live

http://ikeepu.com/bar/20143449

http://codepad.org/

原型图设计工具

https://gomockingbird.com/mockingbird/#

http://www.jotform.com/

【本地及常用软件及IDE编辑器】

1.  MarkMan     ——    设计师,前端工程师必备

2.  VIM     ——    超快的编辑器

3.  Adobe PhotoShop CS6     ——    切图专用

4.  IE Tester     ——    检查页面兼容

5.  Fiddler2     ——    检测请求

6.  Beyond Commpar     ——    文件比较

7.  GIT     ——    分布式版本控制

8.  Opera Mobile Emulator     ——    手机浏览器

9.  SimpLESS     ——    LESS

掌握了以上这些工具中的大部分,恭喜您,离一个优秀的前端设计师不远了~~

Javascript 相关文章推荐
jquery mobile事件多次绑定示例代码
Sep 13 Javascript
JavaScript判断数组是否包含指定元素的方法
Jul 01 Javascript
AngularJS 中的事件详解
Jul 28 Javascript
javascript 将共享属性迁移到原型中去的实现方法
Aug 31 Javascript
文件上传插件SWFUpload的使用指南
Nov 29 Javascript
基于JS设计12306登录页面
Dec 28 Javascript
使用原生js写ajax实例(推荐)
May 31 Javascript
详解js正则表达式验证时间格式xxxx-xx-xx形式
Feb 09 Javascript
Node.js引入UIBootstrap的方法示例
May 11 Javascript
angularjs结合html5实现拖拽功能
Jun 25 Javascript
微信小程序在地图选择地址并返回经纬度简单示例
Dec 03 Javascript
vue使用nprogress实现进度条
Dec 09 Javascript
13 款最热门的 jQuery 图像 360 度旋转插件推荐
Dec 09 #Javascript
JQuery中使用on方法绑定hover事件实例
Dec 09 #Javascript
jQuery实现HTML5 placeholder效果实例
Dec 09 #Javascript
jQuery on方法传递参数示例
Dec 09 #Javascript
jquery实现侧边弹出的垂直导航
Dec 09 #Javascript
基于javascript实现判断移动终端浏览器版本信息
Dec 09 #Javascript
使用jQuery实现星级评分代码分享
Dec 09 #Javascript
You might like
用来给图片加水印的PHP类
2008/04/09 PHP
PHP HTML代码串截取代码
2008/12/29 PHP
php mysql 封装类实例代码
2016/09/18 PHP
mac下多个php版本快速切换的方法
2016/10/09 PHP
记录Yii2框架开发微信公众号遇到的问题及解决方法
2018/07/20 PHP
解决在laravel中leftjoin带条件查询没有返回右表为NULL的问题
2019/10/15 PHP
PHP基于进程控制函数实现多线程
2020/12/09 PHP
体验js中splice()的强大(插入、删除或替换数组的元素)
2013/01/16 Javascript
jquery 取子节点及当前节点属性值
2014/07/25 Javascript
JavaScript定义变量和变量优先级问题探讨
2014/10/11 Javascript
jquery ajax 如何向jsp提交表单数据
2015/08/23 Javascript
jQuery获取与设置iframe高度的方法
2016/08/01 Javascript
BootStrap 模态框实现刷新网页并关闭功能
2017/01/04 Javascript
浅析 NodeJs 的几种文件路径
2017/06/07 NodeJs
jQuery实现每隔一段时间自动更换样式的方法分析
2018/05/03 jQuery
vue-cli2打包前和打包后的css前缀不一致的问题解决
2018/08/24 Javascript
JavaScript中的连续赋值问题实例分析
2019/07/12 Javascript
小程序接口的promise化的实现方法
2019/12/11 Javascript
jQuery实现移动端笔触canvas电子签名
2020/05/21 jQuery
js实现html滑动图片拼图验证
2020/06/24 Javascript
Vue实现腾讯云点播视频上传功能的实现代码
2020/08/17 Javascript
python中将阿拉伯数字转换成中文的实现代码
2011/05/19 Python
Python读取和处理文件后缀为.sqlite的数据文件(实例讲解)
2017/06/27 Python
Python实现操纵控制windows注册表的方法分析
2019/05/24 Python
200行python代码实现贪吃蛇游戏
2020/04/24 Python
python查看矩阵的行列号以及维数方式
2020/05/22 Python
Python 爬虫批量爬取网页图片保存到本地的实现代码
2020/12/24 Python
Wojas罗马尼亚网站:波兰皮鞋品牌
2018/11/01 全球购物
Linux不知道文件后缀名怎么判断文件类型
2014/08/21 面试题
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
企业门卫岗位职责
2013/12/12 职场文书
会计电算化毕业生自荐信
2014/03/03 职场文书
电子商务专业自荐信
2014/06/02 职场文书
2015年营销工作总结范文
2015/04/23 职场文书
Requests什么的通通爬不了的Python超强反爬虫方案!
2021/05/20 Python