［右サイドバー・左サイドバー・3カラム］どれが正解かテストしてみた結果…

ブログやWordPressを始めて、いちばん最初に悩むことの1つが“サイトのデザインや構成”についてですよね。

そのなかでもサイドバー（メニューバー）の配置を右にするのか？左にするのか？それとも3カラムにするのか？…は、初心者ブロガーが悩むポイントの１つだと思います。

そこで今回は、カラム構成やサイドバーの配置についていろいろとまとめてみました。

実際に自分のブログでテストした結果も公開しておりますので、ぜひ今後のブログ運営にお役立ていただければと思います！

そもそもサイドバーなんて必要ない!?

こんなテーマで記事を書きはじめておいてなんですが、しょっぱなから元も子もないことを言ってもいいですか？

ってゆーか、
そもそもサイドバーなんて必要ありません！

正確に言うと、サイドバーが必要のない時代がすぐそこまでやって来ております。いやもう来ているかも知れません。

世の中はこれから間違いなく「モバイルファースト」「モバイルオンリー」（＝世の中がスマートフォンやタブレット中心になりPCがなくなっていく）の時代になります。

スマホが中心の世界になれば、そもそもPC向けのレイアウトである2カラムとか3カラムみたいなデザインって、意味がなくなるんですよね。

だって、スマホは基本的に“１カラム”ですから。

上記は私が運営している別ブログ（月間100万pvほどのライフハック系メディア）のアクセスについて、スマホやPC比率を出したグラフとなります。

だいたいスマホとタブレットで75～80％を占めている状況です。PCは18%前後しかありません。

私は仕事柄、さまざま業界のWebサイトのアクセスを見る機会がありますが、どこのメディアもほとんどこれと同じような状況です。

今後もPCのシェアはどんどん小さくなっていくでしょうね。０にはならないにしても、限りなく０に近い数にはなっていくはずです。

そんなシェアの低いPCデバイスのために、やれ右メニューバーだ、やれ3カラムだ、、なんて議論はあまり重要ではないのかな～というのが私の個人的な意見です。

…とは言え、まだまだ2割のユーザーがいらっしゃいますので、（重要ではないにしろ）メニューバーの配置については引き続き考察していきますよ。

出鼻をくじいてしまい恐縮ではございますが、ぜひ続きをお読みくださいませ。

 

サイドバー配置でABテストをしてみた！

ごちゃごちゃ考えるよりもまずは実験してみよう！

…ということで、サイドバーの位置を右・左・両側（３カラム）にしたときに、ユーザー動向にどんな変化が起こるのかをABテストしてみました。

サイドバー位置	滞在時間	直帰率	離脱率	訪問あたりPV
右	4:14	53.7%	26.3%	3.77
左	3:97	51.6%	24.9%	3.81
3カラム	3:03	62.8%	35.5%	2.96

※滞在時間…1ユーザーが平均どのくらいの時間サイトに滞在したか
※直帰率…そのページを入り口にして、そのまますぐに直帰してしまった割合
※離脱率…そのページを最後にサイトを離脱してしまった割合
※訪問あたりPV…1ユーザーあたりが平均で何ページ閲覧したか

どうでしょう？ それぞれの差異は小さいものの、比較的分かりやすい理想的な結果が出たと思います。

今回のABテストによって得られた示唆をテキストにまとめると、以下のようなことが言えると思います。

右サイドバー（2カラム）

⚫︎ユーザーの滞在時間がもっとも長い
⚫︎直帰率・離脱率がやや高くなる
⚫︎他ページへの遷移は普通レベル

左サイドバー（2カラム）

⚫︎ユーザーの滞在時間はやや短い
⚫︎直帰率・離脱率はもっとも低い
⚫︎他ページへの遷移はもっとも良い

両側サイドバー（3カラム）

⚫︎ユーザーの滞在時間はもっとも短い
⚫︎直帰率・離脱率はもっとも高い
⚫︎他ページへの遷移はもっとも悪い

このように、今回の実験では3カラムのレイアウトが独り負けするという結果となりました。

右サイドバーと左サイドバーの差異は僅差ではあるものの、右だと滞在時間が長くなり、他ページへの遷移がやや減る。

左だと滞在時間は短くなるが、他ページへ遷移しやすくなると言えるでしょう。

ではなぜ、このような結果になったのでしょうか？

 

ユーザーの視点移動｜Fの法則とZの法則

人間はインターネットでなんらかのWebページを見るとき、ある特徴的な視点の動き方をします。

その視点の動きをなぞるとアルファベット「Ｆ」と「Ｚ」に似ていることから、それぞれ「Ｆの法則」「Ｚの法則」と呼ばれています。

Webマーケティングを少しでもかじったことがある人であれば、常識とも言える有名な法則ですよね。

つまり人間はWebページを見るときに、
⚫︎左側に意識が集中する
⚫︎左から右、上から下へと視線が動く
…ということです。

ページの左側や上部はよく読まれるが、ページの右側や下部はあまり読まれないと言い換えることもできます。

なので、サイトやブログにとって大切な要素や見せたいコンテンツは、なるべくページの左側や上部に配置した方が良いということですね。

ではこれらを踏まえて、右サイドバー・左サイドバー・3カラム それぞれの目的やメリット＆デメリットをまとめてみましょう。

 

右サイドバー（2カラム）の特徴・利点

読まれやすいページ左側に記事が配置される形になります。つまり記事を読んでもらうことを優先させたい場合は右サイドバーにするのが良いでしょう。

左側にユーザーの視線や意識を邪魔するものがないので、ユーザーは記事を読むことに集中でき、読後の満足感も高まる配置です。

あまり目に触れることがない右側に他ページへのリンク（人気記事・新着記事・カテゴリーメニューなど）が配置されることになるため、他ページへの遷移がやや弱くなりますが…

記事が最後までしっかり読まれれば、記事下のリンク（タグ付けされた関連記事など）からのページ遷移に期待することができます。

また、世の中のブログのほとんどは右サイドバーを採用していますので、読者に“安心感”をあたえるという心理効果もありますね。

ごく一般的なありふれたレイアウトではありますが、ブログにとってもっとも大切な“記事コンテンツ”を最優先させたおすすめレイアウトです。

迷ったら右サイドバーで良いのではないでしょうか？

 

左サイドバー（2カラム）の特徴・利点

視点や意識が集まる左側に、メニューや他ページへのリンクが配置されるレイアウトです。

人気記事や新着記事などのリンクをクリックさせて、1ユーザーあたりの閲覧ページ数を増やす＝ユーザーの回遊を促進したり、

バナーなどの広告をクリックさせて収益を上げたい場合などには、左サイドバーが有利と言えます（あくまで理論上はですが…）。

個人的には「ブログは記事がメインでしょ！」と思っているので若干“邪道”のような気もしますが…

例えばメニューリンクを中心に各コンテンツへの誘導をおこなうノウハウ系サイトや専門情報サイトに関しては、メニューが左側にあった方がユーザーにとって分かりやすく親切なのかも知れませんね。

今回のテスト結果を見ても、他ページへの遷移を促すには左サイドバーが有利だということが証明されています。

ただし、読まれにくいページ右側に記事コンテンツがくることになるため、離脱や直帰が増える要因にもなってしまいます。

 

両側サイドバー（3カラム）の特徴・利点

3カラムは、各種リンク・特集ページ・キャンペーン・広告などの“見せたい情報がたくさんあるメディア”に有利なレイアウトです。

逆に言えば、通常のブログなどのようにシンプルなコンテンツ構成で作られたメディアには、あまりメリットがないとも言えますね。

左右両側にサイドバーがあり、メインである記事コンテンツはそれに挟まれるように中央に配置されているため…

ユーザーが記事コンテンツに集中しにくい（あちこちに目が移って気が散ってしまう）というデメリットがあります。

また情報量が多いためページ全体がゴチャゴチャしてしまい、乱雑で窮屈なイメージをあたえてしまいます。

結果的にユーザーの離脱や直帰をまねいてしまうのですね。

3カラムの構成は、インターフェースをしっかりと作り込む必要のある上級者向けのレイアウトです。

素人にはなかなか上手くまとめることは難しい（Webデザインの知識や手間ひまが必要）ため、あまり個人ブロガーの方にはおすすめできませんね…。

＊          ＊         ＊

さて、いかがでしたか？

たかがサイドバーの配置ではありますが、なかなか奥が深いものだと分かっていただけたかと思います。

それぞれのメリットとデメリットを正しく理解し、あなたのブログ・サイトの問題や目的に合わせた選択をしたいですよね。