一. 概述
可视化实验，通过所见即所得的在线编辑（比如对页面中的图片、文字、颜色、位置等元素和属性进行编辑），降低在Web/H5页面优化的场景下，产品方和运营方使用A/B实验工具的成本，免除编码。 前置条件及限制：
- 目前可视化实验支持在Web及H5页面开启。
- 用于创建可视化实验的页面需要接入「A/B 测试」的Web/H5/WAP SDK。
- 页面传输协议需使用HTTPS（Hypertext Transfer Protocol Secure：超文本传输安全协议）。
实验类型： 可视化实验的实验类型为客户端实验。 浏览器建议： 主流的浏览器均可支持；iOS系统自带Safari浏览器支持iOS10及以上版本(若系统版本较低请升级到iOS10及以上)。建议使用最新版Chrome及Windows Edge。
二. 应用场景
可视化实验适用于落地页、主页等单/多页面优化的场景。
多页面可视化实验：在一个版本中可以包含多个页面，适用于优化前后有关联的多个页面。
通过可视化编辑器对文本、图片等元素进行编辑和替换，进而生成多个版本进行实验，探究不同方案的页面效果，如用户停留时长、PV/UV等。目前可视化实验支持的页面包括可接入SDK的自建Web及H5页面，暂不支持第三方工具搭建的页面。
三、操作演示
快速了解 可视化实验 创建流程?
四. 可视化编辑操作说明
单页面 可视化实验 ：
点击DataTester的「进入编辑器」，即可进入可视化编辑页面。
| 模块 | 子项 | 操作说明 |
|---|---|---|
| 顶部导航栏 | / | |
| 内容 | 字体排版 | 支持对字号、颜色、文本内容、加粗/倾斜、对齐方式等属性进行编辑 |
| 样式 | 尺寸、布局、背景 | 尺寸支持元素尺寸相关CSS样式编辑 |
| 事件 | 圈选事件 | 针对「按钮」、「链接」、「图片」、「文本」类型的元素提供圈选事件能力。在编辑栏下，点击事件，新增事件名称；保存后新建指标：点击新建指标，会弹出指标新建页面。 |
| HTML新增元素 | / | 支持通过HTML代码的方式新增元素。 （1）格式化 （2）换行和取消换行 （3）HTML代码格式校验 （4）手动输入标签，自动闭合标签 （5）优化默认初始化示例代码 |
多页面 可视化实验 ：
点击【添加页面】，可在一个版本中添加多个页面，可对每个页面单独进行编辑。
注：页面顺序不会影响用户浏览页面体验。举例，假如用户首先看到的是页面2，然后再看到的是页面1，用户仍然会看到同一实验版本的页面1。
多页面编辑：可在左上角切换至不同页面进行可视化编辑，具体可操作项同可视化编辑操作说明 。
© 版权声明
文章版权归作者所有，未经允许请勿转载，侵权请联系 admin@trc20.tw 删除。
THE END
