《网页设计综合指南》（二）：内容布局、页面结构等

注：计划师和开拓职员在构建网站时，必要思量许多工作，从视觉外面到成果计划。为了简化这个进程，我们筹备了这个指南。限于篇幅限定，将这一指南分为三部门，此为第二部门内容。

上一篇：《网页计划综合指南》（一）：网站舆图优化篇

下一篇：《网页计划综合指南》（三）：移动适配、无障碍计划等

本文首要内容为：

二、计划页面

• 2.1 内容计策

• 2.2 页面布局

• 2.3 视觉条理

• 2.4 转动操纵

• 2.5 内容加载

• 2.6 按钮

• 2.7 图像化

• 2.8 视频

• 2.9 举动相应按钮

• 2.10 网页表单

• 2.11 交互动画

二、计划页面

2.1 内容计策

内容计策最重要的一点就是聚焦在页面方针上。领略页面的方针，并按照方针布置内容。

下面是一些进步用户对内容领略的适用能力：

• 防备信息超载。信息超载是一个严峻的题目。用户认为有太多信息需消化，从而无法下抉择或采纳动作。有一些简朴的要领能最小化信息超载。一个常用的要领就是分块——将内容分成几个模块，辅佐用户更好的领略和处理赏罚。结账单就是最好的例子。每次最多表现五到七个输入字段，将结帐单拆分到多个页面，须要时才慢慢果真字段。

(Image credit: Witteia)

• 停止行话和行业术语。页面上呈现的每个未知术语或短语城市增进用户的认知负荷。一个安详的方法就是为全部读者编辑内容，并选择全部用户都清晰易懂的词。

• 最大限度地镌汰长内容。按照信息过载的概念，假如网站不是以信息斲丧为主，只管停止长文本块。 譬喻，假如您必要提供有关处事或产物的具体信息，请实行慢慢睁开具体信息。 将文本块写的短一些，更利便领略。按照罗伯特·盖宁（Robert Gunning）的“How to Take the Fog Out of Business Writing”这本书，为了舒服的阅读，大大都的句子应该是 20 个字以内。

(Image credit: The Daily Rind)

• 停止全部字母回收大写。所有大写的文本（也就是全部字母都是大写的文本）对付字符量较少的文本是可以的，好比缩略词和图标；可是，请停止在字符量较量大的处所行使（譬喻段落，表格标签，错误，关照）。正如Miles Tinker在“Legibility of Print”一书中提到的，所有大写会低落阅读速率。其它，大大都读者会认为所有大写的文本不能快速清楚的领略。

所有回收大写，用户较量难以领略。

2.2 页面布局

一个布局公道的页面清晰地表现了每个用户界面元素位于机关中的位置。固然没有一个得当全部页面的法则，可是有一些指导性原则可以辅佐你建设一个健壮的布局：

• 使布局可猜测。使您的计划切实用户祈望。可以参考同类网站来找出在页面上必要哪些元素以及位置。行使方针用户认识的模式。

• 行使机关网格。机关网格将页面分别为几块首要地区，并按照巨细和位置界说地区之间的相关。在网格的辅佐下，能更轻松地将差异部门组合在一路，形成一个有凝结力的页面。

网格和机关是计划的一部门，且能顺应差异屏幕尺寸的计划场景。Adobe XD的机关网格使计划职员可以或许针对差异的屏幕尺寸实现同等计划及打点网格中元素之间的比例。

• 行使低保真线框模仿，停止界面混乱不清楚。紊乱会增进领略的难度——每添加一个按钮，图像或文本城市使页面越发伟大。在用真实元素构建页面之前，先建设一个线框图，说明它，然后去掉那些不是绝对须要的对象。

Adobe XD中建设的低保真线框图(Image credit: Tim Hykes)

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!