关于网站地图.pdf

关于网站地图 　　从前有三只小猪，长大自立了分别造房子住。老大搬来草堆堆出草屋，老二搬来木头搭出木屋 ，老三搬来砖头，砌墙，造烟囱，造出了坚固的砖房。一天晚上大灰狼相继吹飞撞毁老大老二的草 屋木屋后，来到老三家门口。进不去砖房傻眼了，看到烟囱就趴上屋顶跳进去，不料掉进锅炉变成 了大灰狼火锅 … 　　这故事都熟的吧。用咱常用的 map 表达出来呢就是下图的样子： 　　描述网站的 Sitemap 简单来说也就是这么画出来地，不复杂，但是会包括进各种流程，通向不 同的页面和结果。 　　 Wikipedia 对 Sitemap 解释如下： 　　网站地图描述了一个网站的架构。它可以是一个任意形式的文档，用作网页设计的设计工具， 也可以是列出网站中所有页面的一个网页，通常采用分级形式。 引自维基百科 creator: en:User:Trevor macinnis 　　另一个概念是 XML 网站地图 Sitemaps ，就不作为本文讨论对象了。 　　 Sitemaps 是站点管理员向有哪些信誉好的足球投注网站引擎爬虫公布站点可被抓取页面的协议， Sitemap 文件内容必须 遵循 XML 格式的定义。每个 URL 可以包含更新的周期和时间、 URL 在整个站点中的优先级。这样可 以让有哪些信誉好的足球投注网站引擎更佳有效的抓取网站内容。 　　画站点地图的好处很多，需求阶段可以用于和产品讨论大盘，交互阶段可以用于优化页面流， 开发阶段可以用于架构的预铺。画站点地图很容易很快， Omnigraffle 、Visio 、Word 、 PS 、AI 、画 图板、 QQ 截屏工具、纸笔 … 。什么顺手就用什么，不拘泥于工具。我常用的工具是 Visio 和AI 。 Visio 有好用的只能连线； AI 如果已有一套常用的 Sitemap 样式的话也很效率，对于画 Conceptual Model 或别的分析图会更加得心应手。 　　我喜欢把这样的图放在交互说明文档的第一页，功能上作为后页详述单页的总起，形式上让自 己的产物看着更有专业感。 　　怎么把 Sitemap 画得更专业？ 《Web 信息架构》书中用的是 蓝图“ Blueprints 一词。” 　　（蓝图会显示出网页和其他内容组件之间的关系，可以用来塑造组织、导航以及标签系统，通 常也称为 网站地图“ ”）并将 Blueprints 分为两个阶段 —— 高级架构蓝图 High-Level Architecture Blueprints; 详尽的蓝图 Detailed Blueprints 　 1,高级架构蓝图阶段 　　高级蓝图产生在设计前期阶段，通常是从制高点看网站的主页开始，描述网站的主要栏目 区域。就好比装修房子先从调整房间结构开始。高级蓝图上可以看到页面、页面内组件、页面组、 以及页面之间的关系（如下图）。尽量利用简单快速的工具产出高级蓝图可以促进产品层面的讨论 。 　 2,详尽的蓝图阶段 　　当 装修“ ”逐渐深入细节，栏目内部页面关系细化成型时，就需要用到详尽蓝图了。它描述的是 网站某一栏目内部页面的详细关系。详尽蓝图的主要观众是开发人员，描述清晰的详尽蓝图将会帮 助与开发同事的顺利衔接。最终归档到交互文档中的应当是详尽蓝图。至于要画到多详尽，就要视 项目而定。一个简单的介绍型网站的详尽蓝图就算从首页开始画完也未必很庞大。 在《 Information architecture-Blueprints for the web 》中，作者针对不同类型的网页，给出了几 种 Sitemap 的形式： 　 Tree map 树型图： 　　便于展示层次体系，不过当纵向层级多了之后宽度不够用。可以通过结合梳子型图来避免。 　 Comb map 梳子型图： 　　当同级内容很多时，梳子型图可以避免图形上的过宽。如果打算最后把 Sitemap 归入 word 或其 他文档的话，建议使用梳子型图将 Sitemap 画成竖长型，毕竟多数电子文档上方不适合放过宽的图 。 　 Star map 星型图 　　当网站规模很大内容层级很多时，用星型图可以避免顶部层级相距过远不宜检索的麻烦。以首 页为圆心，放射状展现各级内容会把 Sitemap