一个成品网页的内容构建策略（ContentStrategy）成品

　　一个成品网页的内容构建策略（ContentStrategy）成品

　　一个完成的网页由网页设计和网页工程组成。内容规划是网页设计的一部分。在网页设计的研究中，网页设计过程中有一个环节叫做内容构建策略（Content Strategy）。

　　图一

　　图二

　　Step1，图1，内容构建=规划。这一步需要组织项目的框架内容，网页的主要用途，有清晰的脉络和计划。图2.网页不限于PC输出，也可以输出到手机和IPAD。

　　Step2，明确网页设计的三个利益相关方，至少是网站拥有者和网站用户。 网站业主需要考虑到需要向终端用户传递信息，需要考虑技术实现和信息传播空间渠道，方便发布，方便交互。 网站用户的需求是找到他们感兴趣和有用的信息，他们需要网站拥有信息的准确性和共享性。

　　图 3

　　Step3：图3，创建用户画像（Persona），匹配网站的适用群体，里面会收录用户的属性、目标、期望等。往往在Persona建立之前，目标人群会通过广泛的访谈和问卷调查找到。

　　图 4

　　Step4：图4。有了前三步的基本铺垫，我们就可以大致对网页的内容有了一个方向。这时候我们就可以对页面功能内容进行初步的分类。例如，餐饮页面有四个功能细分：自助服务、烹饪课程、家庭服务和餐厅。

　　图 5

　　图 6

　　Step5：图5，接下来是网站level的内容策划，分为一级、二级、三级；这四个功能模块的内容按照优先级分布在三个层次。在这里，厨师到家服务被视为主要功能，服务指数列在1st Tier下。在 2nd Tier 下，博客分享是一种交流方式。 3rd Tier需要注明合作站点等辅助信息内容，以支持某食品消费服务网站的输出。

　　Step6：图6，单个网页层面的内容规划。 Side-wide Hierarchy中家中的关卡地图进一步填充了内容。主页下有4层内容，每一层内容依次分层和命名。很多网络设计初学者对信息框架图的推导比较主观，或者缺乏细分。使用第 5 步和第 6 步输出内容级别和详细信息将使项目更具逻辑性。

　　图 7

　　Step7：如图7所示，网页内容的优先级也需要细化，以线框可视化的形式展示，并以颜色区分。如今，很少有学习网页设计的人使用颜色模块化。建议这样划分可以让读者阅读更流畅。

　　图 8

　　Step8：图8，到了这一步，就可以规划信息结构了。信息架构图最直观的展示了网站的架构，是以上一系列推导的结果。比如这张信息架构图，可以直观的看到服务栏下有Home Chef、Catering、Restaurant。

　　图 9

　　Step9，图9，制作线框。线框是在网页中表达逻辑序列的一种低保真方式。 Wireframe 线框的输出也是网站内容制作的一个重要过程。注释和修改痕迹也会在迭代后进行修改并进行标记。我们一般建议我们的学生邀请 1-3 名学生帮助完成迭代过程。

　　图 10

　　Step10，图10，将多个Wireframe线框排列在一起，并添加定向连接线。一条没有方向的连线，让Wireframe显得缺乏逻辑，也失去了为他人迭代测试的意义。

　　以上十步是康诗诗身边的同学在学习网页设计时自己搭建网页的步骤，加上用户反馈和修改意见，足以应付一般网页设计。

　　希望有所启发

　　————————————————————