堂主 - WEB前端开发

专注于互联网 | WEB前端开发 | 以用户为中心的体验 | 家是圆心 | Code is art !

前端工具

Tags : 工具

来自自身收集及网上资源整理,从实用性的角度进行了取舍,不是见一个列入一个。另外常见(如DW)的并未列入其中。

下面的链接,部分不是指向其官网,而是链接向相关原创博文的链接。目的即是能使用户直观了解其使用方法,也是支持原创优质博文。

编辑器软件
名称 文章
Eclipse http://url.cn/3TH4qO
Aptana http://url.cn/37IdA5
VIM http://url.cn/1Fkv8C
Notepad++
QuickText
http://url.cn/33bknc
原型设计
名称 文章
Axure RP http://url.cn/3RTdAx
UIDesigner http://url.cn/3B6HCf
Balsamiq Mockups http://url.cn/31GCaN
OmniGraffle http://url.cn/2A0V2Q
PC端实用小工具
名称 介绍
MarkMan UI标准的神器
Dorado CDC出品的UI标注工具
CSS Sprites
样式生成工具
鬼哥出品,目前最新版本为3.2.1。查看帮助文档
屏幕取色器 堂主自用的一款小巧的屏幕取色软件
Adesclrpicker 一款无广告的取色器
TakeColor 取色+测距
FastStone Capture 集合版桌面辅助工具
mergeCSS 鬼哥出品样式合并工具,最新版v1.9.20110301
Web2.0Tool 国人出品的JS/CSS压缩工具
PC端浏览器模拟工具
名称 介绍
IETester 不多介绍了
SuperPreview 微软出品的IE集成调试工具,且不仅仅如此
浏览器插件
名称 介绍
验证 FireBug 不多介绍了
YSlow Yahoo出品的页面性能检测工具
Page Speed Google出品的页面性能检测工具
Chrome 右键 -- “审查元素”
IE IE Developer Toolbar 微软推出的IE中调试工具
Script Debugger 微软出的针对IE的JS调试工具,不稳定
MS Script Editor Office自带的JS调试工具
Msfast MySpace针对IE的开源测试插件
Safari 1) 设置 - 偏好设置 - 高级 - 勾选“在菜单栏中显示‘开发’菜单”
2) 后菜单 - 开发 - 显示WEB检查器
Opera 右键 - 检查元素
在线前端应用工具
名称 介绍
验证 验证HTML http://validator.w3.org/
验证CSS http://jigsaw.w3.org/css-validator/
验证XHTML http://validator.w3.org/
验证HTML5 http://html5.validator.nu/
验证XML 前去w3school在线验证页面(仅限IE)
验证WML 前去w3school在线验证页面(仅限IE)
压缩 PNG压缩 http://www.punypng.com/
HTML压缩 http://tool.chinaz.com/Tools/JsFormat.aspx
CSS压缩/格式化 http://www.osmn00.com/tools/cssZip.html
JS压缩 http://www.css88.com/tool/ysjs/
JS格式化 http://jsbeautifier.org/
ProtoFluid 用于模拟多款移动终端设备的浏览体验
GTmetrix 对网页同时进行 Page Speed和YSlow的检测考评
CSS3 ST CSS3 Selectors Test - 检测当前浏览器支持多少CSS3选择器
HTML5 Test 在线检测当先浏览器对HTML5的支持情况
CSS TW CSS Text Wrapper 在线创建文本围绕不规则形状。视频