高過ぎる直帰率を下げるために読了時間と追尾式関連記事を設置した

2018年9月21日ウェブマーケティング,雑記Stinger6,WordPress,直帰率,読了時間,関連記事

サイトやブログを運営している皆様、自分のサイトのデータは見ていますか？

僕の場合、つい先日にGoogle Analyticsを導入したのですが、それを見ていて気がつきました。

「86%」という圧倒的な直帰率＾＾；

※直帰率 = １ページだけ閲覧して離脱した訪問数の割合

ちなみに直帰率とは低ければそれで良いというものでももちろんありません。

サイト内のどこに情報があるのか分かりにくく、ユーザーが何度もページ遷移しなければいけないサイトの場合、必然的に直帰率は低下しますが、サイトにとって良い状態ではありません。

当サイトの場合、検索クエリに対するユーザーの望む以上の情報量でコンテンツを作成しているので、直帰率は高い(ユーザーが満足してページを閉じてしまう)と思っていましたが、さすがに数値が高すぎたので幾つか対策してみました。(WordPress,テーマはStinger6を使用)

サイトの直帰率(≒離脱率)を下げると"噂"の「読了時間」をプラグイン無しで設置

single.phpにちょろっとコードを記載する(文字数から読了時間を概算)だけ

<?php
$mycontent = $post->post_content;
$word = mb_strlen(strip_tags($mycontent));
$m = floor($word / 400) + 1 ;
$est = '約 ' . $m . ' 分' ;
?>
<div class="rdtime">この記事を読むのに必要な時間の目安: <span style="background-color: yellow"><?php echo $est; ?></span></div>

面倒なんでspanタグの中にcss直接書き込んでいますが、本当はclassを指定してcssで装飾するべきです。

style.cssでサイトに合うように修正

.rdtime {
	font-size:14px;
	margin:0px;
	color: #666666;
	line-height: 15px;
	margin-bottom: 10px;
}

完成イメージは以下になります。

当サイトでは、文字サイズを17px(18pxだったかも)にしており、それよりは小さい文字サイズに変更したり、幅を整えたりしています。

サイドバーに追尾式の関連記事を設置して、回遊率を増やす

Stinger6の場合、サイドバーの追尾式広告にウィジェットを追加すればOKです。

プラグインは何でも良いのですが、「WordPress Popular Posts」を利用して設置しました。

完成イメージはこちら。

分かりにくいですが、追尾式となっています。

外観 > ウィジェットから、以下のようにWordPress Pupular Postsを差し込みましょう。

表示する記事数ですが、多分５記事くらいが限度では？と思われます。

これだけだと上の画像のような整形された形にならないので、cssを弄ります。

サイトとのバランスを見てcssで調整

#side aside ul li ul li{
	list-style-type: none;
	margin-bottom: 15px;
	background-repeat: no-repeat;
	background-position: left middle;
	font-size: 14px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ccc;
}

これはStinger6の場合ですので、id or class名は自分のサイトに合わせてください。

やっていることとしては、リンクの文字の大きさを14pxと小さめにし、記事と記事の間に点線を挿入しています。

自分のサイトやブログの直帰率や離脱率を下げ、回遊率を高めることはSEO的にも大事な要素になってきます。

当サイトも、僕の気まぐれで少しずつカスタマイズしていきます。

2018年9月21日ウェブマーケティング,雑記Stinger6,WordPress,直帰率,読了時間,関連記事