50 个Web 设计师必备的超便利工具
- Zhang Yi - 菠菜博作为一个 Web 设计师并不容易，不仅考虑设计与架构，还要时刻注意各种小细节，设计师的工作被各种各样的问题包围，你需要一套超级便利的工具帮你解决各种消耗时间和精力的问题. 本文介绍了50个非常强大的工具，你会发现，其中的一些工具会让你感到惊艳在. 站点发布前的工作清单，预设了28个需要检查的事项，也可以自定义.
50 个Web 设计师必备的超便利工具
标签：
web
设计师
工具
| 发表时间：2011-02-07 15:59 | 作者：(author unknown) Zhang Yi
出处：http://www.bbon.cn
作为一个 Web 设计师并不容易，不仅考虑设计与架构，还要时刻注意各种小细节，设计师的工作被各种各样的问题包围，你需要一套超级便利的工具帮你解决各种消耗时间和精力的问题。本文介绍了50个非常强大的工具，你会发现，其中的一些工具会让你感到惊艳在。
LaunchList
站点发布前的工作清单，预设了28个需要检查的事项，也可以自定义。同类工具： Ultimate Website Launch Checklist 以及 The Ultimate Website Prelaunch Checklist。
Pencil Project: Sketching and Prototyping with Firefox
一个开源 GUI 原型设计工具。
Zootool
一个非常漂亮的书签工具，可以将你收集的各种素材，图片，文档，链接，视频等在线组织到一起。
Bounce （推荐）
输入一个站点地址，该程序会给该站点截图，然后，你可以在上面批注，加评论，并和朋友分享。非常适合用来和您的客户在线就某个站点的设计进行讨论。
Ninite Batch Installer
这个站点可以将很多免费的流行软件（最好的版本）打包在一起，一次性安装到你的机器，支持 Windows7，Vista 和 XP。
Support Details （强烈推荐）
假如你想让你的用户提供他/她所使用的浏览器环境，比如 Flash 版本，操作系统，屏幕分辨率，Cookie，JavaScript 状态等，可以让他/她访问一下这个站点，这个站点或自动将这些内容探测出来，并允许用户现场通过邮件将报告发送给你。
MugTug’s Darkroom
一个在线图片处理程序，可以调整对比度，白平衡，曝光，饱和度等，可以从 Picasa 及 Flickr 上传图片，同类产品：Pixlr 及 Sumo Paint。
Visual Website Optimizer （强烈推荐）
Visual Website Optimizer 绝对是你所能见到的最好的 A/B 测试工具。
Keyonary
这个简单的在线工具可以帮你列出 Mac OS X， Photoshop 等工具的快捷键清单。
gridr buildrrr
一个在线网格设计工具，选择你希望使用的网格布局，帮你预览并生成 CSS 代码。
Instant Blueprint – Create a web project framework in seconds.
帮你瞬间生成一个 Web 项目框架，基于合法 HTML/XHTML 和 CSS。
Hummingbird
一个实时的（真正的实时，每秒刷新20次）站点流量分析工具，基于 Node.js.
jsFiddle
在线 Web 编辑器，支持 JavaScript, MooTools, jQuery, Prototype, YUI, Glow, Dojo, HTML 以及 CSS。
String: create a multi-language website or app
帮你创建多语种 Web 应用的资源文件，
Titanpad
可以多人同时编辑同一个文档，别的改动会实时以不同颜色标识，可以是同一个办公室的多个用户，也可以是地球另一边的多个用户。
Pixelnovel Timeline: Version Control for Adobe Photoshop
该工具通过插件方式集成 Subversion 客户端，可以在 Photoshop 中实现版本控制。非免费工具。
0to255
给出一种颜色，会帮你列出这种颜色由浅入深的各种颜色变化，并特别针对 Web 做了优化。
Load Impact: Website load/stress test
一个在线压力测试工具，模拟多用户同时访问你的站点，并出具报告以分析你的站点可以支撑的访问者数量。
Ideone: Online IDE & Debugging Tool
一个在线 IDE 和调试工具，支持多达40种语言，包括 C++, Java, JavaScript, Perl, PHP, Python and Ruby，同类产品：PHP Anywhere 以及 CodeRun 。
Online Dummy Image Generator
快速帮你生成一个在线虚拟图片，以便您进行某些测试。
HiFi RegExp Tool
在线正则表达式工具。
Tableizer （推荐）
将你 Excel 表格中的内容复制粘贴到这个站点，它会帮你生成 HTML 格式的表格（HTML Table）。
FollowUpThen: Easy Email Reminder
-假如你希望有人提醒你什么时候该做什么事，你可以给比如 [email protected] 一类的地址发个邮件，1day 表示一天后，这样，一天后，你会收到他们的提醒邮件，1day 可以改成人和别的时间间隔。
Divine: Conversion tool from PSD to HTML
这个工具是一个 Photoshop 插件，可以将你的 PSD 转换成 WordPress 主题。（译者：有待验证）
Kaleido
为你的代码创建视觉化标识。来自麻省理工。
Sketchpad
一个强大的在线图像编辑器。难能可贵的是，这是基于 HTML5 的。
Unicode code converter
虽然界面有些乱，但这个工具能把一段文字转换成各种编码形式。
Grid System Generator
另一个网格设计生成器。
ud.com namecheck （强烈推荐）
这个看似简单的工具，可以帮你查询某个名字是否还可以注册域名，商标，已经社会媒体网络入口。
Typograph — Scale & Rhythm
这个工具可以帮你即时预览各种不同的 Web 排版效果，并生成代码。
ColorBrewer Intro – Selecting Good Color Schemes for Maps
适用于地图的配色工具。
CSS Inliner Tool （推荐）
将独立的 CSS 定义转换为 Inline CSS。假如你使用电子邮件进行营销，会发现这种工具非常实用，因为邮件客户端常常会将你独立的 CSS 代码过滤掉，而 Inline CSS 不会被过滤。
HTML Purifier – Filter your HTML the standards-compliant way!
这个使用 PHP 设计的工具，可以对你的 HTML 代码进行过滤，去除其中的恶意代码，并按 W3C 标准对代码进行净化。
Rendera
在线编写 HTML5 和 CSS 代码，现场看到效果。
RegExr
又一个在线学习，体验，测试正则表单式的地方。
try ruby! (in your browser)
Ruby 在线体验。
Google Command Line
使用命令符访问 Google 的一些产品和服务。
Tiny Fluid Grid
又一个网格设计工具，很小巧。
<a href="http:
相关 [web 设计师 工具] 推荐：
Mobile Web调试工具Weinre
- - 移动开发 - ITeye博客现在、将来，用移动设备上网越来越成为主流. 但对于开发者们来说，移动web的调试一直是个难题，前期可以使用模拟器来协助调试，但到了真机调试阶段就让人非常头痛. 而Weinre就是解决这难题的利器. Weinre的本意是Web Inspector Remote，它是一种远程调试工具. 功能与Firebug、Webkit inspector类似，可以帮助我们即时更改页面元素、样式，调试JS等，下面就简单介绍下如何使用.
Web设计师能从游戏中学到些什么
- Guan - 所有文章 - UCD大社区Smashing Magazine版权所有. 作者：Smashing Magazine. 译者：UCD翻译小组，波希米亚. 原文地址： http://www.smashingmagazine.com/2011/07/27/what-web-designers-can-learn-from-video-games/.
WEB设计师和开发人员需要的新鲜资源
- redhobor - 互联网的那点事网页设计正在进入全新的领域，各种技术每天都在涌现. 网页设计师和开发人员都需要不停的去改进自己的思维不停的去创新用户体验，才能让项目在众多的网页中脱颖而出. 但是不管是WEB设计师还是开发人员，都需要有一套属于自己的素材库，里面有各种资源可随时调用. 下面是我们分享给大家的一些非常实用和新鲜的资源，其中有关于幻灯片插件，有CSS框架，有HTML5和CSS3还有GUI，jQuery等等.
Web设计师能从游戏中学到些什么
- 锋 - 互联网的那点事译者序：一直以来我都想写一篇关于游戏与交互设计之间关系的文章，因为我坚信好的设计和游戏一样有魔力，都能为用户带来乐趣. 这可能跟我之前在游戏公司任职过有关，潜移默化地受到感染和熏陶. 当看到这篇文章时，共鸣了，这就是我想要说的，于是我决定译过来，跟更多设计师产生共鸣，推动 “乐趣设计”，同时也为自己这方面的想法写下第一笔.
热点争议：Web设计师需要编程知识吗？
- - Web App TrendWeb设计师是否应该学习编写代码是个充满争议的问题. 通常，在完成了一件网页设计后他们把创建网页代码的繁重工作都留给了程序员们. 这种现象不只出现在网络开发行业，在软件及游戏开发业也是如此. 在本篇文章中，作者 Deepu Balan 和大家分享了一些为什么Web设计师需要学习编写代码的理由，这会使广大的Web设计师们受益匪浅.
从Web到移动应用——谈设计师的思维转换
- - legene的交互设计博客随着移动互联网的快速发展，很多web产品经理、设计师转而投身至移动应用领域. 看起来非常相关的工作，却可能给他们带来了不小的困扰. 很多刚刚接触移动应用的产品经理、设计师依然习惯用Web的思维去做APP，从而导致一系列问题. 张小龙在谈微信时曾经说过： 绝不考虑Web形态，一切考虑都基于APP. 那么，移动应用和Web相比，区别到底在哪里呢.
Web设计师如何制作Retina图像
- - 博客 - 伯乐在线英文原文： how to create retina graphics for your web designs，编译： w3cplus – 大漠. 苹果公司发布了更多的产品适应Retina屏幕. 到目前为止，我们知道苹果设备中支持Retina屏幕技术的有“iPhone”、“iPod”、“iPad”和“Macbook Pro”，这些设备能为用户呈现更细腻、平滑和高质量的图片效果，提高了用户的视觉体验.
Web设计师能从游戏中学到些什么 - UCD大社区
- Kenji Kee - ucdchina.comSmashing Magazine版权所有. 作者：Smashing Magazine. 译者：UCD翻译小组，波希米亚. 原文地址： http://www.smashingmagazine.com/2011/07/27/what-web-designers-can-learn-from-video-games/.