网 站界面设计应该注意的情况

新闻 2018-04-13编辑：admin阅读（）

网 站界面设计应该注意的情况！
网站用户界面（Website User Interface）指 网站用于和用户交互的外观、元素和程序等等。
如果你经常上网，就会看到很多网站设计很朴素，看 起来给人非常舒服的感觉；有的网站很有创意，常 常给人带来意外的惊喜和视觉的冲击；但 相当多的网站页面上充斥着怪异的字体，花哨的色彩和图片，给 人网页制作粗劣的感觉。


　　网站界面设计，既 要从外观上进行创意以到达吸引眼球的目的，还 要结合图形和版面设计的相关原理，从 而使得网站界面设计变成了一门独特的艺术。通常，企业网站用 户界面的设计一般应遵循以下几个基本原则：
一．用户导向原则（User oriented）


　　设 计网页首先要明确到底谁是这个网页的使用者，要 站在用户的观点和立场上来考虑和设计网站。要做到这一点，就 必须要和用户来沟通，了解他们的需求、目标、期望以及偏好等。网页的设计者要清楚，用 户之间的差别是很大的，他 们的能力也各有不同。比 如有的用户可能会在视觉方面有所欠缺（如色盲），对 很多的颜色分辨不清；有 的用户的听觉也可能会有些障碍，对 于网站的语音提示反应比较迟钝；而 且相当一部分用户的计算机使用经验还很初级，对 于复杂一点的操作就会感觉到很费力。另外，用 户使用的计算机机器配置是千差万别的，如显卡、声卡、内存、网速、操 作系统以及浏览器等都会有所不同。设 计者如果忽视了这些差别，设 计出的网页在不同的机器上显示就会造成错乱。


二．简洁和易于操作原则（Keep It Simple And Stupid - KISS）


　　KISS原则就是"Keep It Sample And Stupid"的缩写，简 洁和易于操作是网页设计的最重要的原则。毕竟，网 站建设出来是用于普通网民来查阅信息和使用网络服务。没 必要在网页上设置过多的操作，堆 积很多复杂和花哨的图片。此原则的一般要求：


　　1、网页的下载不要超过6秒钟（普通的家庭宽带为2M的，速度一般在220kb/s）；
　　2、网 页尽量使用文本链接，而 减少大幅图片和动画的使用，从 而加快网页的打开时间；
　　3、操作设计尽量简单，并 且有明确的操作提示；
　　4、网 站所有的内容和服务都尽量在显眼处向用户予以说明等。


三．布局控制（Layout）


　　在网页排版布局方面，很 多网页设计者还不够重视，网 页界面设计排版过于死板，甚至照抄他人。如果网页的布局凌乱，仅 把大量的信息堆集在页面上，就 会干扰浏览者的阅读。一 般在网页界面的版式设计上所要遵循的原则有：


　　1、7±2的Miller公式。
　　根据心理学家George A.Miller的研究表明，人 一次性接受的信息量在7个比特左右为宜。总结一个公式为：一 个人一次所接受的信息量为 7±2 比特。这 一原理被广泛应用于网站建设中，一 般网页上面的栏目选择最佳在5～9个之间，如 果网站所提供给浏览者选择的内容链接超过这个区间，人在心理上就会烦躁，压抑，会 让人感觉到信息太密集，看不过来，很累。然 而很多国内的网站在栏目的设置远远超出这个区间。


　　2、分组处理。
上面提到，对 于信息或栏目的分类，不能超过9个。但 如果你的内容实在是太多，超出9个，就需要进行分组处理。如果，你 的网页上有几十篇文章的链接，需要每隔7篇 加一个空行或平行线做以分组。如 果你的网站内容栏目超出9个，如 腾讯公司的网站或其它几个比较知名的门户，有很多个栏目，超过了9个。为了不破坏7±2的Miller公式，在 设计时把比较有代表性的分类加粗，然后再按性质分组。


四．视觉平衡（Visual balance）


　　网页设计时，各种元素（如图形、文字、空白）都要有视觉平衡作用。根据视觉原理，图 形与一块文字相比较，图 形的视觉作用要大一些。所以，为了达到视觉平衡，设 计网页时需要以更多的文字来平衡一张图片。另外，按 照中国人的阅读习惯是从左到右，从上到下，因 此视觉平衡也要遵循这个这个原则。例如，你 的很多的文字是采用左对齐，需 要在网页的右面加一些图片或一些较明亮、较醒目的颜色。通常情况下，每 张网页都会设置一个页眉部分和一个页脚部分，页 眉部分通常放置一些Banner广告或导航条及网站LOGO，而 页脚部分通常放置联系方式和版权信息等，页 眉和页脚在设计上也要注重视觉平衡。同时，也 决不能低估空白的价值；网 页上所显示的信息非常密集，这 样不但不利于读者阅读，甚至会引起读者反感，破坏该网站的形象。在网页设计上，适 当的地方增加一些留白，精 炼和升华你的网页的形象及美感，使得页面变得简洁。


五．色 彩的搭配及文字的可阅读性（Colors and text can be read）


　　颜 色是影响网页的重要因素之一，不 同的颜色对人的感觉有不同的影响，比如：红 色和橙色使人兴奋并使得心跳加速；黄色使人联想到阳光，是一种快活的颜色；黑色显得比较庄重，考 虑到你希望对浏览者产生什么影响，为 网页设计选择最恰当的颜色（包括背景色、元素颜色、文字颜色、链节颜色等）。


　　为 了方便阅读网站上的信息资讯，可 以借鉴参考报纸及杂志的编排方式将网页的内容分栏设计，甚 至两栏也要比一满页的视觉效果要好。另 外一种能够提高文字可读性的因素是字体的选择，通用的字体（Arial，Courier New，Garamond，Times New Roman，中文宋体）最易阅读，特殊字体用于标题效果较好，但是不适合正文。如 果在整个页面使用一些特殊字体（如Cloister，Gothic，Script，Westminster，华文彩云，华文行楷），这 样读者阅读起来感觉一定很糟糕。这 类特殊字体如果在页面上大量使用，会使得阅读颇为费力，浏 览者的眼睛很快就会疲劳，不 得不转移到其他页面。


六．和谐与一致性（Harmony and consistency）


　　通 过对网站的各种元素（颜色、字体、图形、空白等）使用一定的规格，使 得设计良好的网页看起来应该是和谐的。或者说，网 站的众多独立网页看起来更像一个整体。网 站界面设计上要保持一致性，这是很重要的一点。一致的网站结构设计，可 以让浏览者对网站的形象有深刻的记忆与印象；一致的导航设计，可 以让浏览者迅速而又有效的进入在网站中自己所需要的部分；一致的操作设计，可 以让浏览者快速学会在整个网站的各种功能操作。如果破坏这一原则，就会误导浏览者，并 且让整个网站显得杂乱无章，给人留下不良的印象。


　　当然，网站设计的 一致性并不意味着刻板和一成不变，有 的网站在不同栏目使用不同的风格，或 者随着时间的推移不断的改版网站，会 给浏览者带来新鲜的感觉。


七．个性化（Individualization）


　　1、符合网络文化
　　企业网站不 同于传统的企业商务活动，要符合Internet网络文化的要求。首先，网络最早为非正式性、非商业化的，只 是科研人员用来交流信息的。其次，网 络信息是只在计算机屏幕上显示而没有打印出来阅读，网 络上的交流具备隐蔽性，谁 都不知道对方的真实身份和信息。此外，许 多人在上网的时候是在家中或网吧等一些比较休闲，比较随意的环境下。此 时访客的使用环境所蕴涵的思维模式与坐在办公室里西装革履的时候是截然不同的。因此，整 个互联网的文化是一种休闲的、非正式性的、轻松活泼的文化。在 网站上使用幽默的网络语言，创造一种休闲的、轻松愉快、非 正式的氛围就会使网站的访问量大增。


　　2、塑造网站个性
　　另外，网 站的整体风格和整体气氛表达要同企业形象相符合并且应该很好的体现企业CI。


八．网 页的均衡规划与选择（Planning and selection）


　　1、尺寸
　　o800*600能 照顾到所有网友的电脑，但相当是张“小报”。
　　o1024*768渐成主流。1024*768能比800*600多出一栏的信息。
　　o正 文页采用自适应设计，能 在正文页做更多相关内容。首 页也可以尝试自适应的设计。自 适应设计的核心是要留出宽度伸缩自如的栏。
　　o在1024*76模式下，页面的长度不易超过10屏。
　　o随着电脑升级换代，分辨率提高，电 脑屏幕能够提供的面积越来越大，这是一种难得的资源，要充分利用。“小报”改“大报”要 增加一倍的纸张成本，网站改“宽版”，成 本的增加却要小得多。


　　2、字体字号
　　o目录页用小字号，为的是放更多的标题。
　　o正文页用大字号。为 的是让读者读得舒坦。
　　o慎 用不容易看清楚的楷体。楷体的作用等于图片，主 要起美化版面的作用。
　　o多 用对搜索引擎友好的标粗，来表示重点。


　　3、颜色
　　o同 一个页面的颜色不要超过4种。眼花缭乱，容易产生视觉疲劳。
　　o颜 色对比不要反差太大。网 页版面不是美术作品，要 避免形式对内容的喧宾夺主。
　　o文字+底 色能够起到很好的突出作用，在 视觉变化上相当于图片的作用。


　　4、静态化
　　o访 问量大的页都应该静态化，以便减少服务器压力，增强网站稳定性。访 问不到的网页是最差的网页。
　　o动 态化和静态化在一个页面中结合使用，能 同时得到轻负荷和即时交互性的好处。
　　o哪 些页面的哪些地方需要静态化要在一开始就考虑，访问量大了之后，再高考虑，就迟了，由动态化转为静态化，会有很多历史问题。


　　5、分栏
　　o首页选4栏？还是3栏？
　　o正文页多用2栏。
　　o“纵向逻辑”是 指将相近的内容从上至下排列，而不是从左向右排列。如 果读者对这方面内容感兴趣，他会从上至下，逐行阅读。这 样可充分力利用首屏，让 首页增多从上至下阅读的可能。
　　o避免一栏太强，一栏太弱。通过图片、套红等手段进行调控。平均使用读者主意力。使 读者不敢放过左中右任何一栏。


　　6、图片
　　o有图有真相，一图胜千言。十分必要时才用。因 为图片的编辑成本和带宽成本都比较文字高很多。
　　o在目录页的图，小点，再小点，多用特写；小分辨率，能看就行。在正文页的图，保证清晰，美观。正文页有的是版面。
　　o正文页在5屏之内，尽量不要分页。让读者一次读完。


　　7、导航条与网站地图
　　o导 航条是网站的门牌号码，不能随意更改。否则，读者会迷路，找 不到他原来看的内容。
　　o导 航条上的分类名的前后次序要兼顾重点和读者阅读逻辑，即归类摆放。
　　o导航条最多三行。最好二行。太多行显重。
　　o导航的更多，就是网站地图。网 站地图的摘要版可以放在网站底部，成为底部导航。网站的底部导航，很有必要。其好处是：一、可放多行；二、可 形成网站底部的阅读重点。将 读者从首屏带到最后一屏，期间会增加很多点击。
　　o主导航和频道导航：主导航每页都有，频 道导航只在本频道页面出现。


　　8、首页更新成本
　　o首 页设计不能只考虑美观、协调，要考虑24小时更新一遍之要求。更新是网站的生命，一 定要最大限度地降低首页更新成本。
　　o交 叉自动同步更新的设计，可 有效降低各种首页更新成本，给 读者内容丰富即时的感觉。
　　o更 新即时的首页是网站的资源，因为是资源，更多的标题会拥上这个首页。如此，正循环，这个首页也就火了。更 新不即时的首页是网站的鸡肋，会越来越寂寞，最终会被荒废。
o每 个首页的设计成至少要有一个读者点击进去的理由。即 时更新比独家内容成本低。

相关推荐论团交流？