原文：20 Useful Tools to Make Web Development More Efficient
作者：Jacob Gube
翻译：szqp
There are many available tools to help make web development projects quicker and more productive. Aside from a handy text editor or WYSIWYG editor like Dreamweaver, you can find plenty of tools and utilities that can greatly increase development speed, reduce debugging and testing time, and improve quality of the output. The tools described below are a variety of utilities, optimizers, testing, and debugging tools aimed towards helping developers create websites more efficiently.
有很多有用的工具能帮助你更快和更有效的进行网站开发。除了随处可得的文本编辑器或者所见即所得的编辑器（如Dreamweaver）之外，你也能找到很多工具，它们能帮你提高开发速度，减少除错和测试的时间，同时还能提高输出的效果。下面就列出一些各种各样的工具，包括优化、测试、除错等，能让开发者更有效率。
CSS Grid Builder is an online GUI for customizing the YUI Grids CSS - a lightweight CSS framework developed by Yahoo! that comes with over 1000 page layout combinations. The CSS Grid Builder allows you to rapidly generate a CSS-based, web-standards compliant page layout in a matter of minutes (or even seconds). Once you’ve got the page layout the way you want it, all you have to do is press “Show Code” and it generates the HTML for you.
CSS Grid Builder是一个在线GUI，用于定制YUI Grids CSS–一个Yahoo！开发的轻量级的CSS框架，包含超过1000个页面样式。CSS Grid Builder让你在几分钟（甚至几秒）快速生成一个基于CSS，适应Web标准的页面样式。当你找到你要的页面样式时，你所需要做的仅仅是按”Show Code”，然后它就会为你生成HTML代码。
You don’t even have to host the CSS file on your web server (saving you some bandwidth and maintenance hassles), the generated code links to the appropriate stylesheet found on Yahoo!’s Developer Network API.
你甚至不需要保存CSS文件在你的服务器上（这样能减少一些你的带宽占用和维护烦恼），生成的代码会链接到Yahoo!’s Developer Network API中适当的样式表。
Using CSS sprites is an excellent way to improve web page performance by reducing the number of HTTP requests needed for rendering images, but it can take a lot of planning, measuring, and coding if done manually.
使用CSS sprites是一个提升网页效能的好方法去，它通过减少用于表现层图片的HTTP请求数达到这一目的。假如手工去做，则需要很多计划、测量和编码。
CSS Sprite Generator allows you to upload all of your images (you have to place them in a .zip file first) and it will combine the uploaded images into a single sprite and also generate the CSS for you.
CSS Sprite Generator 让你上传所有的图片（你需要先把它们压缩为一个zip文件），然后网站会把全部图片整合成一个独立的图，同时给出CSS代码。
Blueprint reduces the amount of CSS code you have to write by including common styles that developers typically use such CSS reset and page layouts. A demonstration of a web page that uses Blueprint can be found here.
Blueprint 能减少相当一部分常用但你又必须要写的CSS代码。这里是一个一个采用Blueprint的网页例子。
4. CSSTidy
CSSTidy is an open source application that parses, fixes, and optimizes CSS code to reduce file size and also to standardize CSS code formatting automatically. It also finds and removes redundant styles and properties. You can adjust CSSTidy’s settings to your preferred compression level but even the default setting can often give you 30% compression according to the creators of CSSTidy. Check out the “before and after” examples to get a feel for how CSSTidy works.
CSSTidy是一个分析、修正、优化CSS代码的开源应用程序，它能减少文件的体积和自动格式化CSS代码使其符合标准。它也能查找和删除多余的样式和属性。你能够调整CSSTidy的设置，设定你需要的压缩级别，但默认设置就已经有30%的压缩率了。查看”before and after“这个例子，去了解CSSTidy的工作原理。
logicss is a collection of CSS files and PHP utilities aimed at reducing web development time. It allows developers to create customizable fixed, elastic, or fluid (liquid) layout grids. Check out the preview of their CSS code generation tool.
logicss是一个CSS文件和PHP工具的集合，可用于减少web开发的时间。它允许开发者创建可定制的固定、弹性、流式（ fixed, elastic, or fluid ）的样式网格。查看他们的CSS code generation tool的预览版。
6. ___layouts
___layouts is a very simple CSS framework that can be used to create web-standards compliant page layouts. ___layouts was inspired by Yahoo!’s Grids CSS and offers 5 preset widths that supports fluid-width or fixed-width layouts. Much like Yahoo!’s Grid.css, ___layouts also has a web-based Layout Builder that was developed for the Firefox browser. Caution: the Layout Builder is still in its early stages of development, so things may be buggy at times.
___layouts是一个非常简单的可用于创建与web标准兼容页面样式的CSS框架，___layouts是受到Yahoo!’s Grids CSS 的启发，它提供了5种预定义的流式或固定宽度样式。就像Yahoo!’s Grid.css, ___layouts 也有一个基于web，适用于Firefox浏览器的Layout Builder。警告：Layout Builder 仍然处于早期开发阶段， 可能会有较多bug。
7. Clean AJAX
Clean AJAX speeds up Ajax development by cutting down the amount of code you have to write (and rewrite), giving you access to common and proven design patterns used in Ajax applications. Clean AJAX can be used with any server-side technology such as PHP, RoR, and .NET because it’s JavaScript-based. Check out the demo page so you can see Clean AJAX in action.
Clean AJAX通过减少你必须要写的代码，使用通用的Ajax设计模式，加速Ajax开发。因为Clean AJAX是基于JavaScript，所以能被用于任何服务器端技术，比如PHP、RoR和.NET。查看Clean AJAX的例子。
8. Sajax
Sajax (which stands for “Simple Ajax Toolkit”) is an open source framework developed to speed up the creation of Ajax applications. It supports major sever-side technologies such as ASP, Cold Fusion, PHP, Perl, Python, and Ruby. Sajax has a fairly large community of over 39,000 registered users on their forums - so if you run into any troubles while developing a Sajax-based application or if you want to showcase your work, you’ll be sure to have an audience.
Sajax（”Simple Ajax Toolkit”的缩写）是一个开源框架，用于加速Ajax应用的创建。它支持主要的服务器端技术，比如 ASP, Cold Fusion, PHP, Perl, Python, 和 Ruby。Sajax有一个庞大的社区，他们的论坛有超过39000个注册用户，因此当你在使用Sajax开发遇到问题时，或者想展示你的工作时，你肯定能有一批响应者。
9. DOMTool
DOMTool was created to cut down the time it takes to code DOM structures. Creating DOM statements is as simple as copying your HTML code into the DOMTool and then clicking a button. It’s not meant to be used as a simple copy-and-paste solution and you should verify and optimize the output, but it gives you a great starting point.
DOMTool用于减少你编写DOM结构的时间。创建DOM语句非常简单，只需要复制你的HTML代码到DOMTool中，然后按一下按钮就可以了。当然这不意味着复制粘贴就能解决问题了，你必须校验和优化输出结果，但它毕竟给了你一个好的开始。
JavaScript Code Improver is a simple, no-frills application that allows you to quickly tidy up and format your JavaScript. It’s a great way for a team of developers to standardize JavaScript code format for easier readability and collaboration.
JavaScript Code Improver是一个简单、无装饰的应用程序，它能让你快速整理和格式化你的JavaScript代码。团队开发使用它能让JavaScript代码符合标准，让代码更容易阅读和便于协作。
