Web开发实用浏览器(IE, Firefox ) 插件(工具)

http://hi.baidu.com/fangkaiming/blog/item/02cdd4b70b6dd2f630add146.html

介绍2款前端小工具【取色工具和量距离工具】

1.取色工具——TakeColor

2.量距离工具（像素）

介绍下载请参见： http://www.css88.com/article.asp?id=483  

http://www.wincatalog.com/download/getcolor_inst.exe

JavaScript调试器VenKman【firefox 插件】

ColorfulTabs： 让firefox 的tab加上颜色，视觉效果不错！

DownthemAll：让你很轻松的下载浏览的网页资源

firebug ：http://releases.mozilla.org/pub/mozilla.org/addons/1843/firebug-1.2.0-fx.xpi

IE Tab：把firfox临时变成ie，用ie来显示页面，避免一些网站显示错乱或显示不出来

JS View：很好用，直接可以用它查看到浏览的网页引用到的js文件和css文件

Live  HTTP headers：查看http头的信息

RemindFox：备忘录

Web developer：页面设计的好帮手

All-in-one Sidebar：提供一个方便的侧边栏

Piclens：一个相当牛，相当炫的东东，可以直接搜索一些网站的图片新闻，视频等用3D的炫效果展示出来。

26.IE WebDeveloper V2.3.2.108 ： 点击下载

Internet Explorer Developer Toolbar

一款用于IE浏览器的插件，允许直接地在浏览器窗口中浏览、传输和更新HTML DOM。该软件可以实时分析网页并且显示为一种允许你察看表格风格、Java脚本，表格以及其它网页元素的树形风格。该软件还可以在浏览器中交互式地突出显示被选择的网页元素，因此你可以在实际网页中定位其代码

其详细介绍见：IE DOM查看工具,IE Web Developer V2 破解版本

注册码:88ZWT-71C2D4E621BD3D4A

25.IETester-同时拥有IE6、IE7、IE8（Vista兼容）

具体参见： http://www.css88.com/article.asp?id=361

虽然以前我写过IE6、IE7、IE8共存的解决方案，但是看到IETester这个软件以后那些都已经没有意义了（那些办法副作用比较大，而且实现起来有些难度）。使用IETester能够较好的解决，测试网页兼容性的多IE版本的需求。暂时已经支持IE5.5——IE8beta1，我想这已经足够了。还在苦苦找寻IE6和IE7共存或者IE7和IE8共存的朋友，可以试试这个软件。当然这个软件也不是万能的，在最后，官方非常厚道的给出了暂时存在的重要bug列表。

推荐理由：

1同时拥有IE 5.5、IE6、IE7、IE8

2.常用的IE6绿色版不能在Vista上使用

二十四 搜索引擎——百搜吧（ http://www.baiso8.com ）

直接搜索网址： http://www.baiso8.com/

http://www.baiso8.com/so/baiso.htm

做我们这行搜索少不了，碰到有什么问题就要马上google或者百度一下，找一些相关的资料。读书那会有问题就跑图书馆，工作之后就用搜索，不过有些时候google搜不到，又得用百度，要搜图片什么的还要点来点去麻烦，做这行效率是很关键的，提高效率、节约生命嘛！
发现一个很好的网站：百搜吧。输入一次关键字能同时搜索百度、谷歌、雅虎三大搜索引擎及国内知名网站和专业网站的资源，具备根据您自己的需要自定义搜索引擎偏好，随时切换网页、电影、新闻、娱乐、图像、音乐、视频、论坛、博客、词典等专业搜索，保存您的搜索历史记录，中英文界面切换等人性化功能...

二十三 Fiddler
一个很强大的http流查看工具
http://www.fiddlertool.com/fiddler/

Fiddler2Setup.rar

http://www.fiddler2.com/fiddler2/

http://dl.iteye.com/topics/download/56202d9d-79c3-395c-8bcd-2eb819006784

二十 Companion.JS
IE下的javascript调试工具.福音啊!福音啊!!福音啊!!!
http://www.my-debugbar.com/wiki/CompanioNJS/HomePage

十九 FireBug
强的没话说了已经....如果你不知道这是什么....那我更没话说了....
https://addons.mozilla.org/en-US/firefox /addon/1843

十九 Web Developer
FireFox 下的查看工具,可以查看JS,CSS等页面信息
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
Opera下的DOM,CSS查看工具,类似FireBug.
http://dev.opera.com/articles/view/opera-developer-tools/

转载请注明出处： http://www.css88.com/

十五 webkit
Safari下的开发调试工具
http://nightly.webkit.org/

十四 JavaScript 压缩工具
 这程序是由Mike Hall写的，JavaScript的压缩不是为了保护代码而压缩，而是压缩后的js代码文件可以小一倍甚至多倍，从而使这个js代码快速的下载到客户端，特别js文件较大时速度效果非常明显．

使用方法：
  使用下面的表单,你可以浓缩JavaScript代码.只用将任何脚本代码粘贴到输入的文本框,压下 '压缩' 按钮,那浓缩的版本就出现在 '输出' 里. 然后你可以使用 '全选' 按钮,快速选中'输出'里的代码,剪切粘贴到一个新的源码文件.

点击查看 http://www.css88.com/ysjs/ysjs.html

十三 web开发利器Aptana

点击查看 http://www.css88.com/article.asp?id=190

十二 Javascrīpt开发工具大集合

http://www.css88.com/article.asp?id=186

转载请注明出处： http://www.css88.com/

十— 前端开发工具箱——抓色工具(ColorPic)

转载请注明出处： http://www.css88.com/

一、搜索引擎 ——百度（ http://www.baidu.com ）

二、测试浏览器——同时拥有IE7、IE6、IE5.5

自从IE7出来，IE6和IE7的测试就成了问题，同一台电脑不能同时安装IE7和IE6，前台开发长久的痛啊！

哈哈，皇天不负有心人，终于有解决办法了，码头现在提供IE6破解绿色版下载，国外网站下载的，从ie的第一个版本到IE6都有的，现在提供IE6和IE5.5的破解绿色版下载

IE6的破解绿色版点击下载： 点击下载此文件

IE5.5破解绿色版点击下载： 点击下载此文件

转载请注明出处： http://www.css88.com/

三、XHTML、CSS、标准代码检测

做网页的朋友应该都去过 http://validator.w3.org / 和 http://jigsaw.w3.org/css-validator/ 。现在有人把他们集成到了一起，搞了一个网站叫 “ XHTML-CSS Validator ”，点击旁边的 “Advanced” ，还可以选择校验文档类型、CSS版本等等，有兴趣可以试试。

————————————2007年12月23日1:10:18更新————————————————

看不懂英文的兄弟请用 http://jigsaw.w3.org/css-validator/ （中文的）检测css

另：建议先使用DreamWeaver或vs2008本地检测一下；

转载请注明出处： http://www.css88.com/

四、JS脚本调试和书写工具——vs2008

VS 2008已有正式版本

文件详情： Visual Studio Team System 2008 Team Suite
软件版本： 2008简体中文正式版（试用版）
文件格式： RAR 压缩文档
文件大小： 4.24 GB
发布日期： 2008.2.9
官方网站： http://msdn.microsoft.com/vstudio

免责声明：

下载地址为90天试用版（官方正式简体中文），只要按上面的说明更换CDKey即可完美升级为正式版。7个分卷压缩包均需下载才能正常安装，包含MSDN。前面6个压缩包均为700M，最后一个压缩包为142M

VS2008下载页面：   分卷压缩包1     分卷压缩包2      压缩包3      压缩包4      压缩包5      压缩包6      压缩包7

　 VS2008破解方法 非常简单，在开始>设置>控制面版>添加或删除程序>卸载vs.net2008＞出现卸载界面＞点击Next＞输入上面CD-key ->出现成功画面即可完美将试用版升级成为正式版。

VS2008正式版序列号CDKEY ：PYHYP-WXB3B-B2CCM-V9DX9-VDY8T

VS 2008不再是程序员专用工具，VS 2008 可以非常完美地支持JavaScript 和ASP.NET AJAX 的智能感知和调试 。.NET 3.5内置了ASP.NET AJAX，并且UpdatePanel终于可以支持WebPart了。

VS2008 beta2简体中文版下载：

下载地址：
 TFS: http://www.microsoft.com/downloads/details.aspx?FamilyId=053E83D0-DEB4-4EBB-B4C8-CBFFE928B4AA&displaylang=zh-cn

VSTS: http://www.microsoft.com/downloads/details.aspx?FamilyId=428C076F-E3EF-4290-9FF4-F6FD8F180B7D&displaylang=zh-cn

转载请注明出处： http://www.css88.com/

五、火狐插件

前台开发我认为必装的火狐插件

1. CSSViewer 1.0.2
看具体DOM的CSS，Web开发者可以用。

2. Firebug 1.05
调试JS的利器，同时也可进行一些简单的DOM Hook。特爽。
唯一的缺陷就是狂吃资源，如果不是Debug时间，最好把它disable掉

3. JSView 1.2.9
我人为非常重要的，可以查看当前页面的外埠js和css，这对开发者来说很重要。

4. Web Developer 1.1.3
功能上可能跟Firebug有一些重叠，但是也很强大

5.还有好的话请大家留言，我更新。。。

转载请注明出处： http://www.css88.com/

 六、flash破解——ASV

Action Script Viewer（简称ASV） 可以分析 Flash 文件(.swf)文件的内部结构，并将其中的动作脚本(action scripts)分解出来，软件支持 Flash 3 4 5 及最新的 MX 制作的 swf 文件，分解出的动作脚本可以保存为文本格式，在编辑过程中可以随时对 Flash 文件进行预览。4.0版支持Macromedia Flash 4, 5 , MX , MX 2004和flash 8的 SWF 文件。

ASV5详细教程
1.从Action Script Viewer 5.0 中打开要"还原"的.swf文件。
2.文件菜单 > 导出重建数据
file > Export Rebuild data(JSFL)
3.导出数据到指定文件夹
4.打开Flash, 新建Flash文件, 将刚才文件夹中的SWF/MP3/WAV/FLV文件全部导入到库中(不要导入到场景
5.确认后保存文件, 将文件命名为"rebuild.fla" . 目的是于.jsfl文件同名 . 保存后关闭该文件。
6.然后打开"rebuild.jsfl"文件 (不要从Flash中用打开命令, 简单的方法是从文件夹中双击，此时Flash的时间轴/工具栏哗啦啦的闪)

保存该FLA文件, 然后用Ctrl+Enter发布。

Action Script Viewer 5.0 可以还原flash8的swf

目前可供下载的最高版本： Action Script Viewer v5.01（点击下载）

转载请注明出处： http://www.css88.com/

七、CSS整形工具——使用CSSTidy 1.2

我们在写CSS样式的时候通常会根据自己的一些习惯来写，比如有些时候不会使用样式缩写，样式格式随意，大小写不分（另存下来的样式是大写的）等等；

晚上有一种CSS整形工具叫CSSTidy 1.2大家可以使用一下，可以优化你写的样式，特备是节省字节方面效果显著；

点击进入CSS整形工具CSSTidy 1.2

转载请注明出处： http://www.css88.com/

八、IE插件——IE DeveloperToolbar 1.0

愚人码头个人观点：建议使用上面的火狐插件，如果你死活没有用火狐的习惯那就用IE的这个插件

在经历了一年半的测试期之后，微软5月正式发布了其IE Developer Toolbar最终正式版，支持IE6/7。微软开发者工具条可以让开发人员更为方便的分析网页结构，调整包括CSS在内的各种特定元素，帮助开发者更好地创建Web应用。
　　微软此次发布的1.0版相较Beta 3测试版并无新鲜元素加入，按照微软的说法，1.0版本主要改善了可靠性更适合作为一个正式版本来发布。

 
IEDeveloperToolbar特性如下：
　　－浏览和修改Web页的文档对象模型（DOM）。
　　－通过多种技术方式定位、选定Web页上的特定元素。
　　－禁止或激活IE设置。
　　－查看HTML对象的类名、ID，以及类似链接路径、tab顺序、快捷键等细节。
　　－描绘表格、单元格、图片或选定标签的轮廓。
　　－显示图片象素、大小、路径、替代文字等。
　　－即时重定义浏览器窗口大小到800x600或自定义大小。
　　－清空浏览器缓存和cookie，被清除项可从所有对象或给定域中选择。
　　－直接访问关联W3C规范参考、IE开发组blog或其他来源。
　　－显示设计时标尺，帮助对齐对象。

插件使用方法:在IE菜单的"查看" -> "浏览器栏" 里面钩选“IE Developer Toolbar”即

汉化方法:
1.先安装原版将IEDevToolbar
2.关闭所有IE浏览器
3.将IEDevToolbar.dll文件替换X:\Program Files\Microsoft\Internet Explorer Developer Toolbar
中的IEDevToolbar.dll文件.X为你的系统盘.
4.重新打开IE.

点击下载IE DeveloperToolbar 1.0(web前台开发利器)汉化版

九、参看手册

JavaScript参考手册

说明：JavaScrip必备宝典

下载地址： http://www.alixixi.com/Down/eBook/Manual/2007/20070301109.html

2.CSS参考手册

说明：苏沈小雨css2.0中文手册，页面开发人员必备手册

下载地址： http://www.div-css.com/html/download/books/00444.html

转载请注明出处： http://www.css88.com/

十、Beyond Compare v2.52 Build 252 简体中文版

说明：Beyond Compare 是一款不可多得的专业级的文件夹和文件对比工具 。使用他可以很方便的对比出两个文件夹或者文件的不同之处。并把相差的每一个字节用颜色加以表示，查看方便。并且支持多种规则对比。对软件汉化者来说，这绝对是一款不可多得的工具。

下载地址： http://www.crsky.com/soft/2975.html

注册码：
urKH3mXZVDiTNgCKQnFnfvaQB5tTtahvtUr5HqwT9YZu50+b3T9bkzYKwKsfjhhiDgzR9Dr5qbmJ2EmNzYfSAptuo90Ga7NTytXRVPnH-nTye3q+vgdqSmegWMmJmaU9VsqLQNrNfxx1QLBNDdNpUBxrcdm6TPbh8-NYzpYCJmQXJOkTOb7MgovRGiJLLuTN7mpUKRcaT8uxfx1ej+sSKj4JMFGCTSzS+B2L7lKPzT6LKV8oQgg3vGcrU+Y857A2

qi 其他内容陆续更新中，敬请期待。。。

一个强大的新工具现在提供给使用基于Mozilla的系列浏览器（包括Firefox ，Mozilla套件和Netscape 7.x）的Web开发人员。JavaScript调试器，又名“Venkman”，已经成为Mozilla浏览器、Web社区和脚本开发人员的一部分很长时间了。这篇文档提供一个JavaScript调试器的概览和一些在Web页面脚本开发中使用它的实际例子。这篇“入门”是一系列关于Venkman文档的第一篇。假设你已经开始使用Venkman，这里所提到的特性、程序和要点会让你作为一个Web开发人员或脚本调试者更加自信。

Venkman是一个同时拥有控制台界面和图形界面的调试器。你可以根据自己的喜好或特长，从控制台界面或图形界面使用“断点控制”，“调用栈”和“变量/对象监视器”。交互式的命令行界面允许你执行任何可用的JavaScript代码。Venkman的键盘快捷键可用于可视化的调试环境，gdb用户对于Venkman的/break ，/step ，/next ，/finish ，/frame ，/where 命令一定非常熟悉。

在Windows平台上上，JavaScript调试器的界面外观和Visual Interdev以及其它大型的web开发工具是很相似的。在其它操作系统平台上，如Mac OS和Unix，它提供了一个在易用性、性能居于同等水平上的独特的开发调试环境。

下载，基础教程： http://www.css88.com/article.asp?id=448

web系统功能测试工具 Selenium

Selenium简介

Selenium是web应用的测试工具。

网址是：www.openqa.org/selenium/

Selenium可直接在浏览器中测试，就像真正的浏览器用户一样。

可以运行在Windows和Macintosh下的IE，Mozilla Firefox。

可用于：

• 浏览器兼容性测试
• 系统功能测试

如果是初次使用Selenium，最好从SeleniumIDE开始，而不是从Selenium Core，因为Selenium IDE集成了Selenium Core的功能。

Selenium如何工作

Selenium通过javascript和iframe将自动测试引擎嵌入到浏览器中。

Selenium可工作在任何能够运行javascript的浏览器。

不同类型的浏览器的javascript处理存在差异，Selenium尽最大可能支持各种浏览器。

Selenium Core

使用Selenium Core，需要部署到web服务器上，才可以测试。

这说明，使用Selenium Core（使用纯DHTML/JavaScript）不能编写测试比如google.com。

因为Selenium Core是纯DHTML/JavaScript的，受到客户端JavaScript的安全限制。

这是JavaScript安全需求。如果不能修改要测试的webserer，Selenium Core不是合适的测试工具。

需要使用Selenium IDE或者Selenium RC替代。

Selenium IDE

见：http://www.openqa.org/selenium-ide/

Selenium IDE是一个测试集成开发环境。

是Firefox插件，可记录，编辑和调试测试。

Selenium IDE包括完成的Selenium Core，易于和快速记录和运行测试。

Selenium IDE不只是录制工具：是完整的IDE。

可以录制，或者手工写脚本。

Selenium RC

Selenium RC即Selenium Remote Control。
如果测试google，又不能在google网站上添加Selenium Core，可以使用Selenium RC。
Selenium RC提供了一个代理服务器，比如可以让浏览器以为是在执行http://www.google.com/selenium-server/MyTestSuite.html
To use the Selenium Server as a proxy, run your tests like this:
启动Selenium RC，作为代理服务器执行测试，类似：

程序运行后生成results.html，如果超时，程序退出，而且不生成results.html。

------------------------------end----------------------------------

https://chrome.google.com/webstore?category=ext%2F11-web-development

13个优秀的网站检测工具推荐

http://www.iteye.com/news/23669

对网站来说，有一个好的设计方案当然是值得骄傲的，但是显然不够。当完成网站之后，我们还要进行各种浏览器的兼容性测试、负载测试，以及DNS健康检查等。本文介绍了13个这方面的重要工具，希望你会喜欢。

1. Browser Shots

Browsershots工具提供了对你的Web设计在不同操作系统和浏览器下截图的功能。它是一个免费的在线开源Web工具，使开发人员能以一 种便捷的方式同时测试网页的浏览器兼容情况。在Browsershots上提交的网址将被添加到一个任务队列。随后一些分布式的计算机将在各自的浏览器中 打开该网站并截图。最终可通过一个中央服务器来查看这些上传的截图。

2. IETester

IETester是一个免费的Web浏览器调试工具，可以模拟出不同的js引擎来帮助程序员设计效果统一的代码。IETester可以在独立的标签页中开启IE 5.5、IE 6、IE 7以及最新的IE 8（9） beta等不同版本的IE。

3. WebPage Speed Test

使用该工具可在全球不同位置及不同浏览器中测试网页的真实链接速度。除了简单的测速，你还可以执行一些其他高级测试，如多步执行（multi- step transaction）、视频录制、内容阻止等。测试结果将提供丰富的诊断信息，包括资源加载瀑布图、网页速度优化检查及改进建议等。

4. Mobile testing

使用这个工具你可以查看你的网站在移动设备上的效果。可以设置移动设备的类型、录屏，以及结果不公开。

5. Feed validator

免费的W3C Feed校验服务，可用于查找Atom和RSS Feed中的语法错误。

6. Instant Website Test

该工具提供免费即时的网站性能测试服务。可从全球不同位置探测你的网站加载速度有多快，并查明是何者降低了页面性能。

7. Pingdom

输入URL，即可测试页面的加载时间，分析并发现加速的“瓶颈”所在。

8. Link Checker

该工具可用于搜寻查明你网站内的所有链接里是否有断链。

9. DNS Health Checker

正确的DNS设置对网站运行来说是至关重要的。Pingdom的DNS Health test工具可以帮助你发现错误的DNS设置，并检查域名解析是否正确。它能够自动发现你所指定域名使用的DNS服务器，然后执行一系列迭代测试来查明域 名设置及DNS服务器响应是否正确。

10. Load impact

Load Impact是一个在线网站负载测试服务，可以帮助你测试网站的负载和压力。

11. Google web page tester

Google的Page Speed Service，可以为第三方网站提供网页加速服务。你只需要把以前的域名CNAME到ghs.google.com，浏览者就不再直接访问网站的服务 器，而是转到Google的服务器上。Google的服务器会抓取网站服务器上的网站内容，然后进行重写、缓存。它使用类似CDN（内容分发）的原理，而 比普通只提供缓存的CDN多了内容重写的环节，自动为网页提供合并CSS、合并JavaScript、将CSS移到HTML的Head、压缩图片、优化图 片、缓存图片、碎片域名、gzip资源等网页加速技巧。

12. Validate you HTML code

该工具可用于检查Web文档中HTML、XHTML、SMIL、MathML等标记的有效性。

13. Website vulnerability tool

免费的在线网络漏洞扫描工具，可用于检查你的网站的安全性。

Via  QUENESS

网站测速

http://www.17ce.com/

站长工具 gzip压测检测

http://www.gongju.com/gzip/www.xiaomi.com

microsoft webmatrix 3

http://www.microsoft.com/web/webmatrix/

http://baike.baidu.com/view/4087941.htm

https://www.microsoft.com/web/handlers/webpi.ashx/getinstaller/WebMatrixWeb.appids

Microsoft WebMatrix是一款由微软公司开发的免费的轻量级Web开发工具。用它可以开发运行在Windows服务器上的网站。值得一提的是，它允许开发者使用许多著名的开源Web应用程序。

google webdesigner

https://www.google.com/webdesigner/

http://baike.baidu.com/view/10669402.htm

https://dl.google.com/tag/s/appguid%3D%7B811767F4-C586-4673-A41F-E9D767497222%7D%26iid%3D%7BC245ECDC-F986-F7D0-DB62-933A1C251612%7D%26lang%3Den%26browser%3D4%26usagestats%3D0%26appname%3DGoogle%2520Web%2520Designer%26needsadmin%3DTrue/webdesigner/win/shell/googlewebdesigner_win.exe

Google Web Designer是一款HTML5网页和广告设计的工具软件，目前在测试开发阶段，最终版本已经支持Linux。目前支持的Linux的系统：Ubuntu，Debian，openSUSE和Fedora。不过之前已经支持Windows和Mac。

特性：

两种动画创建模式（快速与高级）

全3D创作环境

包含设计视图和代码视图

矢量绘图工具

可以很方便的在页面上加入广告区域。

系统最低要求：

Window 7 或Mac OS X 10.7 （XP不行）

奔腾4或Athlon64处理器

2GB内存

1280×1024屏幕方案

创建的最小应用窗口大小1024×768

end