摘要
技术的快速发展让很多人学习起来无所适从，幸运的是，很多优秀的Web开发人员和设计人员在努力寻找各种有特色的解决方案。因此，我们有了很多优秀的小工具和库，每一个都是用来解决特定的问题或维护一组特定的项目。
年，Web开发领域继续在快速的发展，HTML5仍然在展示其跨平台的优越性，CSS3被人们更多的应用到实际项目中，响应式设计（ResponsiveDesign）技巧也被人越来越多的人熟知和使用。
这篇文章收集了年度新发布的最具有代表性Web前端开发工具和框架，这是一个非常值得收藏的工具列表，从功能全面的IDE到美观、充满异国情调的小框架，小工具等等。他们能够帮助你降低Web开发过程中的复杂度，节省时间和精力。
01.Foundation3
响应式设计（ResponsiveDesign）似乎瞬间就发展起来了，各个网页设计的论坛或者社区都会讨论这个话题，大家都想知道如何实现响应式设计，有什么框架或好的解决方案。
Foundation3，由ZURB公司开发，号称世界上最先进的响应式前端框架。利用灵活的网格系统可以快速设计出页面布局。更妙的是，网格可以是你所需要的任何尺寸，它很容易适应各种尺寸的屏幕。
02.Proto.io
Proto.io是一个新的界面原型设计工具，专门针对移动应用程序。基于Web的在线环境，可以让你制作流行的iPhone，iPad，Android手机或平板电脑，以及任何带有屏幕界面的设备的原型项目。
在设计了一些界面后，你通常会期望能够把页面交互性的链接起来，Proto.io做到了这一点。它也支持所有你可能想到的触摸手势，以及幻灯片、翻转和淡入淡出动画，使用简单，而且可以免费使用。
03.Fontello
为什么这么难找到一组涵盖所有的基础功能的外观一致的图标？
不用再困惑了，Fontello不仅拥有所有你需要的图标，而且你可以挑选并选择你所需要的字形，并编译成自己需要的一套。当然，您也可以从GitHub下载整个的图标集。该项目是开源的，糕富帅们捐几刀吧，不胜感激。
04.Bugherd
与普遍的看法相反，推出一个新的网站对于开发团队来说工作还远远没有结束。
BugHerd提供了一个整洁，组织良好的方式来处理反馈，Bug修复和功能要求。不需要繁杂的电子邮件反馈方式，只需要在网站中包含一个简单的JavaScript文件，该网站的访问者就可以通过反馈按钮提交意见和建议。BugHerd提供了一个友好，直观的界面来管理整个事情。
05.Cloud9IDE
Cloud9是基于NodeJS构建的在线集成开发环境，语法高亮支持C#,C++,Python,Perl,Ruby,Scala等等众多常用开发语言。
内置的Vim模式非常好用，支持流行的版本控制系统，像Git，Mercurial和SVN，另外它还有非常强大的插件系统，可以拓展其功能，例如借助CSSLint和JSBeautify，Cloud9就可以变成一款非常实用的代码美化工具。
06.AdobeEdgeInspect
EdgeInspect是一款对移动开发者非常有用的工具，其前身是AdobeShadow，用于帮助设计师和开发者同时在多个移动设备上预览应用设计，发现和解决跨平台问题。
只需要把你的设备（Android和iOS）和你的电脑连接起来，这时候你的网站就会在各个设备上同步显示，让检查和调试变得更有效，并可以让设计师同时看到每个版本在所有目标设备上的显示情况。
07.AdobeBrackets
你可能会觉得现在代码编辑器已经是琳琅满目了，而且这些编辑器都很相似，没有什么可创新的了。Brackets让我们知道，其实在编辑器领域还是有很多功能可以去探索的。Brackets是Adobe的开源HTML、CSS和JavaScript集成开发环境。Brackets提供Windows和OSX平台支持。
Brackets的核心目标是减少在开发过程中那些效率低下的重复性工作，例如浏览器刷新，修改元素的样式，搜索功能等等，Brackets值得你试试。
08.SublimeText
如果你想体验流畅编写代码的快感，赶紧试试SublimeText吧！
SublimeText具有漂亮的用户界面和强大的功能，例如代码缩略图，多重选择，快捷命令等。还可自定义键绑定，菜单和工具栏。SublimeText的主要功能包括：拼写检查，书签，完整的PythonAPI，Goto功能，即时项目切换，多选择，多窗口等等。
SublimeText是一款跨平台的编辑器，同时支持Windows、Linux、MacOSX等操作系统。SublimeText是收费软件，但目前可以无限期试用。
09.PhoneGap2.0
PhoneGap是一个免费开源的开发框架，让Web开发人员能够使用熟悉的HTML，CSS和JavaScript构建跨平台的移动本地应用。
通过PhoneGap框架提供的JavaScriptAPI能够以非常简单的方式调用移动设备的核心功能，包括地理位置，摄像头，加速器，通讯录，多媒体，文件和网络等功能。
借助PhoneGap，你完全可以使用熟悉的Web开发技术写出移动NativeApp，并发布到AppleStore，GooglePlay等各平台应用商店中。编写好的代码可以上传到云端服务器，使用云端编译功能编译成各种平台下的应用，支持iOS，Android，PalmWebOS，Symbian，Blackberry，WindowsPhone和Bada七大平台。
10.Yeoman
Yeoman提供了一套强大的工具、库和工作流，可以帮助开发人员快速构建出漂亮的、引人注目的Web应用。Yeoman的主要特色：
闪电般搭建出框架（使用能够自定义的模板（例如：HTML5Boilerplate、TwitterBootstrap等）、AMD（通过RequireJS）以及其他工具轻松地创建新项目的框架。）；
自动编译CoffeeScripCompass——在代码改动的时候，Yeoman的LiveReload监视进程会自动编译源文件并刷新浏览器，而不需要你手动执行；
自动校验脚本——脚本会自动运行jshint校验，以确保他们遵循语言的最佳实践；
内建预览服务器——不需要启动自己的HTTP服务器，内置的服务器用一条命令就可以启动；
高效的图像优化——Yeoman使用OptPNG和JPEGTran对所有图像做了优化，提供页面加载速度；
生成AppCache清单——Yeoman会为你生成应用程序缓存的清单，你只需要构建项目就好；
杀手级的构建过程——Yeoman为你自动化完成了大部分的工作，帮助你节省大量时间和精力；
集成包管理——你可以通过命令行轻松地查找新的包，安装并保持更新，而不需要你打开浏览器；
支持ES6模块语法——可以使用最新的ECMAScript6模块语法来编写模块，不过还是一种实验性的特性，它会被转换成ES5；
PhantomJS单元测试——使用PhantomJS轻松运行单元测试。创建新的应用程序的时候，它还会为你自动创建测试框架；
11.MicrosoftWebMatrix2
WebMatrix是一个全新的Web开发平台，区别于现有的开发平台，WebMatrix的特点是一站式和简化的开发过程，提供一种简单、一体化的建站方案。
它提供了网站所需的所有工具：WebServer、数据库、Web框架和开发环境。其主要组件包括了轻量级WebserveIISDeveloperExpress；轻量级基于文件的数据库SQLServerCompactEdition；轻量级开发环境ASP.NET“Razor”。
12.Firefox18
Firefox拥有众多强大的开发工具插件，成为Web开发人员必备可少的调试工具，从Firefox18开始，Mozilla将正式开启开发长达1年之久的的新一代JavaScript引擎——IonMonkey，不仅能大幅提高Firefox的JavaScript性能，还能提高浏览器的安全性及其他性能。
最新版本增加对于OSX10.7+超高分屏和和WebRTC的支持；使用了新的HTML拉伸算法，提高了图片质量；实现了CSS3Flexbox；实现W3C标准的触摸实现，替代了MozTouch实现；实现新的DOM属性Window.devicePixelRatio；通过智能化处理签名扩展的认证来提高启动速度。
温馨提示：文章素材来源于网络，版权归原作者所有！