晋升网页和博客设计品质的一些实例和技巧  
“高品质”是所有人追求的目标，在网页设计的世界中也不例外。不外作甚“品质”，如何判定一项设计的品质是好仍是坏？笔者刚好有一套找出网页设计中品质焦点的方法。一旦你了解到如何判定一项高品质的设计毕竟好在哪里，你就把握了让自己的设计更趋完美的大量技巧。

接下来我会给大家列一些要点，并附上相应的例子，与大家分享一下我在别人的网页设计中寻找“高品质”的过程。



   01. 留白
   在好的网页设计中我最注意的是那些对设计元素之间留白的智慧运用。留心不同内容区块之间的间距和排列方式，能让你的设计的整体感官大不一样，从而晋升设计的品质。

   我觉得处理好留白的枢纽是从整体上感知设计元素。把设计稿缩小观看会是个好办法。

 精彩的留白处理的实例 Good.Is  
   页面整齐而有开放感，全都得益于设计师对文字和图像之间留白量的正确掌握。



 Digital Mash
   在大空缺上展示的元素往往更具吸引力。Digital Mash的网站创造了极佳的亲和力。



Creatica Daily 的大量空缺
    优秀的留白运用又一次让网页内容成为焦点。每篇文章中都有大量内容，不外该站点的设计师们并不惮于给这么多内容之间填上大量留白。并不是说你的文字不够多，就不能用良多留白。



Postbox 上也有良多空缺   
    仔细观察Postbox的网站，你能看到边沿处的留白应该如何处理。它的方框边沿有60像素的边内留白。听起来好像挺大的，实际看起来效果却好极了。



留白时的错误
    大家在设计留白时的最常见题目就是各个区块的内容到边沿间隔太小。不论你的设计多么有风格，假如你硬要把东西塞得牢牢的，这些风格连同设计的品质，就都流失了。

留白不够的例子
    我们已经看到PostBox的网站那些大留白创造了多么动人的效果，所以下面我们修改一下它的页面，看看减少留白会是什么效果：



品质感显著下降了。留白的影响就有这么大。

高效控制留白的技巧
    各种不同情况下，留白要求都不尽相同。你需要不断练习自己，做到对留白所能带来的改变时刻心中有数，从而有效地利用留白知足设计需求。这要靠个人感觉的，不外都能从实践中锻炼出来。

使用网格辅助设计
    利用网格当然能匡助你理解元素之间的空缺。
不断尝试
   不断尝试—失败—尝试，直到找到最佳方案。
留白并不是铺张空间
   空缺并不老是等着你去填充的。
没错，少就是多
   与其用尽心思填满某个区域，不如就把它留空，只留存至关重要的信息就好。

  02. 像素级的完美 
    有一个方法能够看出某人在完成一项网页设计时是否真的专心了。有时候创造奇迹的就是一些小细节，一些别人几乎无法察觉的细节。我所说的“像素级的完 美”就是指在线条、边沿和边框描边上仔细推敲。与其就用一条单一的线，不如多加一些细节。细节可以是细微的渐变，也完全可以只是一条1像素宽的细线（用作表现暗影或高光）。有了这些细节， 你的设计会大不一样。有些设计师在这方面特擅长： Collis Ta’eed,David Leggett 以及 Wolfgang Bartelme.

像素级完美细节的实例 Envato的细节鉴赏
    下图的Example 1 (例子1)中，绿色内容框的边沿有一条更亮的绿色线。而Example 2处，区块内边沿有柔和的渐变暗影，而边沿之上还有一像素的白色描边。这做法非常智慧，用暗影来夸大高光。后面的绿色区域有非常柔和细微的光影效果，有助于将留意力吸引到下面的白色区块中那清新脆爽的细节上去。 尽管这种做法并不是总能让设计看起来更加精致，不外它们的确能匡助你赋予设计以三维的真实感。于是设计元素就成了镶嵌在页面上的宝石，而不是平铺在上面的一张毫无动感的纸。



Tutorial9.Net上的细节
   David Leggett 对于如何制造 单像素顶边条 有很深的理解。他最近重新设计的 tutorial9 集合了良多非常棒的像素化技巧。 Example 1 处你能看到，他是如何仅仅通过添加一条1像素的高光，而将导航标签变得更有质感。Example 2 处使用的技巧则更多了。相机图标的投影，下方白色区域的暗影与高光，以及导航条上的1像素高光。



RedBrick Health上 按钮和分割线上的完美像素级细节
   这个漂亮的导航菜单，由 Ryan Scherf 创造，是使用完美像素级细节晋升设计品质的绝佳实例。红色按钮有1像素的高亮，链接之间的分割线也有平等的品质与细节。正如你所看到的，他没有知足于只用一条灰色线分割，Ryan还在下面添加了一条1像素宽的高光线，避免了设计看起来过于平坦。



完美像素级细节也合用于Grunge风格: AvalonStar

   下面的例子是漂亮的AvalonStar：Distortion（扭曲）主题博客，有着极赞的grunge风格。不外，即便是肮脏做旧的grunge风，利用1像素高光也能创造大不同。下图的Example 1 处，上面的棕色区域有一个渐变暗影，下面的绿色区块的顶部则有着一条1像素高亮线。暗影与1像素线的结合，让这些区块显得更为精致。



完美细节小贴士
      要在这一技巧上达到完美，不断的实践尤为重要。如您所见，一条1像素线这么简朴的东西就能给设计添加非常酷的深度感。你甚至不一定要用到那些倒角或渐变，费尽心力做一些实其实在的置于某对象之上的效果。

一定得是细节
   小细节完善内容感官是枢纽。
思索像素级题目
   描边、渐变、线条、暗影等等，不用太宽大也能有效增强设计
前后对比
   应用效果后留意与没有这种效果之前进行对比。如斯你就能知道这些细节到底带来了哪些改观。