一、网页整体布局标准
1、网页页面整体分A区(包含广告一区和主体内容区)和B区(包含广告二区、推荐区、广告三区以及服务区)页面标准示意图见右图:
2、其中A区(主体内容区和广告一区)由站长开发,主体内容区标准样式参考后面章节
3、如主体内容区域超长,超过1.5倍屏幕的内容通过折叠的方式进行折叠
4、B区(广告二、推荐区、广告三以及服务区)内容采用13页提供的技术组件
注释:主体内容区可以认为是页面Z想表达的内容总和,主体内容指从标题开始至正文内容结束;文章后的分享、推荐等不视为主体内容
总图示如下:
主体内容区三种类型:文章_基础样式
主体内容区三种类型:问答_基础样式
主体内容区三种类型:视频_基础样式
文章_扩展样式:兼容缩紧、加粗、无段落
文章_扩展样式:展开状态
文章_扩展样式:TAG推荐
文章_扩展样式:音频样式
问答_扩展样式:患者追问
问答_扩展样式:咨询记录
问答_扩展样式:多种回答聚合
问答_扩展样式:IM对话展示
模块_样式标注:组件样式
模块_样式标注:模块标注
模块_样式标注:特殊样式
模块_样式标注:图文样式
二、主体内容区内容触达标准
1、视频/音频可直接播放,并可达到视频类app当前播放效果,禁止使用让用户获 取信息需要ji大的权限成本,例如强制登录才能浏览和使用、需要下载APP才能获取等,相关内容页面展示示意标准图如下:
2、文字类型的可直接阅读,禁止出现外部跳转或者需要下载APP才能继续阅读等,页面展示示意标准图如下:
三、主体内容区内容质量标准
1、无作弊、第质和诈骗类信息
2、页面主体辨识容易,排版合理,段落分明,文本内容和背景颜色区分清晰
3、页面主体突出明确,主体内容位于页面靠前(首屏)且最新的位置,页面无广告或通过页面标签/页面布局能清楚地区分页面主体信息后的ji少量广告,对主体信息无任何干扰影响
4、获取页面主体信息的时候没有多余的干扰和成本,持续找到所需,并通过页面布局,持续了解页面各模块的主要内容
5、内容布局图标准示意图:
四、主体内容区浏览体验标准
1、获取成本:速度、广告、权限、上下范围边框等
1)页面打开速度不超过3秒
2)广告均为定制化模块,严格遵守医疗广告样式,详见下一章节
3)上下范围边框等,参考下图:
2、浏览顺畅:排版字色、字号、段落
字号
72PX 文章标题
54PX 模块标题
48PX 文章内容
39PX 辅助信息
字色
#02b7ca 医疗用色
#1f1f1f 黑色文字
#757575 灰色文字
#a3a3a3 浅灰文字
段落
90PX 文章段落
36PX 文章行距
24PX 摘要行距
五、广告一区广告标准
1、广告面积:广告一区广告面积不超过10%
2、广告内容:内容符合gj广告法的标准和百度广告审核准入标准,不可以出现第俗(灰色广告从严)、赌博、法律规定的违禁品或服务(包括纯文字的任何形式广告)不可以出现诱导、欺骗、虚假广告
3、广告样式:不可以悬浮弹窗广告(遮屏、置底、两侧悬浮);不可以广告闪动/抖动不固定;广告与功能按钮Z叠;广告自动播放或者自动下载;不允许有引导打开APP或者下载APP的遮屏交互;不可以放在用户容易误点的区域(如播放、购买功能按钮有Z叠);不可以出现广告自动播放或自动下载等;广告有明确显示此条内容属于广告,并且广告有关闭按钮;具体广告样式标准如下图:
六、技术实现标准
1、技术实现采用开源MIP框架 https://www.mipengine.org
2、B区(包含推荐区、广告二区、广告三区以及服务区)采用基于开源MIP的组件机制
3、技术解决方案文档见:https://pan.baidu.com/s/1bpMyksn
4、技术咨询请联系QQ : 876118118