手机视频WAP门户信息架构及设计规范

手机视频 WAP 门户 信息架构 及设计规范 视频运营中心 业务运营部 目 录 第一章 . 概述 . 3 1.1 背景 . 3 1.2 适用范围 . 4 第二章 .门户设计总体原则 . 4 第三章 . WAP 门户信息架构及设计规范 . 6 3.1 WAP 门户页面分类 . 6 3.2 手机视频页面适配标准 . 7 3.3 WAP 门户主要页面信息架构 . 7 3.4 WAP 门户运营类页面信息架构标准 . 14 附文一 . 14 附文二 . 15 修订历史 版本 日期 修订人 描述 1.0.0 2010年 8 月 23 日 张洪志 第一稿建立 1.0.1 2010年 9 月 29 日 张洪志 补充第二章及 3.4.1 部分内容 第一章 . 概述 1.1 背景 随着手机视频新业务管理平台 OMS2.0 的启用，平台引入了更加灵活和便捷的栏目计费方式，同时也新增了一些通用的标签，简化并标准化了合作伙伴的代码开发和调试工作，而与之相配套的门户信息架构和设计规范一直是门户运营的薄弱环节 。 手机视频业务发展至今， 门户 各 业务分属于不同运营方，页面风格以及用户使用流程 并 不统一，严重影响了用户体验，各从属于 手机视频 门户的 业务 页面应按照统一规范制作，保证 手机视频 站点的结构统一 。 此外，集团公司计划明年新入库的终端中，部分终端的浏览器不再支持 WAP1.0 及 WAP1.2 协议，而只支持 WAP2.0 协议。为了能够使 这部分终端用户正常使用手机视频 WAP 业务 的 服务， 就需要基于现有的 WAP 门户业务架构，提供平行的一整套 WAP2.0 页面。 1.2 适用范围 手机视频 WAP 门户中的页面按照管理范畴，可以分为三类：门户运营类页面、合作方运营类页面、渠道类页面。 门户运营类页面主要是指手机视频 WAP 门户， MY 频道页面等由业务运营部网站运营主导执行运营的页面。 合作方运营类页面主要是指由合作伙伴、垂直栏目、本地业务等在门户上 主导运营的页面。 渠道类页面主要是指 各合作方 在产品 渠 道 推广过程中所 定制的页面， 且这些 页面在手机视频 WAP 门户 主站无任何 链接和入口（ 包括 搜索）。 本规范主要适用对象不仅局限于门户运营类页面和合作方运营类页面，也可供渠道类页面等其它页面参考。 第二章 .门户设计总体原则 所有页面 或者内容模板均 需分别 针对 WAP1.x 简 版页面 和WAP2.0 彩版页面 进行设计和制作，在保持排版结构及内容基本统一的前提下，充分发挥 WAP2.0 展现能力，比如通过导航添加背景 色 以 区分不同 区块 业务内容 ； 用户业务订购流程，必须遵循两次确认原则，且页面中不允许存在产生用户使用歧义的信息和链接； 含计费点链接（播放、下载、订购）的页面 ，针对未订购用户必须有与内容和栏目对应的明显准确无误的资费提示，以及清楚的表明被订购内容所属的业务名称和栏目名称等信息； 对于资费提醒文字，须在计费点链接上下同一屏中呈现； 按次计费提醒文字紧接按次计费点 ； 除重点内容产品外，渠道类推广页面，不允许挂接在手机视频WAP 门户页面中，涉及的节目内容也不允许通过 WAP 门户搜索功能被用户访问到； WAP 门户所有页面暂不允许用户主动输入内容，并被第三方用户立即可见，包括好友推荐； 除渠道类页面外，其余所有页面底部必须有“返回移动梦网 ”及“返回手机视频”链接；非顶级栏目对应页面，还需添加具有返回功能的导航链接； 各业务对应的 每 类 页面模板 （见 3.1 WAP 门户页面分类） 不能超过 10 个 ，各业务总的模板数不得超过 50 个； 根据 OMS2.0 平台提供的模板审核功能， WAP 门户页面运营将增加内容模板审核环节，各业务方在业务上线之前，业务对应的生产模板均需要通过网站运营技术人员的审核，符合 WAP 门户信息架构及设计规范的模板方可成为生产模板投入页面生产发布； 各产品 WAP 各页面设计按照 本规范提供的模板设计式样库进行，超出模板设计式样库的展示样式需 产品负 责 人把关，并与网站运营团队经过评审后将样式纳入该合作方模板设计样式库中，投入页面生产发布。 （原则根据手机视频 WAP 网站运营的具体情况进行完善调整） 第三章 . WAP 门户 信息架构 及设计规范 3.1 WAP 门户 页面 分类 WAP 网站页面 包含门户运营类及 合作方运营类 页面， 根据 产品内容层次 主要分为 八 类页面：业务首页、栏目页面、专题页面、列表页面 、 内容集页面 、内容 播放 页面、订购页面和辅助页面； 业 务 首 页专 题 页 面栏 目 及 子 栏目 页 面列 表 页 面内 容 集 页 面内 容 播 放 页面订 购 页 面 辅 助 页 面门 户 综 合 类 页 面 业务首页：即各业务门户，集中化展示热点、重点内容，模块化展示业 务所有栏目内容及其他内容； 栏目页面：各级子栏目页面； 专题页面：围绕热点内容或营销活动设计的专题首页及其各级页面； 列表页面：内容列表页； 内容集页面：类似于内容列表页，多条节目（例如全片）集中展示，并展示播放及下载链接； 内容播放页面：单条内容的详情播放页面； 订购页面：即业务订购页； 辅助页面：与业务或营销活动相关的说明页，帮助页等页面； 3.2 手机视频页面适配标准 根据终端 UA 对 手机视频 1.X 页面及 2.0 彩版页面进行精准终端适配 。 手机视频各版本页面参数标准 页面版本 页面 链接行数 页面大小 （代码） 页面大小 （代码 +图片） 1.X 版本 50 60 小于 10K 小于 15K 2.0 版本 70 80 小于 30K 小于 50K 3.3 WAP 门户 主要 页面 信息架构 3.3.1 业务 首页 、 栏目页面 手机视频 WAP 门户 各 业务和栏目页面 划分为三 个区块： 顶部 导航 区块、中部 核心 区块、底部区块 。 频 道 B a n n e r公 告 行 （ 1 行 ）频 道 导 航 （ 2 - 3 行 ）中 部 核 心 区 块 1中 部 核 心 区 块 2中 部 核 心 区 块 N返 回 上 一 级返 回 栏 目 首 页返 回 手 机 视 频 -简 版 -彩 版返 回 移 动 梦 网【 现 在 是 1 0 - 0 8 - 1 2 1 7 : 2 8 】 栏 目 栏 目 栏 目栏目首页、业务首页 顶部导航区块 ：频道 Banner + 栏目 导航； 中部核心区块 ： 由二级导航 + 子区块内容推荐位 展现频道内容 + 交叉推荐 + 互动功能 + 底部 导航 等内容，展示方面可根据自身业务特点灵活处理； 底部区块：返回 区； 具体展示内容要求如下（示例如右图）： 频道 Banner 按照手机视频 Banner统一风格进行设计； 公告行滚动展示当前频道的公告、重点营销活动、重点专题、重点内容推介，无时隐藏；WAP2.0 可灵活配置为滚动内容的展示； 频道导航 统一放置 ， 首页导航 放置频道重点栏目等常态化栏目；其他 栏目页面的导航放置该栏目 内重点栏目导航 、热点专题、活动 ， 频道导航 总行数为 2-3行 ； 中部核心区块不做明确要求，需根据栏目设计进行版块划分，并且具备明显区隔，设计可参考本规范设计式样举例进行灵活设计（见附文）； 频 道 B a n n e r频 道 - X X 栏 目 - . . . - X X 栏 目返 回 上 一 级返 回 栏 目 首 页返 回 手 机 视 频 -简 版 -彩 版返 回 移 动 梦 网【 现 在 是 1 0 - 0 8 - 1 2 1 7 : 2 8 】内 容 图 片节 目 名 称 列 表1 2 3 4 5内 容 链 接 内 容 链 接 内 容内 容 链 接 内 容 链 接 内 容 底 部 导 航精 彩 推 荐 内 容好 友 推 荐列表页面 返回 区放置内容规则见门户设计原则； 3.3.2 专题 页面 专题页面为各产品 围绕内容设计的专题首页及各级页面，页面在WAP 门户设计规范原则的前提下，可根据组织内容特点灵活设计。 3.3.3 列表 页面 手机视频 WAP 门户 列表 页面划分为四区块： 顶部 导航 区块、中部 核心 区块、交叉推广区块、 底部区块 。 顶部导航区块：栏目 Banner +标准化访问路径 ； 中部核心区块：内容列表； 交叉推广区块：不做明确要求，可参照本规范设计式样举例进行灵活设计（见附文）； 底部区块：同 频道首页、栏目页面的顶部导航； 具体展示内容要求如下（示例 如右图）： 栏目 Banner 按照手机视频 WAP统一风格进行设计； 标准化访问路径 ： 用户访问至 当前列表 页面的标准路径 导航； 频 道 - X X 栏 目 - . . . - X X 栏 目返 回 上 一 级返 回 栏 目 首 页返 回 手 机 视 频 -简 版 -彩 版返 回 移 动 梦 网【 现 在 是 1 0 - 0 8 - 1 2 1 7 : 2 8 】内 容 图 片简 介 ：简 介 简 介 简 介 简 介 简 介 简 介点 播 ： 高 清 版 流 畅 版下 载 观 看 更 流 畅按 次 X 元包 月 畅 看 更 精 彩 节 目 名 称 节 目 名 称内 容 链 接 内 容 链 接 内 容内 容 链 接 内 容 链 接 内 容 底 部 导 航精 彩 推 荐 内 容节 目 名 称流 量 费 全 免好 友 推 荐高 清 观 看 流 畅 观 看下 载 观 看 更 流 畅按 次 X 元 包 月 畅 看 更 精 彩内容播放页面 中部核心区块 ：主要以同一列表形式（并非统一列表形式）展示该叶子栏目的多条内容， 中部核心区块 底部展示分页导航，可采用上一页下一页形式，也可采用页码形式； 3.3.4 内容集 页面 手机视频 WAP 门户 各 内容播放 页面划分为四区块：顶部区块、中部核心区块、交叉推广区块、底部区块。 顶部区块 ： 标准化访问路径 ； 中部核心区块：内容列表； 交叉推广区块：不做明确要求，可参照本规范设计式样举例进行灵活设计 （见附文）； 底部区块：同 频道首页、栏目页面的顶部导航； 3.3.5 内容播放 页面 手机视频 WAP 门户 各 内容播放 页面划分为四区块：顶部区块、中部核心区块、交叉推广区块、底部区块。 顶部区块 ： 标准化访问路径 ； 中部核心区块 ：节目内容主体呈现位置。组成元素为节目标题，节目图片，节目播放下载链接，订购链接，节目文字介绍，临近节目导航，使用帮助 FAQ 等； 交叉推广区块：不做明确要求，可参照本规范设计式样举例进行灵活设计（见附文）； 底部区块：同 频道首页、栏目页面的顶部导航； 具体展示内容要求如下： 标准化访问路径 ： 用 户访问至 当前列表 页面的标准路径 导航； 中部核心区块：严格按照规范设计样式进行设计（见附文）； 3.4 WAP 门户 页面信息及设计规范 前提：所有页面必须遵循本规范中的门户设计总体原则要求 。 3.4.1 WAP 门户页面展示信息内容规范 文字：针对 WAP1.X 及 WAP2.0，单行文字设置展示不超过13 个字（含特殊字符）； 文字：单行节目名称中 不得出现“ # ￥ % & * _ + = 【 】”等特殊符号 ，使用 全角 符号 ； 图片：页面焦点大图 160 80，业务首页头部 168 35，其他各级页面头部 160 30，专题页面图片在遵循本规范参数标准的情况下可灵活设计，一行单图宽度 160，一行两图宽度80，一行三图宽度 53，一行四图宽度 40， ICON 规格为 15 15； 正文文字用 12 号字 Arial， 重点位置推介内容可采用与栏目主体风格相近的颜色凸显； 各业务首页面不得出现无效链接、链接指向错误等错误； 页面内容组织需 以颜色 、栏目导航等 区分不同版块业务内容 ； 按次计费点文字：流 畅播放、清晰播放、免流量播放、下载、快速下载、免流量下载、保存； 订购计费点文字：包月无限量、精彩 15 优惠套餐、包月 X 元、包月畅看更精彩 ； 各业务首页面不得出现违背针对敏感内容梦网拨测标准，具体标准见附文； 3.4.2 WAP 页面设计要求 一、 页面大小：按照本规范的参数标准进行开发； 二、 风格： 使用较为柔和的底色，页面整体色彩清晰 简洁； 页面尽量使用同 一种字体颜色的，不多用一种颜色 ； 使 用 简 洁 易 懂 的 图 标icon，延展性强 ； 建议业务首页、栏目首页、专题也等页面 中心放置焦点图片，提升整体明快感 ，不做强制要求； 以颜色 作为底色 区分不同版块业务内容 ，如用图做为背景图，默认底色须须背景图颜色基本一致； 三、页面主色调风格： 本阶段暂不对各业务页面主色调风格 进行具体规划设置； 四、链接及文字颜色风格： 本阶段暂不对各业务链接及文字风格进行具体规划设置； 3.4 WAP 门户 运营类 页面 信息架构标准 B a n n e r导 航 区 块 （ 2 行 ）热 点 推 荐 区 块 （ 4 行 ）品 牌 业 务 入 口 （ 2 行 ）图 片 推 荐 区 （ 1 行 ）底 部 功 能 返 回 区 （ 6 行 ）直 播 区 块 （ 4 行 ）营 销 活 动 区 块 （ 不 超 过 3 行 ）垂 直 栏 目 内 容 推 荐 区 块 （ 1 8行 ）B a n n e r导 航 2 （ 1 - 2 行 ）W A P 1 . 0 门 户 首 页 样 式 W A P 2 . 0 门 户 首 页 样 式本 地 业 务 区 块 （ 3 行 ）排 行 榜 区 块 （ 4 行 ）品 牌 业 务 内 容 推 荐 区 块 （ 1 4行 ）免 费 推 荐 区 块 （ 6 行 ）导 航 1 （ 2 - 3行 ）营 销 活 动 区 块 （ 不 超 过 3 行 ）热 点 推 荐 区 块 （ 4 行 ）品 牌 业 务 入 口 （