软件开发工具介绍之 6.Web开发工具
1.EditPlus
无论是编写xhtml页面,还是css、js文件,甚至随笔记记这样的事情,我都会使用EditPlus,感觉它不仅功能强大,更难得的是:绿色、轻量级、启动速度快、稳定性高
1.1 配置文件模板
设置好EditPlus的配置文件,告别重复的体力劳动。如果我们经常建立一种文件,而这种文件总会包含一些重复的文字或者代码的话,我们就可以建立模板,然后通过模板建立文件。从而摆脱每次都要重复的体力劳动。
1.2 顺手的侧边栏
侧边栏包含了“快速目录路径”和“快速剪贴板”功能“快速剪贴板”可以存放一些代码片断、常用文言等等文字。当你需要这些文字的时候,只要双击,就可以方便的添加到光标所在位置了。默认情况下会有一些html,css代码。如果嫌多,可以建立一个自己最常用的“剪贴板”库。
1.3 华丽的自动完成功能
当你打一个“ua”字,然后按下空格,编辑器里面就出现了右边的代码,而且鼠标就停留在第一个href的双引号之间。使用EditPlus的自动完成功能将会极大的提高你的工作效率。而且我们可以根据不同的文件类型,建立不同的“自动完成”,例如,如果是xhtml文件,打“b”+ 空格”,就是 ,而在css文件中,“b”+ 空格”,就是 "border:1px solid red;"。非常的人性化。
你可以通过这样的设置,来使用EditPlus的自动完成功能。
1.4 彩色的文件,高亮语法文件
很多的开发工具都有语法高亮显示功能,EditPlus虽小,但是也有这个功能哦。和“自动完成”功能一样,只要为不同的文件类型指定“高亮语法”文件即可。css、html等常用的文件类型,EditPlus已经自带了高亮语法文件。如果自带的高亮语法文件没有你需要的,你可以去EditPlus官方网站的文件下载。
2.ColorPic
一个免费的软件,用于拾取颜色的,鼠标移动到哪里就拾取哪里的颜色,可以对拾取的颜色分组,这样我们就可以把需要的颜色都一次性拾取完,再慢慢的用了。
拾取颜色和重新拾取时都是用Ctrl + G 快捷键.
3.FireBug、IEDevToolBar、IE开发人员工具、HttpWatch等
3.1 微软的IEDevToolBar
这是一个免费的专门为Web开发人员制作的IE插件,IE插件IEDevToolBar可以帮助我们分析网站的布局结构,有助于我们学习和分析页面的CSS,其主要功能有:
1.以树结构查看CodeDom,并查看每个Element属性,可以使用鼠标点击选中Element,这个在我们制作和调试网页时很有用;
2.生成图片报表,就是将页面上说有出现的图片生成一份详细的报表,这样就省的我们自己去找图片路径和量图片大小等等;
3.高亮显示表格,表格单元,Div等的边框,这个在我们调整布局时也是很有用;
4.页面尺子,可以然你任意在页面上度量长度,这个是大大的提高了我们的工作效率,不用为了量个长度而抓图再用画图工具量。
3.2 HttpWatch
强大的网页数据分析工具.集成在Internet Explorer工具栏.包括网页摘要.Cookies管理.缓存管理.消息头发送/接受.字符查询.POST 数据和目录管理功能.报告输出。
官方站
http://www.httpwatch.com/download/
它有2个版本:
HttpWatch Basic Edition (免费的,有部分功能限制)
HttpWatch Professional Edition
4.IETester
IETester是一个非常棒的网页设计师的必备工具,有了这个工具,就可以知道网页在IE6,或者IE7,或者IE8的显示情况、相容性,让我们看一下辛苦作好的CSS样式或网站版面是否可以在各个主要浏览器正常显示。 IETester是以”分页标签”的方式,分别在不同的页签中显示你所指定的IE浏览器版本的网页浏览画面。
5.脚本压缩
JavaScript和CSS压缩的目的是在保持脚本的执行性能的同时,减少数据传递的字节数(可以通过减小原始文件,也可以利用gzip。大多数产品级的网络服务器都把gzip作为HTTP协议的一部分)。
http://dean.edwards.name/packer/
YUI compressor(http://developer.yahoo.com/yui/compressor/),一款 jQuery官方推荐的压缩脚本的工具。