`

23个你必须注意的页面设计要素

阅读更多

可用性设计是Web设计中最重要也是最困难的一项任务。在网页设计过程中,去切实 地剖析用户的心理,在用户使用模式、浏览导航设计、主页布局、可用性测试等方面下足功夫,是每个设计师都必须掌握的一门手艺。

在网络设计领域关于Eye-Tracking的研究十分火爆,但是如何把这些研究结果转变为具体可行的设计来运作依旧是个难点。以下就是一些来自于Eye-Tracking研究结果的窍门,可以为改进你的网站设计提供些意见:
1.对比图像,文字更具吸引力
与你所认为的相反,在浏览一个网站的时候,能够直接吸引用户目光的并不是图像。大多数通过偶然点击进入你的网站的用户,他们是来寻觅信息的而不是图像。因此,保证你的网站设计凸现出最重要的信息板块,这才是设计的首要原则。
2.眼球的第一运动聚焦于网页的左上角
用户浏览网页的这一习惯应该在意料之中,毕竟左上部为主要操作中心这一点为大多数重要的计算机应用程序的设计所采用。在你构建网站考虑网站设计时,应该尽量保持这一格式。要知道,如果你希望保持个人特色,搭建一个成功的网站,你就必须尊重用户们的习惯。

 

3.用户浏览网页时,首先观察网页的左上部和上层部分,之后再往下阅读,浏览右边的内容
用户普遍的浏览方式呈现出“F”的形状。保证网站内容的重要要素集中于这些关键区域,以此确保读者的参与。在此放置头条,副题,热点以及重要文章,这样可以吸引到读者进行阅读。
4.读者会忽视横幅广告
研究表明,读者常忽视大部分的横幅广告——尽管你以此维持网站生计——视线往往只停留几分之一秒。如果你想通过广告挣钱,那么必须创新你的广告位以及合理配置网站广告形式。
5.花哨的字体和格式被忽视
为什么呢?那是因为用户会认为这些是广告,并非他们所需要的信息。事实上,研究表明用户很难在充满大量颜色的花哨字体格式里寻找到所需的信息,因为视觉线索告诉他们把这些忽略吧。保持网站的清爽,不要因为华而不实的表面,让重要的信息被忽略。
6.用数词来代替数字
如果使用数词取代数字的罗列,读者会发现在你的网站可以很容易地发现真实的资料。要知道,你是写给那些将第一次浏览你的网站的读者,所以,让他们容易发现他们所需的信息,让他们感兴趣。
7.字体大小影响浏览行为
想改变人们对你的网页的看法吗?改变网页字体的大小。大的字体刺激浏览,而小一些的字体则提高焦点阅读量。根据你的需要,合理配置两者的比例。
8.遇到感兴趣的内容,用户仅会多看一眼副标题
不要过分坚持副标题固定的格式——保证他们的相关性和兴趣。你也可以让副标题包含关键词,这样可以有效利用搜索引擎,让它带来读者。
9.人们大都只浏览网页的小部分内容
如果在用户浏览的时候提供信息使他们尽快锁定目标,就可以把这一点发展成为你的优势。突出某些部分或者创建项目列表使网页信息容易找到和阅读。
10.简短的段落相对于长段落来说有更好的表现力
网页信息是为大多数强调快速浏览的无联网用户提供的。除非上下文的衔接要求,保持信息由简短的段落和句式组成,例如这个电子商务网站的产品介绍。
11.根据视觉锁定,一栏格式比多栏格式拥有更好的表现力
别让过多的信息把网站来访者淹没。大多数情况下,简洁更具力量。多栏内容容易被用户忽视,我们需要消除这些干扰。
12.网页顶部和左边的广告更能吸引眼球
如需要在网站植入广告,试图使他们融入网页的左上部,这样他们才能吸引到最大的视觉注意力。当然,用户仅仅会注意到这些广告,这并不意味着他们会用鼠标点击。所以不要为了提高广告的注意力而牺牲原有的网站设计。
13.将广告放置与最佳内容一旁也可以提升注意力
如果想要提升广告的可视性和点击率,可以将其设置于最能引起人兴趣的内容一旁,整合进网页的设计里。这样,用户既可以找到所需的内容,你也能提升广告的效益。
14.在各种测试中,人们阅读文字广告最为专心
正如上面提到的,一般的互联网用户不会花费太多时间用于查看那些一眼就能看出是广告的内容。这就是文字广告表现出众的原因。他们并没有分散注意力,而是与网页的其它部分内容融为一体,这让他们减少了对读者的视觉刺激,也使这一广告形式获得成功的阅读率。

15.越大的图像吸引越多的注意力

如果要在网页中使用图片,那越大越好。人们更倾向于查看那些能够清楚地看到细节和获取信息的图像。要保证你所用的图片与文章内容相关,否则它更容易被忽视。大多数读者都拥有高速的连接速度,所以请放心在你的网站上使用那些较大体积的图片。
16.干净、清晰的特写图片能吸引更多的视觉注意
可能那些抽象的艺术图片会让你的网站看起来很有味道,但是他们并不会吸引多少读者的注意力。如果你需要使用到这些图片,请确保所用图片的清晰以及其表达内容的简单可读性。必须注意的是,那些与真实的“人”相关的图片比所谓的模特图片更为“优秀”。
17.标题能吸引眼球
浏览网页时,读者能发现的第一内容是标题。确保网页的所有相关链接畅通和有效,以让读者顺利的通过网站进一步搜索。
18.用户花费大量时间察看按钮和菜单
所以,你需要花费额外的时间维护你的精心设计。毕竟,他们不仅吸引了读者的眼球,更是网站设计的重要组成要素。
19.表单格式可以延长读者的注意时间
分解内容和段落,大量使用表单形式来表现你的文章,可以保证读者的浏览率。使用数字和其它标记符号来突出文章的重要内容,会让网站更容易浏览,用户更快的找到所需的信息。
20.避免呈现大块的文本
研究显示,一般的网络浏览者不会花费时间去阅读大块的文本,无论他们有多重要或写得多好。因此,必须把这些大文本分解为若干小段落。突出重要的地方,放置点击的按钮也可以提高用户的注意力。
21.格式可以吸引注意力
在文中使用粗体、大写、彩体、下划线可以帮助用户获取正文所表达的最主要的信息。使用时需要谨慎,因为过多的使用会使你的网页难以阅读,把读者吓跑。
22.利用好空白
尽管把网页的每寸空间都填满这个想法十分诱人,但事实上让网站留出部分剩余更为不错。网站的过量信息会把用户淹没,同时他们也会忘记所提供的大部分的内容。所以保持网页的简洁,给读者预留出一些视觉空间来供读者休息。
23.放置于网页顶部,导航工具的作用将更好的发挥
理想情况下,你不会满足于当读者打开你的网站时仅浏览初始页,而是希望他们浏览翻阅,察看其它感兴趣的内容。将导航器置于网页顶部,就可以让用户通过使用这个工具轻松的找到所需的目标内容。

原文地址:http://www.yeeyan.com/articles/view/Evelen/4578

分享到:
评论
2 楼 justjavac 2010-05-04  
zhengyutong 写道
经常来你的博客,发现你写的东西非常有道理。

谢谢关注,其实,好多东西也都是我转载的。拿来给大家分享一下。
1 楼 zhengyutong 2010-05-04  
经常来你的博客,发现你写的东西非常有道理。

相关推荐

    网页设计要注意哪些要素

    网页设计要注意哪些要素?这些要素之间有什么联系?这是一些资深网页设计师从实践中总结出来的经验,相信会对您有些许启发。

    5个网页设计

    这里提到的"5个网页设计"压缩包包含五个不同的网页示例,很适合初学者作为学习素材。标签中提到了"html",意味着这五个网页可能主要基于HTML语言构建,而HTML(HyperText Markup Language)是网页开发的基础,用于...

    网页设计模板 网页设计模板

    下面我们将深入探讨网页设计模板的相关知识点,并结合"漂亮的网页设计"这一标签,对网页设计的关键要素进行详细阐述。 首先,网页设计模板是一种预先设计好的布局结构,通常包括头部、导航栏、主体内容区、侧边栏和...

    网页设计需要注意的一些基本问题 pdf

    在《网页设计需要注意的一些基本问题》这份资料中,详细阐述了在设计网页时应当关注的核心要素,包括页面设置、页面结构、目录结构、链接结构、字体字号以及提高浏览速度的方法,同时还提到了一些常用的网页设计软件...

    网页设计要素.doc

    在网页设计中,有几个核心要素对于构建一个成功的网站至关重要。本文将详细探讨这些要素,包括页面平铺、整体规划、功能易用性和气氛情感表达。 首先,页面平铺是设计的基础,涉及网页上不同元素的布局。导航栏是...

    网页设计元素矢量素材-按钮.导航条.底纹

    底纹"这个压缩包文件包含了网页设计中的三个核心组成部分:按钮、导航条和底纹,这些都是构建用户界面(UI)和提升用户体验(UX)的关键要素。 首先,我们来看按钮。在网页设计中,按钮是最直接的交互元素,用户...

    学生旅游景点网页设计模板 静态HTML我的家乡网页设计作业 DIV CSS广西梧州简单网页制作成品下载

    标题中的“学生旅游景点网页设计模板”表明这是一个针对学生群体,用于展示旅游景点的网页设计作品。这个模板可能包含了各种元素,如景点介绍、图片展示、旅游攻略等,旨在为学生提供一个信息丰富的在线平台,了解和...

    我的个人爱好(网页设计)

    在描述中还特别提到了主页面有轮播图,这是现代网页设计中常见的元素,通过自动切换的图片序列来吸引用户的注意力,展示多张相关的主题图片。 轮播图的设计涉及CSS(层叠样式表)和JavaScript的运用,有时还会借助...

    网页设计9页面

    在NBA篮球主题的网页设计中,可能会用到球员照片、比赛瞬间、篮球图标等元素,这些都需要高质量且与主题相关的图片,同时,合理的图像处理和排版可以使页面更加生动。 交互设计是网页设计中不容忽视的部分。良好的...

    个性网页设计要素.doc

    个性网页设计是网页设计领域中的一种独特风格,旨在通过独特的视觉元素和交互体验来展现设计师的独特创意和品牌特色。在创建个性化的网页时,页面设计是至关重要的环节,它涵盖了多个方面,如页面平铺、整体规划、...

    网页设计ppt模板下载

    网页设计是IT行业中一个至关重要的领域,特别是在数字化时代,它涉及到网站的视觉呈现、用户体验以及交互设计等多个方面。PPT模版在这个过程中扮演了辅助的角色,帮助设计师快速创建出具有专业外观的演示文稿,展示...

    _以HTML 5 CSS3 jQuery为基础的响应式布局网页设计探讨.pdf

    响应式布局网页设计需要注意以下几个要点: 1. 结构元素设计:结构元素设计是网页设计中的重要一项,也是响应式布局设计中的重要组成部分。HTML5 技术可以克服网页设计在结构元素设计方面的缺陷,提高网页的响应...

    视觉元素下网页设计的运用-网页设计-设计.pdf

    图片是网页设计中不可或缺的视觉元素,它能直观地传达信息,吸引用户的注意力。图片的选择和布局要与网页主题相符,确保信息的准确性和有效性。高清晰度和高质量的图片能提升网页的专业形象,而插图或者矢量图形则...

    网页设计期末作业

    在“网页设计期末作业”中,学生可能被要求创建一个包含以上元素的简单网页项目。这可能是一个个人信息主页,展示他们的兴趣、技能和联系信息,或者是一个小型的产品展示页面,需要包含产品图片、描述、价格等信息。...

    Dreamweaver网页设计 形考任务六

    Dreamweaver是由Adobe公司开发的一款专业级的网页制作软件,广泛应用于网页设计者,提供了直观的可视化界面和代码编辑功能,使得初学者也能轻松上手。 HTML(超文本标记语言)是网页设计的基础,它通过一系列标签来...

    网页设计一个小网页china

    网页设计是信息技术领域中不可或缺的一部分,它涉及到用户体验、视觉艺术、前端编程等多个方面。在这个名为"网页设计一个小网页china"的项目中,我们可以看到作者试图通过网页来表达其"中国梦"的主题。这不仅是一个...

    用Photoshop设计网页布局应注意的几个问题

    在使用Photoshop设计网页布局时,我们需要注意以下几个关键问题: 首先,要清楚网页文档的尺寸和分辨率。通常网页设计的分辨率是固定的,像常见的有1024x768、800x600等,分辨率越高意味着图像越清晰,但是会占用更...

    校园网页设计.pdf

    网页设计的目的是根据网页的主题,结合页面设计的相关原理,把造型、结构、信息、色彩等视觉元素有机地统一在网页中,并对网页风格等进行整体设计,形成一种独特的艺术。 校园网页设计的目标是创建一个内容健康、...

    整理的大多数网页设计整合

    网页设计是IT行业中一个至关重要的领域,它涵盖了视觉艺术、用户体验、交互设计和技术实现等多个方面。这个名为"大多数网页设计整合"的压缩包文件显然集合了大量的网页设计示例,为学习和参考提供了丰富的资源。 ...

    网页设计的几点要素.doc

    了解你的目标读者是网页设计中的另一个重要因素。设计师需要考虑读者的上网环境、兴趣偏好以及阅读习惯,比如页面加载速度对使用慢速网络的用户至关重要,色彩搭配需考虑到特定人群的视觉感受。了解读者的需求并以此...

Global site tag (gtag.js) - Google Analytics