作为直接呈现给浏览者眼前的东西，设计和交互一直是网站建设中的两大重要元素。网站设计不用多言，直接关系到用户认知和企业形象的展示。前些年，由于带宽、计算等资源限制，网站上多半以静态展示为主，人机交互方面最多颜色变化，BANNER广告图片交换轮播而已。现在的云计算的普及应用以及带宽资源的不断增加，让灵动的人机交互已经不复存在障碍，所以，我们看到很多网站不仅设计的非常好，人机交互方面也非常巧妙得体。这非常有利于网站的营销转化，每一次滑动鼠标，每一次点击总给用户带来不一样的感受，恰如其分的突出网站重点，不正是用户所需要和期待的吗?但是网页交互效果的运用并不是一件简单的事，应用不恰当反而会给用户体验带来负面影响。
一、交互效果并非越多越好
也许是主观以为炫动的页面，可以让网站直观感觉很棒。很多网站前端交互人员，总喜欢把交互效果制作的很复杂，其实从用户感受体验而言，或许并非最佳选择。内容是一个网站的核心，但是密密麻麻的文字内容用户不怎么愿意阅读，美术设计的目的，就是为了让用户在赏心悦目的同时理解网站内容。那么交互效果呢?交互效果的目的，一方面是让网站页面更生动，另一方面是为了让重点内容更突出。试想一下就知道，通篇的静态页面下，只有重点内容和重点元素是动的，自然可以给用留下深刻印象。但是如果网站的整个页面到处都在变色、都在动，反而让网站内容无法重点突出，给人眼花缭乱的感觉。
二、页面交互配合营销转化
好的人机交互，总能恰到好处的给用户带来赏心悦目的感受，越是让网站页面用户体验加分的有效做法。同样的，网站本身的价值需要通过用户浏览转化，一个网站上重点内容重点突出通过交互效果，一样可以呈现的非常精彩。比如页面上的在线客服图标，可以做成gif动画格式，也可以通过JavaScript代码让其更加生动活泼。一些网站的产品介绍中的产品爆炸图，充分运用html5技术，在普及产品知识的同时也给用户留下了深刻印象。单纯的网站页面人机交互没有实际意义，而配合网站及公司的营销需求，将需要传递给用户的元素重点突出，网站的价值才能得到最大发挥。当然，营销需要把握尺度，那种类似频繁弹出咨询窗口的骚扰用户行为，虽然也属于人机交互范畴，但是还是少用或者不用为好。
三、优化程序提高加载速度
基于B/S技术的网站，其一定是需要预先加载到客户端计算机才能运行的。无疑的，网站页面上的每一个效果，其都需要通过代码通过客户端浏览器解释后才能执行。越是复杂的人机交互效果，其越是需要很多行代码配合实现。代码的解释执行，是需要消耗时间和服务器资源的，与此对应的是人机交互效果复杂的网站，其加载速度和消耗的计算资源就越多，反应给用户的感受就是网站打开慢运行慢。而网站慢，显然与用户体验的极致追求是违背的。所以网站建设公司认为在网站制作时，一方面要通过合并JavaScript代码、CSS样式代码等形式避免资源加载堵塞。另一方面，也要控制好图片及素材大小，并尽可能的让网站代码足够简洁。当然，正如本文第一点所强调的，避免网站页面交互效果的过度使用，也是提高网站加载速度的有效方式。
这篇文章大体概括了一些设计网页中的大问题。希望能给你做下一个网页时给予一些儿启发。
1、记住：你能掌控的时间是有限的
我仅仅用4秒钟就能浏览完平常的页面，因此，你没有足够的时间吸引用户并让他们继续浏览你的网站。也就是说你应尽可能准确的描述你设计的网站是关于什么的。如果它需要让浏览者花费更多的时间去弄明白此网站是关于什么的，他将放弃并离开。
2、记住：用户是略读页面
当你进入一个房间时，你不会具体的看每一样东西的外表。首先你会注意屋子里面人或物的外形，你环视整个屋子，然后找令你敢兴趣的东西。在第一次浏览网站的时候也会发生类似的事儿，浏览者或用户首先是大体浏览一下。这就需要你引导用户去你想要让他们去的地方。它可能是个登陆按钮、更多内容按钮、或博客文章等等
3、网站的左上角是最明显的位置
这是大家公认的事实。主要原因是大家都是用这种习惯方式来读书读文章的（从左上角的位置开始），另外早期的网站和应用软件也是基于此方法进行设计开发的。我们通常会把LOGO放在左上角，这样是很好的。但是考虑一下加入一个或者两个其他的元素在这个位置让它看起来更明显（注册的链接、搜索的表单、标语等）。
4、了解“F”结构 一些视觉跟踪调查研究证明，用户浏览网站的视觉路线类似于字母“F”型。最顶部的位置总是能被看到，中间区域仅有一半被看到，再往下只有左边一部分能被看到。当你在设计的时候不知道将一个内容块放到社么位置的时候，你可以去考虑一下这一因素。
5、了解用户忽略什么
用户都是对广告视而不见的。他们习惯于忽略图片广告和文字广告。避免设计的东西看上去像广告，同时，用户也会忽略大块的文字区域。没有人有时间（更确切的说是耐心！）去阅读大片的文字，他们仅仅是了解页面文章的大意。
6、文字和图片
一个有趣的事实是。文字比那些绝妙的图片更能够获得注意！如果你想向你的用户传达信息，我建议你使用大的标语文字来代替那些很炫的头部图片„
7、用设计元素来吸引注意
来吸引注意的好的元素是文字口号，行动纲领的按钮（通常用亮色调），分成1-2-3级，或者就是一个普通的列表„„<BR>如果你在写一篇很长的文章，很重要的一件事情就是你要去找小标题。小标题比其他的内容容易获得关注。使用恰当的标题，通过这简单的步骤向用户阐述这篇文章的主题。
8、文字格式
恰当的文字格式的编排更有意于阅读。不要担心使用过多的段落、加粗、斜体、引用、下划线或者字母大小写„„它们都可以让文字块更有视觉冲击力。当然，你也需要用格式化强调一些你认为很重要的文字或者句子，这些能够引导你的读者阅读完全文。
9、使用简洁图片
我前面已经提及过用户对广告是视而不见的。当你在设计过程中使用到图片时，要确保它们不要杂乱、令人讨厌或不被理解。大部分人感觉看杂乱、色彩花哨的图片是比较费劲儿的。图片应该简洁、易理解的。<BR>你使用人的脸部图片更容易引起用户的注意，尤其当图片人物的眼睛盯着用户。当然你也可以用目光的方向来引导用户关注某一个方向。
10、使用留白
使用留白可以给某些元素更多的可视空间，如果某元素与边距或其它元素太近就容易被混淆，那就需要给它留点呼吸的空间。尤其在文字与文字内容之间。
扫描二维码