四个原则帮你设计一个好的网站

发表时间: 2010/02/04     分类: 网页设计     没有评论



我最喜欢的一本设计书籍要算《Robin Williams Design Workshop.》。它采用的设计理论和展示例子都非常棒。 我归纳了一下我设计中所采取的四大设计原则。它们包括:对比,重复,对齐和邻近。

这篇文章将讨论这四个原则,因为它们与网页设计息息相关。通过保持这些设计理论在你的耳边,你一定会设计更简洁、更美观的网站。

1。对比

巨大的反差可以给用户留下一个很好的第一印象。如果没有一个焦点,浏览者将会迷失在同样大小的元素和版式中。这是设计人员的工作创造意义的视觉元素,引导用户的体验。所以你可以选择你的图像、颜色和字体,并且合理地在您的网站形成对比,突出重点。

图片对比

这往往是非常有效的,以展示一个大画像旁边较小的元素。下面是我的意思:

The Invoice Machine

这个网站采用了大量的图像,使在读者的注意。另外网站的单色性允许有限使用蓝色发挥更大的作用。

invoice-machine1

Instabox

这个网站做的视力检查。你先通知?更可能是包装盒上的明星。就像The Invoice Machine,他们已经使用一个大的图像和有限的颜色创建了一个焦点。

instabox1

对比色

在色彩上喷洒适量的另一种对比色的方式来建立一个网站内有效的对比。它可以通过对标题和文本以及在一个图像或说明上采用不同的颜色。

Fatburgr

这个网站是一个非常适合用来说明设计原则的例子。对于色彩对比,我们可以通过大与小的浅灰黄色、对齐、图像对比度、重复和接近都运用的非常棒。

fatburgr

I Love Typography

有很多惊奇的是以展示印刷感觉的网站在头部的运用给了我们非常好的例子?我喜欢他们的字体选择,以及如何很好的发挥偏暗灰的绿色。

i-love-typography

对比字体

如果您尝试创建具有字体的对比,你应该避免使用两个非常相似的字体和大小。字体的相似性,往往会造成混乱和模糊的设计。然而,如果你的字体大小不同,大胆的运用,它也可以非常有效传达出效果。此外,您会惊奇的发现您可以通过使用两种不同的字体在视觉效果令人印象深刻。

Fixie Consulting

哇!我喜欢本网站上的版式和颜色。检查所有的大小和点击他们口号的变化。我还喜欢随意的挥洒和比较巧妙的运用蓝色。

fixie-consulting

2。重复

在印刷设计中重复比在网页设计中运用的更为普遍,但重复的设计元素在网页设计中同样有效。这种手法有助于创造一种一致的外观,提高品牌。在网页设计一个伟大的方式实现这一目标是重复在页眉和页脚元素。可以看看下面的几个例子

Ten24 Media

Ten24 Media在页眉和页脚都使用了草地找一个重复的元素。

ten24-media

Silverback

这个网站非常棒!虽然他的对比度上运用的非常棒,但我们从它的主题和品牌简单的重复手段的运用相比就弱了点。使用香蕉作为查看列表的图标,并在页眉和页脚用森林的元素。

silverback

3。对齐

对齐在网站设计扮演着一个从业余到专业的复杂的角色。我最近成为在网站设计中使用一个网格的倡导者。这样做可以规整你的设计为您提供了一个框架。

Black Estate Vineyard

此网站上展示的 960 Grid website.。它的路线是一致的。我主要喜欢内容和列的合理安排,较大的一级标题 , 左侧侧边栏的转变和他们还做了大量留白和运用了字体和大小的对比。

estate-black1

A List Apart

A List Apart 具有明显的视觉网格。该列是明确和遏制一切非常可读块。研究表明 , 真正宽列大大减少可读性。当试图在广泛的后续列宽的文本阅读时你的眼睛容易看累。

a-list-apart1

4。邻近

最后一个原则是接近。这是与这样的元素组合在一起,分离那些没有。它真的可以毁灭的用户体验,如果你到一个整组中的所有文本块。这就是为什么它很重视标题标签和使用适当的间距。

Envato

这个网站做了组织分为三大类它的内容,美丽的工作。他们有足够的间距,要明确界定。

envato

Paradigm Reborn

这个网站很有条理。该头是清晰,简明。间距是好的,内容分为逻辑块分开。

paradigm-reborn

最后的思考

这是令人难以置信如何更好地将成为你的设计时,考虑到这四个基本原则。总是有更多的事情要考虑,但对比的基础上,重复,对齐和邻近将大大提高您的设计。

本文由优艾点翻译,译自http://www.myinkblog.com/2009/03/21/4-principles-of-good-design-for-websites/,转载注明出处,谢谢合作。

Related Posts with Thumbnails

感兴趣的话可以阅读下面的文章:

本文标签:
作者:优艾点
原文: 四个原则帮你设计一个好的网站 - 优艾点(UiSpot.com) | UI素材,网页设计,GUI设计
版权声明:原创作品,允许转载,如需转载 请务必以超链接形式注明:来自优艾点网站以及原文出处。

喜欢就订阅吧:

订阅我的博客:
跟随新浪围脖:
跟随鲜果联播:

赞助商鸣谢:

发表您的专属评论