当前位置:绿色下载绿色下载文章资讯网页设计经验技巧

网页设计中纹路的运用技巧

减小字体 增大字体 作者:佚名  来源:本站整理  发布时间:2014-12-23 09:54:25

texture在界面设计中应用已经越发完善了。它将形成一种趋势,简单而有效的为web页面设计添加几分深度感。 充分发挥texture的威力是一份伟大的职责。它不仅能够很好增强web设计的表现效果,对于设计师来说还是一个质量上乘的好工具。它的美妙作用是可以引导浏览者的视线,强调关键元素的重要性。

然而,长期以往texture似乎总和“脏乱”或者“低劣”UI设计为伍,它的滥用处处可见,像乐队的website等,对于设计师来说,它遗留下来的滋味可不怎么样!。 也正是由于以前的滥用,texture的优势长期被人们所忽略。texture可以让web设计更具整体感,但是前提是不要让它满屏皆是。

Texture(纹理)VS. Patterns(图案)

在我们深入了解texture之前,先弄懂texture和pattern之间的区别。这两个词经常被误认为同义的。pattern通常是小的、重复的图片元素,而texture更趋向于大一点的不重复的图片。你可以想象两个集合,左边是pattern,右边是texture,这两个集合有一部分交集,也就是说在某些时候texture也是pattern。去tileabl这个网站逛一圈,也许你会有更清晰的印象。

Texture的功能

我们喜爱texture的理由可以有很多。设计时的选择不止是简单说“嗯,这样看起来还不错”,设计是出于一种目的,而每一个对texture选择应该权衡利弊。现在让我们浏览下使用texture到底有哪些好处呢?

获取目光焦点

texture可以让元素显著起来,譬如titles、headings、icons和buttons。它可以吸引眼球去传达一个动作指示或者告诉你这是主要的heading部分。这也许是最明确的一种方式去理解texture了。

最低限度的去使用texture,以便区分website中内容和其他部分。它引导着浏览者的目光直接锁向那些设计者有意安排的元素上。它可能是一种特别棒的方法让关键商标脱颖而出。

你可以用很多方法去吸引别人的注意力,然而这两种常用的简单的方法,你不妨尝试一下。一种是带有纹理的logo和干净的背景搭配,另外一种正好反过来,干净的logo和带有纹理的背景一起。

增强信息的筑造风格

texture习惯于指导浏览行为。而例如线条、色块和对比同样习惯用于将内容进行逻辑区分。有效的将texture结合其他方式会更具表现力。使用texture的最终目的不是放弃其他的筑造风格方式,而是要去加强它们的表现效果。

以上网站,个别的元素为了特殊的目的使用了texture。该网站把内容划分成几个逻辑区域,让用户清楚的看到从哪开始,到哪结束。通过texture使得用户能够清晰准确识别每个逻辑内容块,从而增强了页面的信息筑造风格。

并且,texture完美的配合了网站的风格和主题。所有元素犹如量身订做般合理的表现了主题,因此强调了整个website的全部信息。

建立一种氛围&个性化

越来越多的客户希望网站设计不止是友好的表现页面内容,他们更希望能看到一些个性独特,自己的标志更易被用户所识别的web设计。texture便可以通过很多方式实现这一目的。

上面这个网站设计便十分帮的表现了她的个人品牌。她使用了texture来更简洁的表现了头像部分,如果没有texture,该网站会显得平淡无味,而且缺乏个性。texture无形中使得web设计中多了很多超棒的因素,让website变得更具魅力。

提示和建议

从上面看来texture的确很不错,但是使用中你也会想到如何才能避免技术滥用和思维定式的陷阱呢。

保证易读性

千万不要为了使用texture而牺牲了易读性,这也是我们经常犯的一个错误。易读性对于一个网站来说具有最高级别的重要性。

别死马当活马医

在印刷里,texture很难会被过渡使用,当然有时也会因为流派不同而不同。然而在web领域,texture却很容易出现滥用的情况。

实践预示着提高

让你的界面设计不断的尝试新的想法,平时从来不会添加texture的地方你也可以尝试一把,说不准会有意想不到的效果。

如果它不出于任何目的,请删除

在用户网站上使用texture之前,请精炼好你的技术。必须反复的确认你使用texture出于某种有建设性的想法,如果你不能够使得texture有助你整体设计的提升,请放弃。

没有任何理由需要过渡使用texture。web的全部目的是为了传播信息,当然没有必要去让你的内容毫无可读性。所以,精炼和细微的纹理效果可以更好的帮助提高项目水平。

[1] [2]  下一页

Tags:网页设计 纹路 技巧

作者:佚名
0 0

文章评论评论内容只代表网友观点,与本站立场无关!

   评论摘要(共 0 条,得分 0 分,平均 0 分) 查看完整评论