2011网页设计流行趋势探讨

2011网页设计流行趋势探讨演讲:数字信息部苏芬南概述2011年的网页设计不止是面向PC用户的网页，而且延到平板电脑，智能手机等的移动终端设备上，因此赋予了网页设计更多的全新要求，要兼顾在不同设备上都能完美显示的设计效果。概述Flash将淡出网页设计舞台？随着越来越多的像IPAD、IPHONE这种智能移动终端的普及，它们对FALSH天生的不兼容性，以及FLASH自身的一些天然缺点，2011年，Flash渐行渐远，不再是昔日的王者。在未来，网页设计师最终会抛弃Flash，新技术（指CSS3+HTML5）将会取而代之。新技术的革新魔术师CSS3+HTML5随着越来越多移动终端的普及率，在未来CSS3+HTML5将会得到更广泛的应用，成为网页设计舞台的主角。新技术的革新HTML5目前仍然是个草案，仍处于完善之中，然而，大部分现代浏览器已经具备了某些HTML5支持。现在支持HTML5的浏览器有：Firefox3.5、Chrome3.0、Safari3.0、Opera10.5、IE9HTML5的优点：1、无需插件；2、开放、免费；3、对搜索引擎友好；4、支持移动设备终端缩略图的浏览新技术的革新用户在搜索的时候，为了更快的找到自己需要的东西，不必打开整个网页，只需查看预览图，方便用户精确查找。Google已经向浏览用户推出它们的浏览预览技术，过去我们只能通过点击链接才能看到网页的内容，现在你只需轻点按钮就可以预览该链接的网页内容。注意：如果你的设计是基于Flash，会存在这样的一个问题，预览将无法显示你的设计元素。新技术的革新范例1新技术的革新不支持FLASH的缩略图范例2方形条形码新技术的革新方形的条形码被称为QR，全称为QuickResponse应用：拍摄即可打开网页。使用你的手机拍摄一张唯一的条形码的照片，像魔术一样，手机上读取QR的软件就会打开条形码相关的网站。应用QR到你的网站，目的是使用户不必在手机上输入冗长的网址，让浏览者拥有一个你的移动网页的快捷方式。2011年的移动媒体优势更加凸显，而利用这点优势的网页设计是最明智的选择也是将来的发展趋势。大画面通栏设计视觉体验设计新潮流利用巨大的图片提高浏览者对你的网页设计质量的认可度，强烈的视觉冲击让人过目不忘，提升用户体验。设计师们会发现他们越来越习惯于在他们的设计中使用这种大画面，进而传达网站的基调。视觉体验设计新潮流范例1视觉体验设计新潮流范例2简单的配色方案视觉体验设计新潮流没有比纯色的背景更直观更简洁，纯色可以有很多种表达方式。设计师可以使用一些大胆的颜色去设计，当然，颜色最好保持使用2到3种，调整颜色的透明度，或许会给你意想不到的效果。视觉体验设计新潮流范例1视觉体验设计新潮流范例2超大页脚视觉体验设计新潮流超大页脚现在越来越流行，今后的页脚不再是注脚那么简单，他已经变成设计的有机组成部分，页脚上面包含了更多想要传达的动态信息，能更合理的利用你的网页空间。视觉体验设计新潮流范例1范例2视觉体验设计新潮流范例3杂志版式风格视觉体验设计新潮流由于越来越多的人从传统的印刷读物转移到在线信息娱乐，设计师需要解决如何帮助这部分人更容易地转换阅读方式。这个趋势就是像杂志一样排版——这样的页面可以让信息很好地组织在网站主页上，从而令访问者以一种有趣的方式来浏览内容。相似的版式会吸引以前习惯看杂志和报纸的访问者，甚至更好用——不用翻页！视觉体验设计新潮流范例1速写/手绘风格的设计视觉体验设计新潮流速写手绘风格并不算新花样，但他还在流行。很多设计师都很艳羡这种风格，但是却怕自己亲自画，因为自己觉得“画不了”。如果你敢涂鸦，你可以尝试做一些手绘风格的网页设计。速写手绘风会变得更基本，不太会是网页设计的主要焦点。他将会以新的好玩的方式成为个别网页设计的标配，为网页增色。视觉体验设计新潮流范例1视觉体验设计新潮流范例2更加的注重细节设计视觉体验设计新潮流随着今年iPad的上市，众多UI设计精美的APP应用不断的推出，受其影响，网页设计也迈入了精致化的设计，越来越多的网页设计都以APP应用的设计风格来设计，有以下的特点：1、网页设计更加的大气简约，更多的留白；2、更多的来源生活场景的设计；3、设计更加的注重高品质化；4、呈现方式越来越多的引入iPad的设计风格移动互联网时代的到来针对移动终端设备的优化智能手机，iPad等的移动设备随处可见，使人们联系网络更加方便快捷。而网站设计必须要兼容这些设备，所以在这方面网页设计不仅仅针对电脑PC，还得面向更多的受众，提高了网页设计者的难度。如果你的原始网站没有针对移动网络标准优化，那你并未准备好迎接移动互联网时代的到来。据相关预测，智能移动终端销量将会超越个人PC，赶快准备好，迎接移动设备大军的来临。设计需考虑更多的触屏设备针对移动终端设备的优化触屏技术应用越来越广泛，触屏设备随处可见。这意味着，你的导航设计不再只是鼠标导航，你必须要要考虑你的设计适合触屏设备。做好以下三点：1、网页的布局要重新规划，要符合移动终端的阅读习惯2、信息展示要重新整合，移动终端上不合适使用海量信息的展示方式3、使用流体布局（liquidlayouts），做到使访客从垂直到水平阅读你的网站都会体验完美案例一：网易针对移动终端的优化针对移动终端设备的优化iPhone：网易的手机网应该算是四大门户中做的最好的一个，信息经过筛选，架构经过针对性设计，符号手机阅读的用户体验。iPad：网易的iPad版做的比较随意，没有花大力气去进行优化，只是对其版块进行了细微的调整，如去掉了一些FLASH的广告，去掉了一些杂乱的文字广告等，页面几乎没什么变化，比较马虎针对移动终端设备的优化网易手机网针对移动终端设备的优化网易的IPAD版截屏案例二：新浪针对移动终端的优化针对移动终端设备的优化iPhone：中规中矩，没有很特别的亮点，基本符合当前的手机的阅读习惯，但信息量略显过多，还需完善。iPad：新浪的优化只是做到了皮毛，还没有深入去钻研针对移动终端进行极致的优化，页面还是较为粗糙，体验不够好，不够完美。针对移动终端设备的优化新浪手机网案例三：腾讯针对移动终端的优化针对移动终端设备的优化iPhone：基本符合当前的手机的阅读习惯，但信息量略显过多，还需完善iPad：腾讯可以说是国内四大门户当中，针对移动终端做的最好的网站，打破惯性的传统网页设计的固有思维，专门针对IPAD等的移动终端进行专门的优化，界面简洁大气，符号移动终端的用户操作习惯，用户体验很好，算为完美。针对移动终端设备的优化腾讯手机网针对移动终端设备的优化腾讯的IPAD默认首页针对移动终端设备的优化总结针对移动终端设备的优化随着今年iPad的发布上市，移动终端设备对整个IT届的冲击不单只是设备生产商的冲击，同时也延伸到了网页设计的层面，网页设计将越来越需要兼容电脑屏幕及移动终端，对移动终端不友好的网站注定最终会被市场潮流所淘汰，从而迷失在这次移动终端的革命浪潮中。奥一网也应该提前做好接入移动互联网的准备，赢在起跑线上。谢谢观看，共同努力！