一、合理使用渐变
" A9 W3 R7 F( E2 F/ w c
0 v" e4 s3 O6 b9 A 渐变不要滥用，更不要把渐变弄的跟彩虹似的，否则你的网页作品看起来比较外行。总而言之，合理的使用渐变对于优秀网站设计是有帮助的。, O( D5 N7 U& [3 |( m
$ s# V0 X: C4 n, A3 m! k, B 渐变、散景结合使用
6 k1 P' @ G& N, m7 @; c5 b# i0 P E# Z4 ~: v
Newism网站色彩丰富，但微妙的渐变与背景在视觉上结合的很到位。如果你也有兴趣在photoshop里面做这个散景效果，可以去Abduzeedo’s tutorial网站上面学习一下。
# `+ V) z5 A5 j4 N. S3 ?0 F6 a; E$ X
渐变、投影、纹理结合使用。; ~; b# c8 \) }" [# l5 K
* v4 E" ^0 z+ K1 v! V
OnWired网站应用了这些设计技巧，显而易见，他的设计作品效果是很棒的！自始自终OnWired网站设计在应用渐变、投影、质感这方面是恰到好处 的。我也特别喜欢设计师设计的这些。; w0 W1 p" B9 G
5 D2 ]9 Q+ k) b* I- q/ q7 v 二、留白
! }, C6 \* i6 ?1 i, _2 m! |2 Q4 c1 K0 L3 {' y
留白一词往往容易被误解从字面解释 的空白。网页设计较 为准确的描述则是网页各个板块元素之间的空间范围。进一步分析看看A List Apart是如何定义它 的。2 n$ ^6 g$ M9 ?1 Q# M
2 }* ~, u' A$ W4 p' w8 `0 I “留白”对于网页设计是很重要的，留白不至于让你页面元素都堆积在一起。对于年轻设计师来说留白可能是一个大问题，他们在做设计的时候将整个页面放的满满 的，没有给页面足够的“呼吸空间”。这对于他们来说可能不是什么问题，如果内容放不下的话，他们可以借助浏览器的滚条来扩大页面的空间。
, l) {1 a2 L( V- X1 s5 A& E
w; j$ t1 U' l+ ^" s; x- A 优秀的留白与巧妙的分割线
8 a0 F# K: r9 {, I& k; W& `) _; H. ?& _ _% U, q; ], E* H/ u/ r
Snook网站布局方面设 计的是比较合理、舒服的。同时注意一下，网站里面的虚线将各个板块区分开了，这样我们在浏览网站的时候就一目了然了。- D, i( G2 |; y
3 o `+ L% Z7 d9 {8 ~) L, J
抽象图形: ?& E9 U1 m6 M3 K
8 O) L; C. i9 J2 `/ S# y" C
沙发采用抽象、美观、简约的方法。通过使用无背景或杂乱的图像，给浏览者的空间 是流畅、舒服的。* L; ?: S, B" `
+ c$ m7 {2 S6 z( Z 三、网格布局! n# R; I/ v$ G: m" J& O
6 M8 D5 K5 P# `# D: K 网页设计的网格布局最初的灵感是借鉴了报纸的排版。但是如果你仔细观察周围的事物都可以找到网格现象，从好的设计到生活中的交通网。
4 N G/ \% P2 Z# p h' a
$ x0 @" {) b8 ~2 C; G+ m! S4 n" m 960和蓝图可能是两个最流行的网格布局。我个人比较喜欢960网格布局，它简单、重点 突出。你可以用任意对齐方式来安排你网站的元素，对齐在设计一个复杂的页面时，能使你的网站看起来比较精致、井然有序，并且你在网页布局里 面添加任何模块内容时候都不用考虑其他的模块内容。7 Z$ L. B8 Y9 H# `
. W. C: i! P! D1 c- e, j# A4 s 综合使用网格布局
, g( G3 I7 G! Q% h# A* E
; U! I. Q# e6 h. f p! J# H2 l. Q Poccuo网站综合使用了网格布局，它 采用3列和5列相结合的布局方式。给人以视觉吸引力和视觉空间。9 I( U |# U4 k }* F+ E6 x
- H6 v$ K' Q4 z% E. [; t 博客采用列布局
& Q1 Q3 Y B5 f/ u1 z+ }& w1 _
我比较喜欢Web Design Ledger首页最上面的展现方式，他把最新的公告内容放大同时放到页面最顶部，其他的以3列的方式排列。
! ~2 F. l. t3 C6 m! F' a& P' v
5 T3 [. E7 _+ }, Y 大量使用相等的列布局
3 T, x7 @3 K5 O( Q$ d' s
) J* q- r( @4 ~) v Ecoki漂亮的网页布局显而易见采用的是4列、2行布局，同时幻灯片、缩略图、最新的审 查也是采用相同的方式。, B' ]& K3 v! X& x1 }
1 U8 R: n: ~) H2 w9 n
四、改善字体应用% [. }: @+ W5 X' |3 I
3 R$ t. I4 |4 m+ f! k* ] 字体应用困扰着大多数的设计师。如果要想提高你的设计水平，字体在其中扮演着重要的角色。不但在可读性方面也扮演着重要的角色，同时还可以增加设计作品的 氛围。
( [" C- `7 f7 X* e0 g% H, c# h0 t/ n, v* k0 n5 Y
用对比字体引起关注
0 k5 i7 I/ ?) A" T4 q# b1 @
3 X9 n) } o. G+ c' { SimpleBits网站在应用各种对比 字体引导浏览者的注意力方面做的很棒。字体对比可以采取不同字体对比、各种颜色对比、字体大小对比等形式。
# |9 C; J; a$ i2 P8 c7 w: @9 H1 y0 F# n) m
不要认为字体就像标志% u8 V# }- `" d$ M3 \! Y1 ]
, y1 p0 }) ]" K( a 这个网站看齐来就非常的漂亮、舒服，但你可以说出你的想法和感受来描述这个感觉。尤其在间距、字体选择等字体应用这方面做的挺完美的，我就被他的logo 字体应用迷住了。 U& ^; l; B; ^. N: [! e) F4 n
4 h- r6 V7 v& b8 q6 M4 t5 A; ] 五、明确而有效的导航' u1 u6 M. O" J r. ]+ o& M
8 W3 R# t; ]7 b: h, z
良好的导航对于网页设计来说很重要，如果浏览者不能快速、便捷的找到它，他们就很有可能去别的网站了。这是我们所不愿意看到的，同时我知道 MyInkBlog进行了一些改进，并将在以后重新设计中进行彻底的改进。 C2 @2 g9 F% h4 h
1 k1 P" W' S& n
博客导航下面显示分类导航
3 f9 }8 W8 ^6 B; k
7 x6 x( [) b& ^7 t" c 在大多数情况下，博客导航放在页面的同时将分类作为第二导航放在页面的边栏。Tutorial9做 了一件了不起的事情，他把浏览者关心的photoshop资源以生动的方式展现出来了，并且在鼠标经过二级导航的时候有一个高亮效果。( U4 G' F% h; y$ ]
}+ Y* M2 b1 _5 _2 R2 | 切换不同的图标效果7 \* _1 \. u' [* j3 o9 `3 Y
- e' W# s5 A) G9 z3 r1 l' M 图标切换效果在web2.0网页设计里面无论是否需要被大量、胡乱的应用，并且成为一种趋势。并不是所有的都是不好的，web2.0里用的不好的原因是过 度使用、业余使用造成的。在大多数情况下，适当的应用图标切换按钮是相当有效的。Carsonified网站在导航上就运用了单色、简洁的图标切换效果， 并且于他的网站整体感觉想吻合。
3 T2 q, I8 k! y, W9 v' k' A) B& O2 o0 Z1 y
六、使用漂亮实用的页脚" G" N0 f% j. Z4 o9 h% G
1 V. s3 M5 _' ]7 O u8 [( L* V6 _) v 一开始我们就将页脚作为次要的内容，在页脚里面放置一些没有多大用处的内容。在设计的时候仅仅花费一点点心思在它上面。现在页脚对于整体设计来说变的越来 越重要了，千万别错过好的页脚完成你设计。3 V+ s% `* d+ D$ _
, b* s, L9 O0 \8 f6 G3 u- `* n0 v8 o 展示大量的信息和证书5 N( {! p# J% D! W. L/ e
+ Z2 M/ {+ y& w4 I 这个页脚主要展示了网站介绍和版权等必要的信息。Brian Hoff网站更是添加了一些个性、有趣的内容在里面。通过3列布局方式展示了作者的工作和建议性的内容。" L% Y+ X( W8 A4 n
/ r: S4 n' z, u7 J M- r+ U! a |
