您的位置:首页 > 运维架构 > 网站架构

优秀网站设计中高效控制留白的技巧实例

2009-09-27 12:01 260 查看
“优秀网站设计”是所有人追求的目标,在网页设计的世界中也不例外。不过何为“优秀的网站”,如何判断一项设计是好还是坏?笔者恰好有一套找出网页设计中优秀焦点的方法。一旦你了解到如何判断一项高品质的设计究竟好在哪里,你就掌握了让自己的设计更趋完美的大量技巧。
接下来我会给大家列一些要点,这里拿国内有名的模板网站模板库中部分模板作为实力,与大家分享一下我在别人的网页设计中寻找“优秀网站”的过程。





01. 留白

在好的网页设计中我最留意的是那些对设计元素之间留白的聪明运用。上面是一款古筝的网站模板,你可以发现不同内容区块之间的间距和排列方式,能让你的设计的整体感官大不一样,从而提升设计的品质。
我觉得处理好留白的关键是从整体上感知设计元素。把设计稿缩小观看会是个好办法。

出色的留白处理的实例

古筝网站
页面整洁而有开放感,全都得益于设计师对文字和图像之间留白量的准确把握。



这是一款礼品网站
在大空白上展示的元素往往更具吸引力。这款礼品网站模板创造了极佳的亲和力。



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



汽车网站 上也有很多空白
仔细观察这款汽车网站模板的网站,你能看到边缘处的留白应该如何处理。它的方框边缘有60像素的边内留白。听起来似乎挺大的,实际看起来效果却好极了。



留白时的错误

大家在设计留白时的最常见问题就是各个区块的内容到边缘距离太小。不论你的设计多么有风格,如果你硬要把东西塞得紧紧的,这些风格连同设计的品质,就都流失了。

留白不够的例子

我们已经看到下面这款旅游网站模板那些大留白创造了多么动人的效果,所以下面我们修改一下它的页面,看看减少留白会是什么效果:



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

高效控制留白的技巧

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

使用网格辅助设计
利用网格当然能帮助你理解元素之间的空白。

不断尝试
不断尝试—失败—尝试,直到找到最佳方案。

留白并不是浪费空间
空白并不总是等着你去填充的。
没错,少就是多
与其用尽心思填满某个区域,不如就把它留空,只保留至关重要的信息就好。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  职场 休闲