当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > Webjx收集:Web前端开发常用工具汇总

心得技巧
网站最需要的是提升目标用户群的体验
网页排版中10种致命的语义错误
宽高自适应的九宫格背景图片切割分析
网页设计技巧:网页中英文混排行高问题
网页配色举例分析:绿色配色网页分析
网页设计教程(3):设计步骤及思考
网页设计教程(4):关于素材和言志
window.name解决跨域数据传输问题
阿里巴巴中秋logo结合网页的设计过程
网页设计教程(8):网页层次和空间设计
网页设计中的栅格系统
面向未来的全方位Web设计:渐进增强
论视觉设计与交互设计
设计理论:论方案与资源、沟通的问题
英文文章:用页面空白改进用户界面
网页设计中使用图标支持内容的最佳做法
网站作品欣赏:春意盎然美妙感受网站
垂直栅格和渐进式行距应用举例
网页设计师也要学习网页代码编写
启发设计灵感发光有光泽的网站设计实例

心得技巧 中的 Webjx收集:Web前端开发常用工具汇总


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-01   浏览: 143 ::
收藏到网摘: n/a

1,IE网页调试插件

IE Developer Toolsbar

IE下的FireBug.HTML及CSS调试工具

http://www.windowsmarketplace.com/details.aspx?itemid=2695980

Microsoft Script Debugger

Companion.JS 需要安装Microsoft Script Debugger才可

Companion.JS

IE下的javascript调试工具.

http://www.my-debugbar.com/wiki/CompanioNJS/HomePage

SuperPreview

主要用于html、css的调试和各个浏览器(目前只能针对IE6-IE8)的页面呈现测试

http://download.microsoft.com/download/5/6/8/568F0D28-0434-4794-B7FC-FB293BCC98FB/SuperPreview_Trial_en.exe

IETester-同时拥有IE6、IE7、IE8(Vista兼容)

http://www.my-debugbar.com/wiki/IETester/HomePage

2,firefox网页调试插件

FireBug


Firebug 是Firefox下的一款开发类插件,现属于Firefox的五星级强力推荐插件之一。它集HTML查看和编辑、Javascript控制台、网络状况监 视器于一体,是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀,从各个不同的角度剖析Web页 面内部的细节层面,给Web开发者带来很大的便利。

https://addons.mozilla.org/en-US/firefox/addon/1843

Web Developer

Web Developer 可说是网页设计师最常使用的一个 Firefox 扩充套件,它可以协助我们在设计网页时能够更加的得心易手,内建 HTML、CSS、Feed…等检验器,让我们所设计出来的网页能够符合标准化,不但可以省下日后维护的时间金钱,更能确保我们所设计出来的网页在各家不 同的浏览器,均能正常地显示,且是符合我们预想的成果。其它更有取消 CSS、取消 Java、取消 JavaScript、检视或清除 Cookies…等功能。

CSS — 可编辑当前页面的CSS,并可即时显示修改效果。
Forms — Get/Post转换,显示所有表单信息。
Images — 显示图片的各种属性,可找出未设置Alt,Title等属性的图片。
Information — 最有用的两个功能:查看Cookie信息和Http Response数据,Web调试必备
Micellaneous — 最有用的功能:Clear Session Cookie。 已往调试Web,为了新开一个Session,不得不关闭IE,重新再开,现在不用啦。
Outline — 框出Table元素,Cell元素,Div元素
Resize — 模拟800*600等窗口大小,可自定义窗口大小
Tools — 验证CSS/HTML 等
View Source — 显示带关键字颜色的漂亮源代码

https://addons.mozilla.org/en-US/firefox/addon/60

YSlow

why slow 页面性能优化查看器.基于FireBug

http://developer.yahoo.com/yslow

Javascript Debugger

FireFox下的javascript调试工具,比FireBug有更强大的调试功能.

https://addons.mozilla.org/en-US/firefox/addon/216

Opera Developer Tools

3,其它工具

Opera下的DOM,CSS查看工具,类似FireBug.

http://dev.opera.com/articles/view/opera-developer-tools/

webkit

Safari下的开发调试工具

http://nightly.webkit.org/

Fiddler

一个很强大的http流查看工具

http://www.fiddlertool.com/fiddler/

Httpwatch

数据分析工具,头消息接受/发送的查看,POST数据查看.等等

http://www.httpwatch.com