SEO优化
我们更专业

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置)

本文主要讲“展开全文功能”设置要求,百度搜索规定“展开全文功能”要有文字标识、只可出现一次、只可出现在落地页首屏中(列表页除外),与其它内容设置要有一定的间隔,那么展开全文功能如何设置才合理呢?下面云华来给大家讲讲。

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 1

展开全文功能设置的五条主要要求

1、展开全文功能设置前提

用户通过搜索进入落地页,目的是浏览网页内容,全文展开功能在一定程度上增加了用户浏览网页的成本,所以建议对于短小的文章或问答内容,不要设置展开全文按钮。针对篇幅较长的文章或问答内容,可以适当设置展开全文功能,但功能设置要合理实用,对于用户浏览要友好便捷,还有就是点击展开全文按钮要保证用户可以浏览全部网页内容。

2、要有明确文字说明

展开全文作为网页功能按钮,需要用文字向用户说明该按钮的作用,并给予用户明确的操作指引,避免用户误操作,如下图所示,该网页展开全文功能无文字标识说明,箭头指向的也是APP,容易被用户误以为只有下载APP才可以浏览全部内容,这样设置对用户是极其不友好的。

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 2
展开全文无文字标识

3、展开全文按钮与其他内容模块需设置间隔

展开全文按钮也属于网页主体的一部分,与其它模块内容需要保持一定的间隔,例如广告、相关推荐等模块,这样做的目的是避免由于间隔设置过近被用户误点击了,影响用户体验。如下图所示:展开全文按钮与图文广告之间的间隔设置太近,用户点击展开全文功能很容易误点击广告,用户体验极差。

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 3
展开全文按钮与其他内容模块需设置间隔

4、展开全文按钮不能出现在首屏

用户通过搜索进入落地页,目的是获取他所需要的图文内容,因糨落地页首屏不应出现展开全文功能按钮,应先充分展示网页主体内容,首页出现展开全文功能按钮不利于用户体验,也不利于用户留存与转化,如下图所示,首屏出现展开全文功能按钮,对于用户是极其不友好的。

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 4

5、展开全文按钮全文只能出现一次

用户点击展开全文按钮,目的是想浏览网页全部内容,如果一篇文章多次出现展开全文按钮,既增加了用户浏览网页的操作成本,也存在欺骗用户的形为,无论是对于用户还是搜索引擎都非常不友好。

6、正面参考案例

以上云华为大家深度剖析了展开全文功能按钮设置的五条主要要求,接下来为大家分享两个展开全文功能按钮的正确示范案例,下图两个案例,都是用户在浏览完首屏内容后才出现展开全文按钮,还有明显的文字说明,展开全文按钮与热门推荐、广告之间有着明显的间隔与分隔线,不会存在误点击的行为,用户体验感非常好。

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 5
展开全文功能正面参考案例

展开全文按钮的设置是网页排版中最重要的一项,合理设置展开全文按钮有助于提升用户浏览体验,赢得用户喜爱,还有利于提高搜索加权分值,建议站长们一定要重视起来。

添加点击展开全文按钮方法:

把以下代码添加到合适位置

<!-- “点击加载更多按钮”点击一次后续页面滚动到指定高度自动加载更多内容 -->
<script>
(function(element, triggerHeight) {
var autoLoad = false;
element.one('click', function() {
autoLoad = true;
});
$(window).scroll(function() {
if (!autoLoad) {
return
};
var windowBottom = $(window).height() + $(document).scrollTop(); // 文档窗口底部距离页面顶部高度
if (triggerHeight > (element.offset().top - windowBottom)) {
element.click();
}
});
})($('.btn.load-more.j-load-more'), -100);
</script>

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 6

为文章底部添加“点击展开全文”按钮(点击展开全文怎么设置) 7

版权声明:本站文章及图片来自互联网及其他公众平台,版权归原作者,如有侵权请联系我们删除!
本文链接:https://www.seoccc.com/seojiaocheng/465.html