网站的页面优化,也即网页优化是对网页的程序、内容、版块、布局等多方面的优化调整,使其适合搜索引擎检索,满足搜索引擎排名的指标,从而在搜索引擎检索中获得的排名提升,增强搜索引擎营销的效果使网站的产品相关的关键词能有好的排位。
以上说的是从技术角度、SEO角度来分析网站优化,而本文从版面设计、内容布置方面详细讲解网站内容优化:125个优化网站可用性的小点子。
一:控制用户的焦点和注意力
1、强调用户界面的着眼点
每个界面都应该有一个清晰的着眼点,即用户应该在第一眼就看到的地方。

2、通过视觉上的层级关系指引用户
用户应该首先看哪里,其次呢,再然后呢?你要构建出这种视觉上的层次结构来指引用户。
(1)合理使用负空间(物体之间的空间)

(2)使用单列布局:

(3)一定程度上重叠放置页面元素来强调连续性

3、遵循格式塔原则来设计页面布局
按照格式塔原则,我们通过会简化我们的感知来克服外在的混乱。比如我们会懂得将事情组织处理、给知道给元素归类。
格式塔原则包括一系列基本原则:相似原则,接近或临近原则,封闭原则,连续性原则,图形与背景的关系原则。

(1)使用接近性原则将相似的功能或菜单项归类

(2)将标题靠近各自的所属区域

(3)限制标题跟进各自的部分

4、在不打扰用户的同时描绘出界面的变化
有时你需要在用户面前做一些调整变化,这时候要使这些变化显而易见,但又不会给用户制造混乱。
(1)使用明显的动态变化

(2)将那些触发错误的元素区分出来

5、消除或减少不必要的信息
我们的精神焦点是有限的,多余的元素将会消耗我们的精力,因此,应该让用户聚焦于重要的信息或关键功能上。
(1)弹出框或模态视图下使用模糊背景

(2)最大化的突出体现数据比率的差异

(3)从设计元素中移除不必要的边框

(4)移除多余的或自我解释性的说明

(5)隐藏不常用的设置项、功能或信息

6、标示出折叠区外是否还有内容存在
现如今,大多数浏览器都会将滚动条隐藏起来。你需要使用“滚动线索”来告诉用户折叠区域外是否还有内容。
(1)通过折叠分割线来显示扩展的元素

(2)添加阴影来表明深度

(3)使用文字或图标来指向更多内容
文章源自 设计联盟 www.DesignLinks.cn 中国最具影响力的创意设计综合网站