横幅通知

横幅通知通常用于网站/官网/系统内的首页,常驻在页面顶部或底部的通屏横条,告知用户某些市场/营销/运营侧的信息。

常见的场景包括:新功能上线通知、系统升级运维通知、白皮书下载通知、周年庆产品促销、网站注册引导、产品发布会通知等等。

1. 通知编辑

通知标题

标题支持「富文本」编辑,比如对字体进行颜色、加粗、斜体、下划线、超链接等。

建议控制字数、突出信息重点、添加更多的 emoji 图标,让通知看起来更吸引人一些。

点击引导

你可以给横幅通知设定整行的点击链接,推荐添加一个 CTA (Call To Action) 的点击按钮,最好设置相同的链接跳转,用户点击时将会在新标签页打开。

2. 样式预览

展现位置

一般类型的通知会放置在页面顶部,对用户的视野侵占并不是很大,是介于「侧边按钮」和「弹框」之间的侵扰度。

但有些场景下,比如吸引用户下载白皮书,或者引导用户注册,可以放置在页面底部,点击率和展示效果会更好。

横幅背景色

纯色的背景略微有些单调,也不够吸引人,所以内置了很多色彩丰富的「渐变色」背景,你应该可以挑选出几款匹配产品风格的背景色。

如果你想自定义「横幅背景色」,我们提供的方式有一些的 hack,你可以询问前端来获得一个渐变色的 CSS 代码,比如 linear-gradient(to right, #40e0d0, #ff8c00, #ff0080); ,这个是指对 #40e0d0 #ff8c00#ff0080 三个颜色,从左到右进行渐变。

你也可以访问 https://uigradients.com/ copy 出对应的 CSS Code 即可,灵活自由度更高。

如果只想要纯色的背景色,只需要将颜色的 code 写进来即可。

按钮颜色 & 按钮文字颜色

不需要设置的过于花哨,一般建议按钮颜色为白色,文字颜色换一个比较稳重的颜色即可,比如 #1D55C4

3. 投放设置

投放设置相较于评价/问卷,会简化一些,面向哪些用户,在什么页面展示横幅,免打扰策略是怎么样的。

投放用户

可以面向全部用户,或者进行了身份信息传递 identify 的部分用户展示横幅,比如免费/付费用户,比如刚刚注册的用户。详情可查看 https://howxm.com/help/articles/distribution-users 投放用户。

显示页面

可以设定该横幅出现在哪些页面上,一般情况下,推荐出现在网站首页或者系统内的首页,而不是各种页面都呈现,所以建议一定要对页面位置进行设定。页面规则的配置,详情可查看:https://howxm.com/help/articles/distribution-page-setting

横幅通知支持对于移动端或PC端的设定,很多时候,横幅类通知是仅出现 PC 端的,而移动端更多的适用于弹框式的通知,您可以根据业务来进行配置。

关闭策略

不同于弹框式的评价/问卷/通知,横幅一般是在某个时间窗口期发布,加上对用户干扰度较弱。故横幅的关闭策略(免打扰)会更加的宽松,并未做以用户 uid 为身份的严格后端校验

当用户关闭横幅后,在当前用户的浏览过程(当前浏览器 session )中不会展示横幅,若新开浏览器窗口或者更换浏览器或设备,则会再次展示,仅做前端校验。经过跟一些内测用户的确认,这种机制是当前业务侧所需要的,且常规型的做法。

我们提供了三种关闭策略机制:

1. 始终展示横幅,没有关闭按钮。

2. 用户点击关闭后,关闭横幅。

3. 用户点击关闭或点击跳转后,关闭横幅

4. 数据及报表

横幅通知并没有展示量的统计,大多数情况下呈现量是等同于该页面的访问量,主要关注在用户的点击数量统计,而这也是业务侧最关心的效果数据。

横幅通知的数据列表和详情页,跟评价/问卷类似,包含了点击时间、点击页面、地区、浏览器行为等,也可以设置相关的推送与集成,此处不再赘诉。

5. 常见问题

* 「横幅通知」盖住了系统原有的顶部元素

「横幅通知」是在页面body元素的最顶部添加了div代码,若您的页面顶部元素使用的CSS 样式是position: fixed,那可能会被「横幅通知」所遮住。建议您的页面顶部元素可采用 position: sticky 的方式,可告知您的前端研发做确认和测试。

若实在没有办法调整,可以调整「横幅通知」出现在页面的底部,也可以获得同样的效果。