サイドバーのメリット・デメリットとサイドバー不要論

web

サイドバーはブログ興隆期にウェブサイトに浸透した、画面横にあるナビゲーションです。 新着記事、カテゴリやタグ、人気記事などを設置することが多いでしょうか。

多くのサイトに当たり前のように付いていますが、近年「別にサイドバーなくても良いんじゃないか」というサイドバー不要論が囁かれるようになりました。 サイドバーの役割と要不要について考えてみたいと思います。

サイドバーとは

サイドバーとは、メインコンテンツの「横」にあるナビゲーションのことです。 これが上ならヘッダーメニュー、下ならフッターメニューと区別して呼ばれています。

サイドバーの設置場所はメインコンテンツの左・右・左右両方の3通りがあります。 人間工学的にはウェブサイトは左上から読まれるので、ナビゲーションを強調したい場合は左に、補助として使う場合は右に設置すると良いと言われています。

左右両方にサイドバーを設置する「両サイドバー」なサイトもありますが、散らかった印象を受けるので基本的に真似しない方が良いです。

サイドバー不要論

サイドバーは長らく多くのサイトに鎮座し続け、今なお採用しているサイトは多いです。 しかしインターネット黎明期と比較するとその役割は小さくなっていると言えます。

そうして唱えられるようになったのがサイドバー不要論です。 そう言われる理由をいくつか説明しましょう。

目が滑る上にナビゲーションとしても中途半端

サイドバーはメインコンテンツの横に付いているので、どちらも同時に読むことはありません。 しかしどちらを読むにしても、他方の存在が気になって目が滑ります。

それに記事を下まで読んだ後には、よほど短い記事でない限りはサイドバーは上方に置きざりになります。 読了後にサイドバーのリンクを辿ろうとしても上まで戻らなければなりません。

それならサイドバーの役割を持つ領域をフッターに付けた方が良い気がしますよね。

スマホユーザーの役に立たない

ブログ興隆期にはほとんどのユーザーが大画面PCモニタでサイトを閲覧していました。 しかし時代は変わり今やユーザーの半数以上がスマホやタブレットなどの小~中画面端末でサイトを閲覧しています。

サイドバーは解像度に余裕がある大画面でしか表示できません。 今日においてのサイドバーは多数のユーザーに認識すらされない機能なのです。

ちなみに小~中画面端末の端末からアクセスがあった場合、サイト側はサイドバーを下に送るか、表示しない設定をする場合が多いです。

SEO的に重要でなくなった

かつてサイドバーがSEOに大きな役割を果たす時代がありました。 サイドバーがあるだけで検索上位になれるのであれば、そりゃあどのサイトもサイドバーを付けざるを得ません。

しかし今はそんなことありません。 ナビゲーションの必要性は依然変わりませんが、それがサイドバーである必要はなくなったのです。

ヘッダーナビゲーションやフッターナビゲーションを置いた上でサイドバーが必要なのかは一考の余地があるでしょう。

サイドバーのメリット

サイドバーは「目が滑る」と言いましたが、これは何も悪いことばかりではありません。 フッターナビゲーションは下までスクロールしないと存在自体を認識できないのに対し、サイドバーはページを読み進めるうちに認識できます。

ウェブ統計によればサイドバーの使用者は1%前後と言われています。 利用率としては少なく見えますが、利用しているユーザーは確かにいます。

またクリックされなかったとしても、眺められてはいるかもしれません。 運営者や記事執筆者のプロフィールやサイトの方向性など、サイドバーを見るだけで得られる情報もあります。

それを「目が滑るから」という理由で取っ払うのが正しいのかは判断が分かれるところでしょう。 多少は邪魔に感じることはあっても、気になって仕方ないなんてほどではありませんしね。

まとめ

サイドバー不要論が唱えられてからも、それなりに時間が経過しました。 それでもサイドバーは未だに高い採用率を誇り、一旦はワンカラムレイアウトに変えたサイトも2カラムレイアウトに戻したりしています。

設置されている主な理由は、率直に言うと「無いよりはあった方が良い気がするから」が多くを占めると思います。 サイドバーを設置しても手間は増えないので、それで少しでも利便性が上がるならとりあえず置いとけって感じでしょうか。

どれだけサイドバーが活用されるかはサイトの性質や閲覧者の属性にもよります。 採用するか悩んでいる場合にはとりあえず置いてみて、統計や利用状況を見た上で判断すると良いかもしれませんね。

eyecatch

サイトのPV数を増やす3つの基本

eyecatch

当たり前に設置されるページャー、実は不要なケースも多い

ウェブサイトの記事

eyecatch

ウェブブラウザの基礎知識

eyecatch

レスポンシブウェブデザインとは

eyecatch

リダイレクト-URLを変更したらリダイレクトで転送しよう

eyecatch

マルチサイトのメリットとデメリット

eyecatch

robots.txtと書き方

eyecatch

ブログ初心者におくる「ライティング入門」

ウェブサイトの記事一覧HOME