ヘッダーとフッター、固定するならどっち？｜メリットとデメリットを解説

「ヘッダーとフッター、固定するならどっちがいいのか？」と、サイトを運営する方は疑問に思ったことはありませんか？

PCの場合は固定フッターを設置することはないでしょうが、スマホユーザー向けにヘッダーやフッターを固定して表示しているサイトはよく見かけます。ブランドを大事にする、機能性を重視するなど様々な考え方がありますが、実際のところ最適解が分からない方は多いはずです。

そこで今回は以下の項目に搾って、固定ヘッダーと固定フッターについて調査してきたので解説していきたいと思います。

表示位置の違い

固定ヘッダーは画面最上部に表示され、固定フッターは画面最下部に表示されます。その表示される位置の違いから、どちらがモバイルユーザーにとって有益なのかを考えます。

片手での操作感

注意すべきは昨今のスマホの大画面化です。
iPhoneSEを除けば、今のスマホ市場は5インチ・6インチ代のスマホばかりです。

一部の手の大きい人を除けば、画面上部は両手持ちじゃないと届かない領域になりつつあります。

つまり、画面最上部にある固定ヘッダーは、最近のスマホではタップしにくいということです。対して、画面最下部にある固定フッターは、比較的タップしやすいという違いがあります。

フッターは邪魔になりにくい

ヘッダーもフッターも画面の一部を常に占有するという点では同じですが、人間の視野を考慮すると話は変わってきます。

固定ヘッダーは常に視界の上部に入りこみますが、固定フッターは記事を読む際はスクロールする親指で隠れます。

そう、固定フッターには「不要な時は隠れる」という利便性があるのです。さらに、ソシャゲなどのアプリには固定フッターが付いているため、慣れているというユーザーも多いでしょう。

設置できるボタンの違い

固定ヘッダーと固定フッターでは、設置できるコンテンツに差が生まれます。
その点で、どちらが利便性で勝るのかを考えてみましょう。

固定ヘッダーのコンテンツ

固定ヘッダーはタイトルが必須であるため、自由に設置できるコンテンツ量が少なくなりがちです。よく設置されているのは以下のようなコンテンツです。

ページの見やすさを考慮した大きさであれば、タイトルとハンバーガーメニュー(三本線のやつ)と検索ボタン程度しか設置できません。

常にサイト名が表示される利点

設置するコンテンツ量は少ないですが、サイトのタイトルが常に視界に入るというのは十分なメリットになります。

タイトルを通して興味を持ってもらえば回遊率は上がりますし、サイト名が印象に残れば、後で指名検索してくれることもあるでしょう。

この「強制的にサイト名を見せる」というのがヘッダーを固定することの一番のメリットです。反対に、ヘッダーは固定してなければ、読み始めた際にチラッと見えるだけなので、なかなかサイト名を覚えてもらうことはできないでしょう。

固定フッターのコンテンツ

固定フッターはヘッダーと違って、自由なスペースが多い分、設置できるコンテンツも多くあります。設置しているものはサイトによりけりですが、定番どころは以下のようなコンテンツです。

ヘッダーとフッターを固定するメリット・デメリット

それでは、ここまでの情報を一旦整理します。

パーツ	スマホでの操作感	視界	メリット
固定ヘッダー	片手ではタップしにくい	視界が狭まる	サイト名が印象に残る
固定フッター	片手でもタップしやすい	手で隠れるため気にならない	設置できるコンテンツが多い

どちらも一長一短ではありますが、機能性を取るならフッターを固定、指名検索を狙うならヘッダーの固定、といった感じで使い分ける方が良さそうです。

固定ヘッダー(フッター)に求められる機能とは

ヘッダーとフッターの両方の特徴を確認したところで、固定する前にユーザーが求めている機能が何かを探っていきましょう。

必要な機能

最も重視すべきなのは「サイトにどんなコンテンツがあるか把握できる」ということです。これは情報を求めるユーザーにとっても、PVを稼ぎたいサイト側にとっても重要な要素。

そして、それを実現するのがメニューボタン(ハンバーガーメニュー)です。

「色んなページを読んでほしい」と私たちは考えていますが、配置できるボタンの数には限りがあります。しかし、メニューの中であれば、好きなだけコンテンツを盛り込むことができます。

そのため、ワンクリックでいつでも他のページへと移動できるメニューボタンは必須と言っても過言ではありません。

不要な機能

最も不要なコンテンツは「ページトップへ戻るボタン」です。そもそもトップに戻ることが少ないのと、最近のスマホは画面上端をタップすることで一瞬でトップへ戻れるからです。

私の使用している「The Thor」のように、固定フッターの有無にかかわらず表示するテーマも多くありますが、その場合はCSSで排除した方がいいかもしれません。

「ホームへ戻るボタン」もメニューの中に設置できるため必須とは言えません。ヘッダーの場合はサイトロゴがその役割を担うためなおさらです。

また、「シェアボタン」も特段必要性は感じません。記事を読まずにシェアする人は居ないので、記事下に設置していれば十分です。

アクセス数上位30のブログでの採用率

ここからは客観的な情報を参考にしてみたいと思います。上位ランカーであれば細かい所まで考えて作られているはずなので、ここは先人の知恵をお借りしましょう。

ということで、アクセス数上位30サイトを見て回った結果がこちらです。(数が多いため具体的なサイト名は省略します)
^{※サイト選別はブログ部さんのランキングを参考にさせていただきました}

	固定フッター	固定ヘッダー	何もなし
採用サイト数	7	7	16
合計採用率	23%	23%	53%

結果としては、一番多いのが両方使っていないブログ、次いで固定フッター・ヘッダーが同着2位となりました。

ブログジャンルで異なる結果

上位30ものブログを見て回り、なんとなく以下のような傾向があることが分かりました。

雑記ブログは固定ヘッダーでタイトルを強調している傾向にありました。これはファンを付けて何度も訪れてもらう人気商売的な側面があるからでしょう。

反対に、特化ブログの場合は色々設置できる固定フッターを使用、もしくはユーザビリティを考えて何も設置しないという選択をしているようです。

画面上部にアドセンス広告を貼っているブログも5サイトあったため、広告のためにヘッダーは使用していないということも考えられますね。

そもそも固定ヘッダー・フッターは必要か？

統計上は固定ヘッダーもフッターも使わないブログが一番多いという結果になりました。実際、コンテンツの見やすさを考えて設置しないという選択肢はアリだと思います。

しかし、先ほども記述したとおり、現在のスマートフォンは5インチ6インチが当たり前の時代。サイズに気をつけて設置すれば邪魔にはならないかとは思います。

とはいえ、必要がないのに設置するのは無駄、むしろマイナスです。本当に必要かどうかをしっかり考えて設置するようにしましょう。

【まとめ】固定するなら目的を明確に

それではまとめです。

最後に、大事なことは「何のために固定ヘッダー・固定フッターを設置するか」を考えることです。「回遊率が上がれば良いな」と気楽に考え、デフォルトのまま設置してもユーザーにとっては邪魔にしかなりません。

ユーザーの利便性とサイト側の利益、その両方を得られる設置の仕方を心がけましょう。