原文：

原作者：Daniels Meks

翻译：

本文将会展示一些web设计师应该经常会使用到的工具。如果你需要一些灵感，你可以访问最流行的设计展示站点来寻找你需要的好作品和好例子。一些设 计相关的工具，在线生成器，免费字体站点，模板站点都将帮助你更有效率测试和管理站点。记住，并不是什么都亲自完成才是最好的方式，一定程度的借鉴将会让 你以更轻松的方式完成任务。

我强烈建立你泛读本文，把对你有帮助的站点加入书签，当你灰心的时候，不妨看看。

灵感类

1.

Deviantart是互联网站最大的艺术展示站点之一。你可以在这里找到好灵感。

2.

Web Design Library是一个提供设计研究平台的资源站点，覆盖了大量的理论知识和实战方面的信息。

3.

Stylevault.net 是一个设计展示站点，设计师可以在上面展示才华的同时其他人也可从中获益。

4.

Behance 是找灵感的好去处，因为他们的设计更加专业。

5.

The Design Inspiration 是一群整日寻求设计灵感的设计师所创建的。

设计工具

6.

Colour lover 是一个国际性的设计师社区，不同行当的艺术家到此寻找色彩方面的灵感，想法并对这些专业的或个人项目发表发聩。

7.

Adobe kuler 是奥多比公司推出的web程序，旨在帮助你创建和分享颜色主题。

8.

Color Hunter 可以通过图片来创建配色。

9.

通过Colorotate，可以实现以3D的视觉效果的方面来迎合人脑的颜色处理过程。

10.

Stripemania 是一个用于生成纹理的在线web2.0工具。纹理大小、缝隙都可以调节，还可以选择色彩过渡效果。

11.

FontStruct 可以通过绘制网格来绘制出自己的字体。

12.

一个可以通过字母，主题，更新日期排序的字体站点，大多数字体可以免费下载。

13.

一个收录了十万个免费图标搜索引擎。

14.

看见了一个好看的字体，但是不知道它的名字？

把字体图像提交到WhatTheFont，它将会在数据库中查找与你的字体最接近的字体名字，或者让字体爱好者在中帮忙。

15.

Lorem Ipsum是打印排版工业的无意义文本，这是一个Lorem Ipsum生成器。

编码工具

16.

Typetester是一个在线字体比较工具。

17.

通过typeface.js，你可以在网页中嵌入自定义字体，从而免去了文字到图片转换的麻烦。

18.

Firebug是Firefox浏览器的一个网页开发的扩展，你可以在任意网页中编辑，调试，监视css,html,javascript。

19.

Smush.it通过对特定图片格式的优化技术来减小图片大小，这是一个“无损”的工具，也就是说在优化图片的同时，图片样子和视觉效果没有发生改变。

20.

在线HTML表单创建工具。

21.

Zend Sudio 7.0是一下代专业级的php程序开发环境。其设计可以最大化开发者的效率，同时可以更快的开发和维护代码，解决程序问题并且提高团队合作效率。

22.

FireFTP是一个Mozilla Firefox扩展，是一个免费、安全、跨平台的FTP客户端。

23.

ExpanDrive 就像是你MAC或者PC上的U盘。可以在远程计算机上打开、编辑、保存文件。

24.

W3C校验器是W3C的免费服务，用于检查网页的标签的有效性。同样还有一个。

25.

jQuery UI 是一个开源的接口组件库-互动、小工具、动画效果，基于jQuery javascript库。每个组件都是基于jQuery的事件驱动构架编写，并且相当主题化，使开发者和任意技术层次的人都能整合到自己的代码中去。

26.

Clean是Ajax的开源引擎，提供了一个Ajax技术的高级接口。

27.

Relection.js 可以让网页中的图片呈现发射效果，它使用整洁的javascript代码，使你的代码更干净。

28.

Blueprint是一个CSS框架，旨在削减开发时间。它通过网格、排版、插件、打印的CSS给你的项目提供一个坚实的基石。

29.

CleanCSS是一个强大的CSS代码优化器和代码格式化工具。

30.

这个页面包含了HTML 4 和 XHTML 1.0 所允许的252的特殊字符，有所阐述。

31.

Pingdom是一个站点监视工具，可以7X24小时全年监控，有在线时长、响应时长的统计，还可以通过Email和短信来发送警告。

32.

Lightbox用于图片在网页上叠加显示。设置及其简单。

33.

免费的flash网页创建工具。

34.

BestFreeTemplates.info 优秀的CSS模板供您下载。

测试管理站点

35.

BrowserShots是一个基于web的浏览器兼容性检查工具，可以清晰的预览您站点在各种浏览器上面的显示效果。不需要注册，直接提交url，然后等待3-5分钟，BrowserShot就为您生成各种浏览器下面的效果图。

36.

在任意操作系统任意浏览器上查看你的web设计，检查javascript,DHTML,表单和其他动态功能。

37.

Are my sites up是一个简单的服务，当你网站下线是会及时的通知你。

38.

Google Analytics 是一个企业级的网站分析解决方案，让你对自己站点的访问状况了如指掌并且有效的进行市场推广。强大、灵活、易用的特性使你分析网站流量的方式耳目一新。通 过Google Analytics，你可以推广更有针对性的广告，占领市场主动权，创建更高回报的站点。

39.

W3Counter是一个免费的站点分析解决方案，可以回答你的以下疑问：网站用户是谁，他们怎么找到你的站点，他们感兴趣的是什么。

40.

跟踪和监视站点活动。了解站点数据是建立成功在线商务的关键。

19个针对设计师的firefox插件

本文转载自：译言-精品外文翻译： 19个针对设计师的firefox插件
 

译者序：09年快过去一半了，虽然文章早翻译好了，但懒了，一直没上。不过这篇文章有效期不止12个月，它依然可以指导我们在未来的设计中做出更好的页面，值得好好阅读和收藏。

系列文章：网页设计趋势发展历程之2009上

2009年网页设计趋势下

首先来看看过去几个月里我们发现和观察到的主要趋势。在这篇概述中，将带你逐一回顾每个趋势和漂亮的案例，他们将激发你在下个项目中的灵感。

1. 出格布局

2. 单页布局

3. 多栏布局

4. 巨型插图和充满活力的图形

5. 比以往更多的留白

6. 社会设计元素

7. 对话式导航

8. 动态的tab

9. 大搜索框

10. 为分类增加视觉效果

11. 作者头像

12. 图标和视觉提示

13. tag索引（替代tag云）

14. 在blog中使用插图

15. 水彩画

16. 手写体

17. 复古

18. 用有机材质、砖瓦和摄影作品做背景

19. 标记印章

20. 价签

21. 丝带

出格布局

正如在几个月前所做的40个创新设计布局：出格布局的展示那样，我们正在观察一种向更具个性和创新性布局发展的强大趋势。与使用传统四四方方的盒状布局不同，设计师们正在尝试新的信息结构、呈现和表达方式。

在这些出格布局设计中，整体创意往往比具体内容更重要，也更令人难忘。尽管如此，可用性、版式和视觉设计也很少被忽视，并被谨慎地执行。创新布局在大项目、网站设计机构和宣传网站（如大公司的商业活动）中尤为流行，但它也同样流行于blog中。

提到创意，可用和不可用设计之间的界限就非常模糊了；因此，可用性测试就显得尤为重要，因为一项新的创意能打破网站故有的东西。通常，折中考虑创意、经典和传统设计是一个不错的主意，也就是说要设法去取得一个“坚不可摧”（甚至最终很单调）的可用设计与一个有创意但不可用设计之间的平衡。记住，创意需要时间来成长：重新思考、修改、调整、优化，最终整合到你的设计当中。

我们强烈鼓励设计师打破传统盒状布局的惯例，去尝试新方式和你大胆疯狂的想法。施展你的才华吧！

单页布局

另一种设计师经常使用的、给访问者留下深刻印象的方式，就是所谓的单页布局：这种布局使用一个单独的页面来呈现网站的内容。它并不一定意味着这些设计就是极简的（遵循“少即是多”原则）。而刚好相反，这种设计往往十分复杂，它包含了丰富的图像和生动的动画效果，因此需要加载一段时间。

当用户点击了一个导航选项，页面随之改变（部分变化），新的内容就出现在了显示先前内容的区域里。这种布局中导航滑动和滚动的效果，由公共JavaScript库来支持。

对用户来说最主要的优势来自于一个简单的事实，即通过更少的鼠标移动和点击，来获得用户想要的信息。由于这个方法非常新，对那些使用非传统导航就会感到困惑的用户来说是个好机会。有些种情况下，一个“静态”版本可能会派上用场，甚至是有必要的；比如你将不得不为搜索引擎，和禁用了JavaScript的用户提供另一版本。

多栏布局

多栏（3栏以上）不一定就是复杂的设计。从反面看，如果设计得当，多栏对访问者会十分有帮助，因为它们为可见的导航选项提供了更好的综览，从而使得用户可以快速地找到他们想要的信息。

过去几年里，我们见证了网站内容的爆炸，这降低了用户在网站上所投入的注意力和时间（详情查看ReadWriteWeb）。所以，难怪设计师们都开始尝试寻找更简洁的信息呈现方式，既能让访问者在网站上停留的时间尽可能的长，又能更简单的找到内容。

实现这一目的的方法之一，就是使用多栏相邻的布局。这个想法十分合理。屏幕分辨率在最近几年里不断增加（然而，像华硕Eee PC这样的上网本得以广泛使用的话，情况可能会有所改变），从而可以为用户提供更多横向空间，也能给设计师提供额外空间去填充内容。

结果表明：现在越来越多的设计师，采用越来越多的栏在设计中。我们研究发现有向这些所谓多栏布局发展的强大趋势，通常在1000像素的屏幕中，宽度固定为850像素。多栏常被用在杂志布局和大项目中。在这些布局里，栅格常被用来保证结构平衡、层级和次序。

使用多栏布局，主动留白以及各自内部栏之间的重要性不能被夸大。（主动留白是故意留出空白，以更好地表现页面结构，强调内容的不同区域。）

为此，设计师常利用“Shneiderman的真言”（“首先表达大局，随后显示细节”），先为用户提供一个功能概况，然后按需提供细节——稍后，当某个链接被点击时（就是个最好的例子）。

巨型插图和充满活力的图形

如同巨型版式主宰当今网页设计一样，无论是专业还是个人网站项目中，巨型插图似乎都越来越受欢迎。设计师正试图用互动元素（植入式视频区）和视觉元素（导言区和插图）来传达网站的信息。在近来的设计中，插图比原来占据更大的空间，通常作为巨型版式的补充。它们更具吸引力，并且更加生动，因此更容易被访问者记住。

另外，设计师也运用一些充满活力的图形，尤其是为背景，也为其他设计元素。不同的风格和图形均被使用：如陈旧物、拼贴画、剪贴册、饰品、复古样式、水彩、有机材质和摄影背景等。

比以往更多的留白

或许最可预知、也最为有益的事情之一，就是在过去几年的网页设计中，留白日益突出。它在许多设计中处于首要位置，并被广泛用于改善网站的文章流和结构。

事实上，我从未见过内容区和导航菜单上有这么多内边距。外框和内容区的内边距在20至25像素正逐渐成为一种约定俗成的法则，甚至更大的内边距也被普遍接受。希望，这一趋势继续发展下去。

社会设计元素

纵观blog圈，你几乎找不到一个不使用社会性图标或区块，让读者通过知名社会性媒体网站去推广它们内容的blog。每个作者都希望得到可观的流量和认可，这也是为什么在当今设计中，社会性元素变得更大、更具吸引力。

社会性图标到处可见，但多出现于文章的右上角或底部。社会性区块经常被放在文章下面，有时也出现在相关文章列表旁边。Twitter，Flickr和Last.FM的混合仍然是blog和项目中常见的组合。

对话式导航

去年我们曾写过一篇名叫“对话式导航”的文章，在现在的很多网站中，貌似这个元素依然流行。导航所要完成的最大任务，是清晰地引导用户到达网站的不同地方。然而，要通过一两个关键字来表达内容是极其困难的，特别是使用横向导航。

这就是为什么通常导航没法用适当的关键字一个接一个简单列出的原因（即使用“无对话的”导航）。取而代之，设计师正在试图具体解释什么选项可用，什么是访问者点击网站链接后所期望的。

因为设计师正尝试开展与访问者之间的更多对话，所以我们愿意称这种方案为“对话式”导航，相对于那种建立在关键字列表基础上的“无对话的”导航。

导航区通常都是具有相同高度和宽度的区块，因此访问者感觉内容能被轻松引导。大图标也使用的很频繁，但在大多数情况下，它们是否适用取决于网站的内容和总体布局。导航设计中的鼠标悬停效果会让浏览变得更愉快。

动态的tab

作为交互设计中最流行的趋势之一，tab可以动态地改变内容区域。活动tab背后的想法是，当页面被加载时，所有tab的内容也被加载，但一次只显示一个tab部分的内容（属性展示被用来实现这种效果）。你可以参照教程动态的tab 和tab在jQuery中的视觉控制 来创建动态的tab。

网页设计师是变幻无常的。我们喜欢拿东西做试验，喜欢观察人们如何与我们的产品进行交互。我们喜欢尝试与众不同的设计方法，这些在将来可能会成为主流和经典。因此，随着新设计方法的兴起，越来越多的设计师关注他们、使用他们，新的趋势也就诞生了。

在过去的几个月，我们分析了很多网页设计，观察新趋势，权衡设计决策和代码解决方案的优点。在这篇文章里，我们将展示2009年网页设计趋势：动态、新的设计元素和新的图形表现形式。接着还讨论了这些趋势被使用的情况和现有的一些漂亮的案例。在这篇概述中我们还遗漏了哪些动态吗？发表评论吧，好让我们知道！

本文仅涵盖了过去几个月中我们发现的25个趋势之中的10个。第二部分将在下周发表。届时将涵盖布局、新的视觉表现形式和新的设计元素。敬请期待。

2009年网页设计趋势

首先来看看过去几个月里我们发现和观察到的主要趋势。在这篇概述中，将带你逐一回顾每个趋势和漂亮的案例，他们将激发你在下个项目中的灵感。

1. 凸版印刷

2. 富UI

3. 透明的PNG

4. 大字号(版面)

5. 自定义字体（sIFR 等）

6. 模式化对话盒/会话窗

7. 多媒体区

8. 杂志外观

9. 旋转木马（幻灯片）

10. 导言模块

好，现在就让我们到具体内容中去仔细看看上面提到的每个趋势。

1. 凸版印刷

在过去几个月的观察中，最出人意料的趋势，是凸版印刷样式（实际上压上去的字）出现在网页设计中。可能这种趋势产生的最重要的原因是因为，这种印刷术到现 今已经很少被使用了。凸版印刷以各式各样的风格被用在网站和主题上；尤其是，已经被频繁使用于产品设计和网站的在线服务中。

2. 富UI

我们欣喜的看到，用户界面在现代网站和网页应用中已经变得越来越漂亮、越来越实用了。在过去的一年里，这些网站应用的用户体验已得到大大改善，从而使得用户界面的丰富性和响应度都非常接近经典的桌面应用程序。AJAX和Flash在为用户提供动态交互的广泛应用上，已经有了先进、成熟并且专业的解决方案。

特别值得一提的是，过去一年里我们看到在设计元素中使用了更多的留白，更多的填充以及更大的空间。我们还注意到，许多现代用户界面用直观的视觉提示来表现用户与系统间的交互情况。比如，当按钮被按下时，它的外观就由“正常”变为“按压”（就像和上这样），确认并对用户与系统的交互给予及时反馈。除此之外，越来越多的服务能够进行用户个性化：对我们而言，这清晰的表明，更适用的用户界面将在2009年到来。

上述两个例子表明，网页应用的设计师们在功能介绍和改善交互性、响应度等用户体验问题上投入了更多的精力。

3. 透明的PNG

透明的PNG，尽管不被IE6支持，但从去年来看似乎已经得到了很好的普及。显然，设计师们试图更好地把背景图片融入到实际内容中，并打算形成一种风格，这在印刷媒体中很常见，比如在杂志中。在多数情况下，半透明背景从页面整体背景中脱颖而出，其目的是为了突出一个重要的设计元素，例如头条和公告。有时透明PNG也作为模式化对话盒(会话窗)的背景。

去年，我们描述了许多可以的方法，很多设计师似乎也在他们的工作中尝试着这些技术。有趣的是，透明经常被使用在设计的头部或底部，但也 超越了这种定式。

4. 大字号(版面)

在之前的文章（， ）中，我们列举过一些大字号(版面)的杰出案例。2009年，大字号(版面)将成为主流。特别是设计机构，开发大型项目，做产品网站和在线服务的，他们会使用大字号(版面)来传达自己网站最重要的信息。

这些设计元素的字体大小通常都要超过36px，在很多情况下，为迎合观众都会使用非常漂亮的字体。总的来说，设计师投入更多精力在排版的细节方面，如主次关系，行高和字体的选择。其结果是：网站更漂亮，风格更一致，看起来可靠且值得信赖。

5. 自定义字体

就像设计师花费了更多精力在排版上一样，他们也更注重用来作网站正文副本的字体。尽管有像Helvetica, Arial, Georgia和Verdana这些毋庸置疑地占据统治地位的经典字体存在，我们仍观察到有一股向自定义字体发展的微弱趋势（例如使用sIFR）。

有趣的是，这些字体往往无缝结合于网站设计中；它们几乎从不需要网站因它而“更新”排版。设计师们试图融合漂亮的版式和炫目的视觉设计，以此来改善网站的外观和用户体验。

6. 模式化对话盒/会话窗

模式化对话盒（会话窗）其本质上就是一个改进型的弹出窗。它们以友好的界面替代了传统JavaScript弹出窗口，并且使用户的注意力始终集中在网站最重要的区域内。状态窗通常是被用户的动作所触发（如注册或登录），并且出现于主内容之上，就像桌面应用中的一个窗口。会话窗往往以一个非常微妙的方式出现：它们通常采用半透明，并且有一个“关闭”按钮。

7. 多媒体区

随着更多宽带网络的接入，相比两三年前，用户已经可以浏览更丰富的内容，设计师可以借此机会，用更具吸引力和值得回忆的方式来呈现内容。怪不得一些产品网站用多媒体区（录像和视频）来展示他们的内容。这类元素的主要优势还在于，它们可以快捷有效地表达内容，并使用户更易于消化这些信息。

用户要做的只是靠在椅背上欣赏；它们会把每件事按部就班地展示出来，不需要用户点击，搜索说明，或是学习导航如何使用。影片通常都简明扼要；它们大多正式，但也不乏娱乐。

但请明白，视频只是网站内容的一种替代形式（而不是主体和唯一！）。不是所有人都通过宽带上网，也不是所有人都愿意看视频（因为他/她可能正在听广播或音乐），更不是所有人的机器上都安装了Flash和JavaScript.

8. 杂志外观

在Blog的设计中有一个非常有趣的现象，许多手法通常来自于传统（印刷）媒体。从页面文章的排列、排版的运用、插图，甚至到文字对齐方式都与传统印刷技术的手法相似。栅格化设计变得日益普及，但多用于大型项目，产品页面和大型的Blog；它们几乎不在公司网站或网上商城中出现。

9. 旋转木马（幻灯片）

旋转木马其实就是幻灯导航，它的内容垂直或水平轮转（因此得名“旋转木马”）。要达到轮转导航的目的，用户需要点击其中某一个切换元素（通常是左/右或者上/下箭头）。当进行切换时，内容就向所选的方向轮换了。

过去用户为寻找他们所喜爱的内容需要点击网站中的很多章节，取而代之，现在可以快速浏览可见的内容，省去了滚屏和不必要的鼠标移动。这样做的好处是：用户不但节省了时间，而且使他们的注意力更加集中到内容中，而不是被分散到浏览器窗口上。这类幻灯导航经常被使用在娱乐网站和大型Blog上，但设计师也可以把它用在大型项目中，以更互动的方式来展示自己的工作。

10. 导言模块

网站的左上部是页面中最重要的区域，因为它最能吸引访问者的注意力。因此，把网站最重要的信息放在那里是再明智不过的了，这样就能确保访问者尽可能快的看到信息。

事实上，这也是许多设计师正在做的事情。不管是为网站应用、公司设计、在线服务还是大型项目，设计师们都会把他们的标语和简要导言放在页面顶部，通过使用粗体和生动的排版，给用户留下一个好的第一印象。一些导言是简短的，也有一些够啰嗦的；无论哪种，它们都会占一大块区域；与布局等宽，高度在 250-400px之间，已成为这些导言模块的通用尺寸。值得注意的是，这些模块几乎从不出现在Blog中，网上商城中也很少出现。

敬请期待！

本文仅涵盖了过去几个月中我们发现的25个趋势之中的10个。第二部分将在下周发表。届时将涵盖布局、新的视觉表现形式和新的设计元素。敬请期待。

photoshop笔刷真的是非常实用，它可以在你的工作中节省大量的时间. 就像你在这里（Naldz Graphics网站）注意到的一样. 我收集了一些photoshop笔刷.

我计划收集尽可能多的实用的photoshop笔刷,让你更容易的在这里找到你所喜爱的.

这里有400多个免费的高质量的水彩笔刷.

这些笔刷可以免费应用,但是如果用于商业用途的话有一些仍然需要得到作者的授权同意.

你也可以查阅其他的photoshop笔刷.

一套包含15个水彩笔刷的笔刷集.

包含17个笔刷. 这套笔刷要在photoshop7或者更高版本的程序中应用.

25个高分辨率的水彩笔刷. 分辨率1500px- 2500px. 文件大小大约在 42Mb.

26 个高分辨率的水彩笔刷. 分辨率在1480px 到2500px. 文件大小大约是50Mb.

这个笔刷集包含20个高质量的水彩笔刷.

这个笔刷集包含32个笔刷. 这个笔刷要在photoshop7或者是更高的版本中应用.

重装上阵

这个笔刷集叫做水彩重装上阵. 这个巨大的笔刷集包含了82个（分辨率在700-1200px）的笔刷.这个笔刷要在photoshop7或者是更高的版本中应用.

这个笔刷集包含了25个笔刷. 这个笔刷要在photoshop7或者是更高的版本中应用..

这个笔刷集包含了14个高分辨率的笔刷. 它们大概在1597px到 2500px 的尺寸间. 该笔刷针对于photoshop CS1或者是更高的版本.

包含了20个水彩笔刷

包含了10个高质量的水彩笔刷.

包含4个高质量的水彩痕迹笔刷.

包含6个高质量的水彩笔刷.

26 个高分辨率（2500px）的水彩笔刷下载.

包含38个水彩笔刷

包含了16个笔刷. 该笔刷针对于photoshop CE或者是更高的版本..

包含8个高质量的水彩笔刷.

这个笔刷集包含了24个独立的笔刷. 在photoshop7.0或者是更高的版本中应用.

不久我会罗列更多的photoshop笔刷. 你喜欢什么类型的photoshop笔刷? 在下面给我留言吧.

没有什么比这更恼人了：创建并装饰了一个网页，认为已经做到完美，但测试时却出现一些未知的错误，并且不易改正它们。一个对付此类错误的技巧就是首先验证你的标签和样式表。很幸运，有许多免费工具可以验证你的HTML，CSS以及RSS源是否正确。有了这些易用的工具，你就可以放心，访问者看到的就是你想要展示的。

我们已经收集了14个工具，包括在线工具和Firefox插件，必有一个满足你的需求。

Firefox插件

：提供到W3C CSS验证器的易用链接，你可以通过右键的上下文菜单或者工具菜单来进行访问。

：Firebug是一个功能齐全的调试器和编辑器，使用它你可以开发单页面的HTML，JavaScript，CSS，DOM等等。你也可以使用其插件来实时监控JavaScript，CSS和XML，找到其中可能出现的错误，并学会如何修正它们。作为每个设计师工具仓库中的重要一员，Firebug越来越通用，甚至开始有了自己的插件（如SitePoint的CodeBurner参考工具）。

：基于Tidy和OpenSP，HTML Validator对你访问的页面进行验证并给出简单的图标提示（icon notification)。工具可以给你提供更多信息，当你查看页面的源代码时，验证错误将被高亮显示。更棒的是，如果你不能找到错误所在，插件会给你一些提示。

：通过打开右键上下文菜单，或者从工具菜单中选择“Validate Page”，Page Validator会开启一个新的Tab页面，显示W3C在线验证工具的验证结果。

：通过右键上下文菜单或者选择工具菜单项，RSS Validator可以很容易的让你检查一个RSS源。它会将会带到一个新的Tab页面来查看结果和任何潜在的错误。

：Total Validator通过一个便利的插件提供给你大量的工具。浏览你想看的页面，选择”TV“图标，可对各种版本的HTML进行验证，拼写检查，屏幕截图等等。

：Validaty在你的工具栏中增加一个按钮，但你浏览页面时点击此按钮，就可以看到一个简洁的可视化的验证结果。

基于Web的验证器

：W3C(World Wide Web Consortium)是一个开发Web技术标准的团体，理所当然，他们会有一个验证器来检查你的HTML是否正确。被检查的文件可以是在线的，也可以直接上传，验证器有多种格式来显示验证报告-附加建议的，概述形式的，附加建议的（重复的？），等等。如果你想检查你的标签，接触一下规定标签如何工作的同志们肯定不会错的。

：W3C同时也提供了一个CSS验证工具，它也可以检查你的标签找出潜在的错误和警告。同样的，你有一些选项来设定不同的CSS场景（profile），指定样式表为何种媒体创建，以及控制报告显示哪些信息。

：FeedValidator首先确认你给它的RSS源是否有效，然后检查你最新的内容条目，给出问题的概述，高亮标示出存在问题的行。非常方便的确保你的RSS源在各种阅读器中正确的显示。

：Relaxed没有使用官方的W3C规范进行验证，而是使用自己的一些规则来验证你的文档。你可以选择你所使用的HTML的版本，选择是否显示源代码，是否使用一个”脏“浏览器，以及几个其它选项。它也可作为一个Firefox插件，直接在你的浏览器增加这些服务。

：Validome就像验证器的一站式商店。这个网站提供各种工具，来检查你的HTML，XML，DTD-Schema，RSS，以及Google Sitemaps。每个工具都大量的选项，调整它们来满足你的需求。

：VirtualPromote为开发者提供大量的工具来应对不同的任务，但对于前台开发者来讲，最重要的三项就是HTML，CSS和XML的验证器。

：xhtml-css.com可以快速的浏览一个站点，来验证HTML和CSS。其提供的服务包括列出所有错误以及你需要关注的可疑告警，以及关于问题性质的详细描述。你也可以使用一些更高级的选项来设置HTML编码，设置CSS的场景和适用的媒体。该站点还提供一个名叫BeValid的Firefox插件，它可以更快的帮你验证正在访问的URL。

哪一款工具是你的最爱？

45个顶级性感美女插画

所有的女孩子们都看起来漂亮并且富于生气。其中一些作品在我的脑子里停留了很长的时间。慢慢欣赏吧～～

------------------------------------------
 

本文转载自：译言-精品外文翻译： 45个顶级性感美女插画
 

如果您经常性地需要建立和开发新的网站，那么您就应该考虑使用模板创建，收集有用的代码片段等等。为了加快开发的进程，您就应该这样做，在需要的适 合您可以使用、修改并优化这些模板文件；如果是作为商业用途的您应该检查下许可条款。然而，到目前为止，这是从最榜的站点中挑选出来的最好的站点的普通清 单。好好地使用它们吧！

“CSSTidy 一个开源的CSS解析器和优化器。 它可以作为可执行文件 (Windows, Linux 和 Mac 中是有效的) 控制每个命令行和作为PHP脚本 (这两个功能几乎相同).
相反，大多数其它的CSS 解析器都没有使用正则表达式，而CSSTidy则完全支持CSS2且具有更高的可靠性。”

贴上它们的信息，因为它们说的比我说的要强多了。

某些人可能会有个疑问 - 为什么您需要优化自己的CSS代码? 仅仅因为，如果您想要更清洁的代码，更快的载入速度，这样，你们俩 - 您跟访问者都将得以与此！

or use !

您也可以使用这个非常类似的在线优化版本，但我是个反复无常的人，所以我用这个网站要更多一些。这就要求挑选一个您喜欢的吧！

“Blueprint 是一个 CSS 框架, 其目的是减少你的CSS开发时间。在您项目的顶部预置它会给您的CSS打下坚实的基础。非常易于使用网格、合理的排版甚至是用样式进行打印。”

非常有用的模板文件，帮助您不是反复地从零开始编写代码 - 现在您可以花费更多的时间来天下新的特征和考虑如何设计，然后是反复的过程。

收藏了许多非常好的，如CSS布局、代码段 (CSS, JavaScript, PHP), 网站模板等。这使web的发展进程变得敏捷。良好的使用使用这些吧。

Snipplr是存储和组织很多代码片段的非常有用的地方 (Javascript, HTML, PHP, CSS, Ruby)。随着您的发展进程会经常使用。并且每个人都可以分享和添加它们的片段，当然，这部分中热门代码段无疑就是代表最佳的和经常被大家使用的。

Eric Meyer CSS reset 非常受还有。您应该使用重置来消除浏览器之前默认风格的不同。同时，Eric也指出，这仅仅是个起点，但非常好用。

“每个YUI库中的组件都有300个一些列的例子来说明它的实施。这些例子可以作为您研究YUI的出发点，如，获取代码段作为您编程的开始，或者只是作为您开发各种互动模式灵感的源泉。”

非常有用的模板文件，出发点非常好，并且收藏了很好的例子以满足于几乎所有的网页设计师。

这个网格系统正在变得很受欢迎 - 他们提供常用尺寸, 基于 960 像素的宽度，提供 12 列跟 16 列网格系统。设计师们使用网格是为了使它们的网站看起来更为和谐和精准。当您下载了该网格系统，会得到几个模板文件跟mockups，它会是您的得力助手。

/

这个框架也是基于 Eric Meyer reset 系统, 当然也有许多新的基础样式特征，没有任何双重重置和更多，到它的首页查看更多的细节吧。

我猜测，您肯定听到过不少关于圆角实现的争论和如何创建它，从这里您可以快速地在线获得圆角跟样式。

良好的框架集有助于您迅速快捷开发新的网站，使您更加关心图形设计而不是代码的编写。

我希望这些参考网站有助于提升您的技能并加速您的发展进程！我相信除了这些网站之外还有许多，如果您知道一些，那么请您留下链接地址，感激不尽！

除此之外，您也可以参考下这些文章：

板凳