[Design]2010web 设计趋势

原文:Web Design Trends for 2010
作者:www.webdesignerdepot.com

有人会说,伟大的设计是永恒的。是的,在一个理想世界中,我们不用关注这些新的趋势。
实话讲,有很多网站都值得我们关注,分析趋势,特别是某些网站。
网络的变化太快是我们不得不面对的现实。不像在其他媒体,Web的设计原始动力不只是美学。
技术是不断变化的,可以大大加强媒体的能力。
2010
年,我们看到设计师继续推进网页设计的发展,以下明显的趋势
 
平面设计
平面设计一直是Web的灵感来源。我们看到很多的灵感是来自平面设计,这些设计师想法似乎超越了Web


衬线字体
字体的最重要问题之一是可读性。平面设计师们总是倾向于衬线字体的边缘,因为提高知名度,使字符表单更容易识别。
无衬线字体,一般被认为更容易阅读在屏幕上。但是,随着更多的用户在浏览高分辨率和字体平滑技术的改进,衬线字体已经变得非常清晰的正文文本。


大标题
平面设计师一直在使用大标题,以争取不同年龄层用户注意。印刷材料的可读性已经很高了。如果你看到一个沉闷的小册子上一坐在办公桌前,你会不嫌麻烦捡起来?我猜你不会。
这一趋势在2009年开始,并开始在普及。大标题意味着更高的关注和更清晰的意图。


多列布局
一般设计人员在其工作中有很多限制。使用多列可让你在同一个空间展示更多的内容。
现在,以增加屏幕分辨率和网格布局的到来,更多的设计师正在适应这种方法的网站,使网站更容易使用,并适应更多的内容。


大引导图像
一张图片胜过千言万语。虽然在Web展示上会耗掉一些时间加载,因为它确实在效果方面比单使用文本的要好(其中有比较高分辨率的),宽带接入取得了很大的照片,采用更为可行。
我们看到更多的网站使用大,符合意境的图像来吸引用户,创造一个身临其境的体验。


图表和信息图像
设计师一直使用图形来传达复杂的信息多年。普遍认为这是最常见的杂志和年度报告。
图形比纯文本更能表达相对比较困难的事或复杂的关系和比例。信息图像往往有一个简单而丰富的视觉外观,越来越多的设计师都采用或者模仿信息图像的设计风格。

简单
Antoine de Saint-Exupery
曾说过,实现完美并不是要加更多的东西,而是精简到不能再精简。在设计简单的优点很多。
Hick’s
法则告诉我们,每增加一个选项都会增加作出决定所需的时间。
简单的设计更容易使用和理解,使信息传播更加清晰。

精简和网格设计
极简主义比较难以掌握。它只包含的基本要素。其他一切都要被删除,在该元素是目前最大的影响造成的。
极简设计需要使用一个强大的网格系统才有效。若是有足够的空白,没有这种网格,一个简约的设计会感到零散。网格赋予页面一个组织结构。


单页面布局
有几种方法简化。一个单页布局展品这些方法2:隐藏和删除。
有效办法是隐藏的那些优先级没有那么高的页面布局元素。如果用户希望看到这些元素之一,他们可以按一下来发现它。这比一切可见更为有效,不过这将使本页面复杂。
同样,单页布局后面的原则,使其他网页变得不重要。随着强大的JavaScript库和更快的连接,许多网站现在必要的页面已经没有几页了。设计人员可以轻松地容纳在一个页面上的信息,而没有打扰用户。 


大量的白色空间
在最初的Web设计,我们没有太多的屏幕去展示,所以我们并没有表现出很大的空白。如果你曾经尝试设计的为1 640 × 480分辨率的网站,你就会知道到底是什么我说什么。
现在我们有了更高的分辨率,并能够用JavaScript隐藏和显示元素,利用白色的空间是容易得多。
白色的空间是至关重要的良好的设计。它给眼睛一个休息的地方。这自然提高了设计质量。它表明该元素是由每一个有关的其他方式的接近。


Typographic Layouts
我们以前在适合Web使用的字体方面只限于少数选择,我们现在有很多工具来丰富我们的排版。
Web
设计者一直喜欢使用typography这个微妙的工具来沟通。我们将看到更多的设计师聚焦在typography上并把它作为主要设计元素排版。 


CSS3技术
不肯定你可以采用CSS3吗?再想想。Web先锋如Andy ClarkeJeremy Keith长期呼吁逐步改进”Web设计。
逐步改进是关于Web设计,让他们在老的浏览器可用,同时要考虑那些喜欢使用新技术的用户。
你可以利用对CSS3属性,如圆角,边框背景和文本框阴影。在现代浏览器的用户将看到更好的版本,并且对喜欢用旧技术(IE6的)将看到的基本版本。
CSS3动画
Web上,动画经历了很多阶段。起初,我们只能用动画的GIF图像文件。然后,我们几乎限于Flash。现在,我们可以选择从FlashSilverlight的,以及GIFJavaScript和甚至对CSS3。微妙的动画,可令人难忘的,且CSS3更轻量级,简单。


圆角
2005年和2006年的Web 2.0风格让圆角变得受欢迎,这是个恼人的问题。那时,他们创造了麻烦的事情。没有固定的方法来建立真正的圆角,只好利用CSSJavaScript hack 来模拟。
现在让我们使用CSS3直接产生在圆角,使他们不仅轻松地创建,而且更有效率,因为用户不必下载额外的图片或JavaScript文件。
设计师正越来越多地在2010年这个新的浏览器功能的优势。


Box 和文本阴影
利用阴影,以创造一种深度感已经完成,因为在Web最早的时候(有时过头了)。但它并不总是可行的。要添加阴影的文本,使用的图片,从而增加加载时间,使维护更加困难。框阴影需要一些图像和Css技巧,如滑动门
Css3
具有高度定制的阴影的能力,这是非常有创造性的,不仅包括阴影,而且还包括内部的阴影。有创意的设计师已经开始使用这些CSS3,模拟浮雕和印迹效果。


RGBA颜色和不透明度
多年来,与不透明性和透明度,在Web几乎不可能的。你有三种选择:使用PNG图像模拟的透明度,不过这并不能跨浏览器,再或者使用CSS的选择器和过滤器的基本透明度处理。
CSS3使设计师更好的一致性和使用的不透明的RGBA属性的自由。虽然你可以在很多方面透明度的优势,特别是半透明的颜色叠加的复杂的背景方面。此前,这种效果是不切实际的,若果没有PNG图像的话。


兼容移动设计
移动Web已让百万计的用户在银行排队时能够查看他们的银行帐户,能在地铁里查看最新比分和在驾驶时更新自己的Twitter。(这其中之一是一个危险的习惯?)和移动Web正在快速增长。
每一个公司都有自己的网站,考虑它是否将用于在旅途中,如果是的话如何,可以设计一个Web版本。创新公司已经投入巨资开发一个有用和友好的移动版本。


创新
从社会媒体使用的爆炸性增长能看出来,人们很希望共享那些东西充满热情的东西。
在设计领域,我们已经看到在共享方面以及查看他人工作的需求大幅度增长。我们现在被别人的创造力不停的轰炸。不仅提高了设计质量标准,而且它鼓励要共享,这也促进了创造力和创新文化理念。
简洁插图

如果你像我一样,看迪斯尼电影长大的,佩服那些每个帧的创造动画。我们能很容易识别那些使用墨水或标记的插图,而这样插图慢慢演进出一些非常有创意的设计方法来。
许多设计师正在学习光滑,干净,那些不能由摄影或简单的剪贴画复制的清晰的插图创建一个独特的感觉。一个专业插图设计师,会得到广泛邀请。


Textured Backgrounds纹理背景
Textured backgrounds
纹理背景,对于Web并不是新的。但是,这种技术在过去几个月已经出现了有趣的变化。我指的是把它当成微型纹理,这是在微妙的背景,几乎明显纹理。


缩略图
你可能会说,“Web最初就使用了很多缩略图。这怎么会是趋势?是的,缩略图一直被使用,但很简单。你有一个缩略图,您就可以得到一个更大的图片点击。它实现了功能,但有些乏味。
在过去的几个月里,设计师们开始问,怎样才能使缩略图更精彩?这导致了缩略图使用上更进了一步,可用性也得到了上升。


水彩
随着Web的发展,我们看到更多的设计师展现了各种来自各种媒体的灵感。毫不奇怪,其中美术方面灵感来源。
风格之一是水彩模拟。这种风格独特和优雅的外观是平静的。


手写
手写和原件字体是滥用情况很严重。基于这个原因,许多设计师避开这两种类型,以免造成厌恶出或业余的恐惧。但最近,许多设计师都发现,如果使用得当,手写风格能传达一种结构规划意识。在正确的上下文中使用,它是一个功能强大的交互方式。


Social Media
随着人们在Facebook上花更多的时间比谷歌多,难怪设计师是创新的方法来整合社会化媒体在其网站上寻找。
有些设计师在Web上公布他们的社会化媒体的内容,然后利用他们的网站来做聚合。
这可以说是2010年的增长,我们将看到更多的设计师创造性地整合到他们的社会媒体网站,以便更好地吸引用户。


固定元素
现在,浏览器更好地支持这一立场:position: fixed,我们看到很多设计师正越来越适当的使用它。
有几种情况下,一个固定的元素(如持续导航)可以成为业主的商业目标,使网站更加实用丰富。
固定元素是难忘和增强用户体验。他们有无数的创造性使用,我们将继续看到设计师利用这些优势。

Advertisements

发表评论

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 更改 )

Twitter picture

You are commenting using your Twitter account. Log Out / 更改 )

Facebook photo

You are commenting using your Facebook account. Log Out / 更改 )

Google+ photo

You are commenting using your Google+ account. Log Out / 更改 )

Connecting to %s

%d 博主赞过: