网站界面设计研究

马亮

摘要：网站应用是互联网最重要的应用之一，它的出现让信息的远距离展示和交互变得极其容易，并且实时；现在，网站系统也是很多电子商务系统的重要载体。由于网站具有这么重要的作用，进而导致网站的界面设计尤其重要，良好的界面设计不仅能让人产生美感，也会引导用户快速完成功能任务。该文对网站的界面设计进行了初步的研究。

关键词：网站设计；网站界面设计；界面设计；设计

中图分类号：TP393 文献标识码：A 文章编号：1009-3044（2015）035-0046-02

Abstract：Web application is one of the most important applications of the Internet，its appearance makes it extremely easy to display and interact with information，And real time.Now，Website system is also an important carrier of many electronic commerce system. Because the site has such an important role， and then lead to the interface design of the site is particularly important， good interface design can not only make people produce beauty， but also guide the user to complete the functional tasks quickly. This paper makes a preliminary research on the interface design of the website.

Key words：Website design； website interface design； interface design；design

1 概述

互联网由美国国防部高级研究计划管理局最先研发。网站是互联网中最流行的应用之一，其是基于B/S架构的程序，由客户端技术（html、js、css等）与服务端技术（jsp、asp.net、php等）共同协作完成功能。网站是一种个人或组织机构向外界展示信息，或者与外面互相沟通的极佳的手段。个人或组织可以通过网站来发布自己想要公开的资讯，或者利用网站来提供相关的网络服务。人们可以通过域名，访问网站，获取自己需要的资讯或者享受网络服务。

通过域名访问网站，最终展示在用户面前的是一个可视化的界面，人们通过这个可视化的界面中的文字、图片、视频等多媒体元素接收信息。所以这些可视化元素如何组织才能让用户更容易更直接更醒目的接受信息，并且能让用户在浏览网站中感受到网站界面设计的美，将是网站建设中一个非常重要的一个环节。

2 设计研究

用户界面（英文，User Interface；简称UI）。用户界面设计是指对软件的操作逻辑、交互方式、界面美观的整体设计。好的用户界面设计会让软件的使用变得自由、简单、舒适，充分体现软件的定位和特点，变得有品味有个性。很显然，网站界面设计是用户界面设计的一部分，网站界面设计必须遵守一般界面设计的原则，但网站界面设计由于其具有自身的特殊性，也必然有一定的设计理念的不同。通过对界面设计不同需求进行的分类，以及界面设计元素对用户行为的影响，来研究用户在界面设计中所体现的重要性。

设计是为了满足可用性及审美需求，全面的了解用户特征及多元化要求是十分必要的。交互已经成为网站界面设计中重要的环节和侧重点。界面是物体与人互动的媒介，界面设计可以作如下分类：

1）以环境为主导的设计。环境对设计主题的内容传递有着重要的影响，设计主题无法脱离环境而存在，因此注重界面的环境表达是不能忽略的设计元素；2）以感情传达为侧重的设计。这是设计界面非常重要的一面，通过设计的界面向使用者进行情感传达，使用者在接触作品时，产生情感共鸣共振，反应出使用者和设计主题间的情感关系；3）以实现功能为目标的设计。界面设计最基本的原则是实现功能性，通过设计界面，让用户明白功能及操作流程，将设计主题本身的功能信息明确地传递给用户，使用者是界面存在的核心坐标和基础。由于用户的文化水平、文化背景与知识结构具有很大差异，促使设计者在进行界面设计时应以国际化通用的设计元素为主体，避免过度的使用标新立异的设计元素。

由上述界面设计的一般规则，我们把讨论的范围缩小到基于网站的界面设计，首先对于网站UI的设计也可以综合考虑上述三大设计的分类和设计侧重；但由于网站是一种动态的信息呈见方式，它既可以提供多媒体信息的展示，又可以通过javascript和服务端技术对用户需求进行动态响应、实时反馈，而正是这些网站多媒体信息的特性和实时的响应交互是其它平面媒体所不具备的，这就要求网站界面设计者不仅要考虑静态的界面设计元素，还要考虑实时响应时的界面设计和沟通方式，可以说网站界面设计的责任非常重大，他所设计的界面不仅会影响到用户的审美，而且会严重影响到网站交互的友好性、易用性、功能性。

由于互联网技术的迅猛发展，计算机软硬件技术、有线无线网速、智能手机近年来都有了飞速的进步，近而导致基于互联网的web应用中多媒体的使用、交互的丰富性都几乎达到了极其自由的程度，可以说为了达到网站功能和审美效果，能自由运用绝大部分多媒体素材及交互方式的时代几乎已经来临，这也导致现在网站出现了如下的特点：1）多媒体元素在网站上的大量使用，视频、图片在很多网站中占了相当大的比例，而且这些视频和图片很多已经采用较高清晰度和分辨，当然为手机开发的网站会对图片和视频进一步的优化，以免过度耗费用户的流量；2）基于客户端脚本与服务端技术支持的实时交互；3）大量js脚本和css驱动的动画效果，动画效果已经可以与flash动画媲美；4）由于flash的安全性以及难以支持搜索，flash动画已经不再作为网站动画展示形式，除了有些广告展示需要外，已经渐渐被js脚本、CSS3、html5取代。

但是无论网站制作技术、计算机软硬件如何发展，由于网站本身展示的特殊性，进而导致为其进行界面设计有自身的规律可遵循，由于网站的功能和界面设计有更紧密的联系，界面设计本身就传达了很多功能，对用户的使用体验有着极其重要的作用，所以必须慎重的进行设计。一个网站的界面设计，一般要按照如下的顺序执行：1）和用户沟通，了解用户对网站功能的需求；了解用户对网站界面颜色布局的偏好；2）使用专业设计软件（如photoshop）设计网站效果图；3）将网站效果图交给用户，根据用户，进行沟通修改；4）定稿。

无论设计任何类型的网站，有一些基本的设计原则是一定要遵守的：

1）网站导航清晰。一个网站最终是要给用户浏览并使用，如果网站的导航不清晰，意味着用户不能流畅地使用网站提供的功能，进而不能很好完成建设网站的初衷，导航清晰一定是网站界面设计首要考虑的因素，不能本末倒置、因噎废食，有的网站为了追求可视化效果，导致整个网站过于不同寻常，用户找不到网站提供的功能，最终导致用户厌烦，进而弃用网站。

2）根据网站类型不同选择不同的设计风格。网站可以有如下不完全分类：新闻门户类，品牌宣传类，政府学校事业单位门户类，企业门户类，办公类，在线电子商务类等等。上述这些网站由于功能定位不同，导致界面设计和交互会有所不同，如是新闻门户类网站由于是基于内容的网站，主要是向用户推介内容，所以这种网站并不要求过于炫丽的效果，过于炫丽的设计效果不仅分散用户的注意力，也会影响有效内容的展示，此种网站以结构严谨为主，所有内容版块均明显的展示于网页上；而政府学校事业单位门户类网站和新闻门户类网站有些类似，更倾向于内容展示，但与新闻门户类网站又有所不同，政府学校事业单位门户类网站不仅有内容展示的作用，但往往也有对本单位进行宣传的需要，所以这种类型的网站往往在界面设计中既注重内容的展示，也注重通过网站的界面设计向外界展示自己组织机构的文化和理念；企业门户网站，由于具有产品推介的功能，往往也是功能和宣传的统一的界面设计；品牌宣传类网站往往以大图和视频为主，界面设计和交互往往比较新颖；而办公类网站基本上是最保持的网站，一般比较严谨和低调，界面设计以实用易用为主，内容为王，但良好的配色及良好的交互也可以是其的亮点；在线电子商网站倾向于在导航清楚的情况下，运用大图吸引用户的眼球，一般会提供极其方便的交互方式。

3）遵守多年形成的网站界面操作文化、规范和潜规则，在交互和导航方面进行创新，一定要考虑到用户的接受能力。设计网站的界面和交互效果，一定要遵守已经形成的计算机文化和大家共同遵守的使用特征，比如大家都知道ctrl+c是复制而ctrl+v是粘贴，这种计算机文化和操作习惯，不宜改变。网站的顶部一般会有异航菜单，主要的功能分类也会在用户打开首页的时候，在网站首页的上半部分给出。

除去上述多年来形成和共同遵守的网站界面设计规范外，网站界面的设计也在跟随世界设计潮流而发展，出现了如下的新的设计特点：

1）垂直滑屏。垂直滑屏相当于一个幻灯片将它全屏化，并且以垂直滑动动画形式展示出来，这对于访客来说是个新鲜友好的浏览体验。特别适用于产品描述、情景营销的单页面网站；2）卡片式。像卡片、瓷砖的排版设计在2016会继续流行，Pinterest是这种设计潮流的领导者，我们将看到更多博客和电子商务网站使用这具设计技术；3）固定块（Fixed Blocks）。固定块像css 的fixed属性，我们常见有导航菜单用这个技术，而在2014年，有些网页上一些小部件也使用这个技术，但多用于边栏上的内容；4）自然摄影。在2015年已有很多网站使用高品质的照片作为设计元素，优秀的照片视觉是非常有吸引力的，所以2016将会继续这个趋势走下去。而这趋势特别适用于全屏网页设计；5）独特的导航菜单。网站导航不再那么死板，将出现更多创意的方案，向下滑动、向上滑动、弹出、动态动画、二次信息展示等有助于创造令人难忘的浏览体验；6）单色网站。网站设计元素的背景、文本颜色、图像等都使用同一色系，这样的单色网页也许会更有吸引力，并让访客对你的品牌网站有着深刻的印象；7）视频背景网站。通过加入视频背景到网站上，在视觉上比纯图像更有吸引力，2015年已经有不少这样案例，相信明年会继续增加。

3 结束语

网站的设计潮流既追随整个设计界的风向，又有自己的特点，这两者的结合让网站的设计越来越人性化、互动的亲和性越来越强。无论设计的潮流如何变迁，所有的设计应该以人为中心，从审美和功能两方面综合考虑。既能给用户清晰的导航和功能提示，又能带来美感和良好的交互体验的网站，才是优质网站。

参考文献：

[1] 闫宝华，叶根军.浅谈网站界面设计中的设计原则[J].中国新技术产品，2011（4）.

[2] 洪阳.电子商务网站界面的视觉设计及信息传达研究[D]. 合肥：合肥工业大学，2014.

[3] 牛晓锐.网页界面设计中视觉体验的研究[D]. 上海：上海师范大学，2013.