たきです。
今日は興味ない人にとっては全く面白くない内容なので、興味のない人はスルーしてください。
僕のブログで数か月前から「固定フッターナビ」(以下ボトムナビ)を設置しているんですけど、なんで僕がそんなにボトムナビにこだわるのか、その理由を説明したいと思います。
ハンバーガーメニューが嫌いだから
ハンバーガーメニューっていうのは、よく見る三本線のヤツです。三本線のところを押すと、何らかの形でメニューが出てくるやつ。
個人的にあれ好きじゃないんですよね。いや、見た目もシンプルだし、どのサイトにも合うだろうし、嫌いじゃないんですよ。ただユーザー目線で見ると、あまり好きじゃないってだけです。
なんで嫌いなのかって言うと、メニューの中身が三本線を押すまで分からないから。三本線だけで「あ、このメニューの中にプロフィールページが入ってるな」って分からないじゃん?
それにいざナビ押したら、大体は横や上下からナビがスクロールして出てくるか、更に悪質なのが、僕の「たきつぼ」ってサイトにもある、全画面で出てくるやつ。全画面で出てくる奴は背景が透過してないとメインコンテンツが隠されるから本当悪質。
それにハンバーガーメニューだと、メニューを開くために1回、メニューの中に目的のものがなかったらメニューを閉じるために、目的のものがあったとしてもページの移動に1回押さなきゃいけない。
でもボトムナビだったら1回押すだけで移動できるし、ナビの中身も見えてるから「ナビを開いてから目的のものがない」なんてこともなく、ストレスが軽減できる。まぁそんな小さいことでイライラしてる僕が短気なだけなんだろうけど。
何度も言うけど、見た目的にはハンバーガーメニューの方がシンプルだし、今のサイトの主流だし嫌いじゃないけど、実用的なのはボトムナビの方なのでは...?と思ってしまう。
ブログにはハンバーガメニューはいらんでしょ
そもそもブログにはハンバーガーメニューはいらんでしょっていう。
ハンバーガーメニューを設置する理由って、アイコンのシンプルさとかスマートさってのもあるけど、従来の横型のナビとかボトムナビとかと比べて、たくさん情報を詰め込むことができるからだと思う。
今スマホが普及して、サイトを見るのもスマホが多いですよね。このブログも去年8月に開設してから今日(5/5)まで、8割以上がスマホからのアクセスでした。ちなみにOSで見ると60&がiOSで、Androidは25%。Androidユーザーの僕からすると、遺憾です(殴)
スマホって年々大型化していますけど、PCの画面の大きさには到底及びません。その小さい画面でタップで全画面で出て来たり、横からスクロールするようにすれば、たくさんの情報量を詰め込むことができるんですよね。
でも、そもそもブログってそこまで詰め込む内容ってあるのかなって思う。せいぜいブログのトップページに戻るものと記事一覧・ここみたいな雑記系ブログだったら、読者さんが求める情報にたどり着きやすいようにカテゴリを設置くらいで十分。
それわざわざハンバーガーメニューにしてタップ回数増やす必要ある?って思う。たまにあるんだけど、三本線を押しても2,3個しか項目がないやつ、めちゃくちゃイライラするんだよね。後でも詳しく書くけど、ボトムナビだったら最大5個までは設置していいから、ハンバーガーメニューにする意味が全く分からない。手間が増えるだけ。
「マテリアルデザイン」でも採用されている
Googleが提唱している、「マテリアルデザイン」という枠組み...って言えばいいのか分かんないけど、そういうデザインがあるんです。
僕はAndroidユーザーなので、iOSのアプリがどうなっているのか分かりませんけど、Androidのアプリの方ではGoogleが提供するアプリの大半でボトムナビが採用されています。YouTubeやYT Music、Googleフォト、Googleドライブ等々...。
それにGoogleアプリだけでなく、TwitterアプリやInstagramアプリ、Ameba、、note、LINEなどでもボトムナビは採用されていますね。
マテリアルデザインはGoogleがガイドライン(ルールのようなもの)を作っていて、それに準拠してないとマテリアルデザインとは呼べないので、さっき挙げたアプリがすべてマテリアルデザインかどうかは僕にはわかりません。(Twitterとかnoteはボタンとかマテリアルっぽいけど)
僕は勿論Googleの作ったガイドラインなんて読んでないし、読みたくもないですし、マテリアルデザイン自体が個性を潰すようなものなので、使いやすいけど僕はあまり好きじゃない。
でもTwitterやInstagram、Ameba、note、LINEなどで採用されているってことはそれほどユーザーにとっては使いやすいものなんだろうし、ユーザーも使い慣れているだろうから、いいよねって。
ちなみに、マテリアルデザインではボトムナビに居れる項目は5つまでっていう制約があるよ。1つだけだと寂しいし、最低でも3個くらいは入れておいた方が見栄え的にはいいかも。
ハンバーガーメニューの押しづらさ
ハンバーガーメニューの三本線って大体は右上、右下、左下、左上の四隅にあることが多いですよね。
左上・左下にあったら右利きの人は押しづらいし、右上・右下にあったら左利きの人は押しづらい。そもそも上にあったら親指伸ばさないと届かない人も居るだろうし。(僕も届かない)
ボトムナビも確かに右利きの人はナビの左側は押しづらいし、左利きの人はナビの右側は押しにくいけど、下側にあるからよほど手が小さい人じゃない限り、手は届くし、右利きも左利きも両方押しづらい場所はあるってことで平等だし、うん。(強引)
どっちも一長一短
結局どっちも一長一短ですよね。
ハンバーガーメニューは見た目がシンプルで場所を取らない、たくさん情報を詰め込めるというメリットもあるし、ナビを押すまでナビの中身が見えない、タップ(クリック)の回数が増える、メインコンテンツが隠れるというデメリットもある。
ボトムナビは多くのアプリやSNSで採用されているため読者さんが操作に慣れてる、1回タップするだけで移動できる、ナビの中身が見れるというメリットもあれば、メインコンテンツの領域が小さくなる、詰め込める情報量はハンバーガーメニューに劣るというデメリットもある。
ただ、僕はハンバーガーメニューが個人的に嫌いなのと、ここぐらいの規模だったらボトムナビで十分だっていうことでボトムナビをつけてます。
多分これからサイトを作る時もボトムナビ付けるかな、っていう...。
面白かった?((