見出し画像

Q. 「ホーム」と「トップ」どっち使うべき?

ちょっとしたUI/UXデザイン関連の質問に答えていくシリーズ。
今回の質問はこちら。

Q. なんかのツイートで、アプリに「ホーム」タブを用意するのはよくないというのを見た気がするんですが、なぜですか?
あと「トップ」というタブもたまに見かけるんですが、ホームとトップどっちを使うべきなんでしょうか??

結論

  • ウェブでは思想によるけど「ホーム / Home」が無難

  • アプリでは「ホーム / Home」が一般的

  • 「ホーム / Home」タブはApple自身も推奨していないのでできるだけ使わないようにまず頑張る

  • ただしApple含め多くのアプリが採用しているのが実情なのでアプリの規模が大きくなってきたら検討もあり

解説

「ホームページ」と「トップページ」と「ウェブサイト」の違いはひとくちに説明することが難しい。

歴史的経緯もあって、国によってまたは人によって意味が違うし、移りゆく言葉と一緒で何が正解とかはない。

質問の通り、アプリにおける入口としてよく「ホーム」というタブがあるけれど、情報アーキテクチャの観点からはあってはならない存在とさえ言われることがある。

なぜそう言われるのか。だってみんな使ってるじゃん?

Web・アプリそれぞれの「ホーム」の使われ方と共に紐解いていこう。


Webにおけるホームとトップ

ホームページという言葉は本来、ブラウザを立ち上げたときに一番最初にでるページのことを指していた。

「ホームページ」は、もともとはウェブブラウザーを起動したときに最初に表示されるページのことでした。転じて、ウェブサイトのトップページのことを「ホームページ」と呼ぶようになったものです。

NHK放送文化研究所 「ホームページ」「ウェブサイト」


Yahoo! JAPANの左上に「ホームページに設定する」と書いてあるのはまさにこの意味でのホームページである。

画像
Yahoo! JAPAN

そこから「ホームページ」「ウェブサイト」「Webページ」「トップページ」などの混乱しやすい言葉が普及するにつれ意味が誤用と共に変化・拡大していった。

もともとの意味でのホームページは「起動ページ」と呼ばれたりしている。

起動ページは、デバイスで最初に Chrome を起動したときに表示されるページです。

ホームページと起動ページを設定する | Google Chrome ヘルプ


いま現在、日本において「ホームページ」といえば誰かが所有・運営しているウェブサイト全体を思い浮かべるだろう。(例:「xx社のホームページ」「yyさんのホームページ」)

そして「トップページ」といえばウェブサイトの最上層ページ(入口)を指すことが最近まで多かった。(例:「xx社のホームページのTopにこういう情報がある」)

画像
日本において最近まで一般的だった言葉の使い分け


長らく日本のWebサイトアクセス数No.1を誇っていた「Yahoo! JAPAN」がまさにポータルサイトとしての最上位のページを「トップページ」と言っていることの影響も大きかっただろう。

しかし英語圏では事情が違う。

「Home」はウェブサイトの最上層ページを指し、「Top」はページの一番上を指すことが多い。

画像
英語圏における一般的な言葉の使い分け


「Back To Top」というページの一番上に戻るボタン(いまどきあんまりないが)が示すように、英語圏において「Top」はあくまでページの中身の位置を指す。

ここまでの話を整理すると、

日本
ホーム:ウェブサイト全体
トップ:ウェブサイト入口

英語圏
Home:ウェブサイト入口
Top:ページの一番上

という整理であるが、少しまわりのウェブサイトを見渡してみると、実は最近では日本でもウェブサイト入口を「ホーム / Home」とする傾向にあるようだ。

入口を「トップ / Top」にしているサイト

画像
古くからあるサイトに多い

入口を「ホーム / Home」をしているサイト

画像
近年のWebサイトは比較的「ホーム」が多い印象

スマートフォンの普及以降、アプリが先にリリースされてあとからWeb版を立ち上げるパターンも多く、そういった場合はアプリに合わせて「ホーム」にしているところがほとんどだ。

そうでなくとも動的なウェブアプリケーション(YouTube、Twitterなど)の入口は「ホーム」であることがかつてより一般的であった。

そういった理由もあり、いまから名付けられるのであればグローバルスタンダードに習って英語圏風使い分け(ウェブサイト入口を「ホーム / Home」)にするのが翻訳なども考えると混乱が少ないだろう。


アプリにおけるホームとトップ

一方、モバイルアプリ(以下アプリ)はどうか。

アプリの入口または中心となる画面の名称は、言わずもがな感覚としてわかると思うが「ホーム / Home」が一般的である。

画像

ただ、マイナーではあるが「トップ / Top」としているアプリもなくはない。

画像
とはいえ、ほぼなかった


グローバルスタンダードに対してあえて差異をつける必要性がないところだと思うので、アプリにおいては「ホーム」としておいた方が無難だろう。

なお、iOSもAndroidもスマートフォン自体のロック解除後の画面(アプリを選ぶ画面)は「ホーム画面 / Home screen」という名称である。


ホームタブは使っちゃだめ?

アプリ設計に携わっていると「ホームタブはAppleが使っちゃだめってガイドラインに書いてる」という言説を耳にしたことがある人もいるだろう。

実際はガイドラインに記載はないようだが、たしかにWWDC22のセッション「iOSナビゲーションデザインの探求」において、

(前略)ホームタブはアプリの階層を乱します。異なるタブや分野の機能が重複し、十分なコンテキストなく1画面に追加されると、冗長性と混乱を引き起こします。

ホームは見つけやすさの問題を解決しようとするタブであるため、すべての機能が場所を争うようになります。(中略)みなさんのアプリの場合、ホームタブを削除することを考えてください。

WWDC22のセッション「iOSナビゲーションデザインの探求」より一部意訳及び簡易化


かんたんにいうと、「なんでもかんでも入れられる画面っつーのは便利そうに見えるけどあとあとカオスになるからやめとけ」である。

─── ここから少し専門的な話 ───

原理的にいえばTab bars(AndroidでいうBottom navigation)というのはそのアプリにおけるトップレベルの階層であるべきで、ホームという概念のように横断的にコンテンツを入れてしまうとその階層の概念がとたんに崩れてしまうのだ。

情報アーキテクチャの観点からいっても、オブジェクト指向モデリングでアプリの情報構造を整理したとして、「ホーム」というオブジェクトがでてくることはほぼありえない。(後述のホームアプリのような場合を除く)

よって原理主義の人ほど、特に昔からiOS開発をしてきた人ほど、ホームタブという存在は魂が許せないのである。

─── ここまで少し専門的な話 ───


WWDC22におけるAppleの思想通り、ほとんどのApple純正アプリにおいてはできるだけホームを使わないようにしているようだ。

画像
「概要」など多少無理やりなラベルも見受けられるが…


Apple純正でない、各社の世界的に使われているアプリについても「ホーム」を使わないように努めるアプリはいくつか見受けられる。

画像
TikTokはホームアイコンだが「レコメンド」というラベルである


とはいえ先程みせた例のように、世の中ではホームタブを採用しているアプリがほとんどなのは皆さんも知っての通りだ。

なんなら近年では、Apple純正アプリの中でも「Music」アプリや「TV」アプリには「ホーム」タブが採用されてしまった。

画像


ガイドラインに明記されてないにしても、自分らで言っていたことを守れてないことになる。もちろんApple社内でも喧々諤々あったろう。

「簡易的なツール」ならともかく「複雑化・サービス化したプロダクト」に対して原理的な思想を押し付けることの難しさを感じる。

ちなみにApple純正の「ホーム」アプリにおいても「ホーム」タブが存在するが、これは今まで触れてきた概念としてのホームではなく、実際の「家」という意味でのホームというオブジェクトなので、その意味ではセーフだ。

画像
Appleの「ホーム」アプリ


Musicや他のアプリをみていても、サービスが成長するにつれてホームという便利な麻薬には抗えないのが実情である。

Twitter(X)もかつてホームではなく「タイムライン」だったし、LINEも昔は「友だち」「トーク」「タイムライン」というオブジェクト指向ライクな王道のタブ構造だった。

いつの間にかみんな大人になって「ホーム」に手を出してしまったのだ。

以上のことから現実をふまえた上での個人的なおすすめは以下である。

  1. 新規にアプリをつくる場合や、情報を整理してリニューアルしたい場合、まだそこまで複雑すぎないアプリの場合は、ホームタブなしでつくる。

  2. アプリが持つ情報が複雑になってきたり、ビジネス上の都合やプロダクトの観点でごちゃまぜコンテンツが最初に見られるべきと判断した場合などは、多くのグローバルスタンダードアプリと同様にホームタブを採用する(≒逃げる)。


まとめ

質問と結論の再掲。

Q. なんかのツイートで、アプリに「ホーム」タブを用意するのはよくないというのを見た気がするんですが、なぜですか?
あと「トップ」というタブもたまに見かけるんですが、ホームとトップどっちを使うべきなんでしょうか??

  • ウェブでは思想によるけど「ホーム / Home」が無難

  • アプリでは「ホーム / Home」が一般的

  • 「ホーム / Home」タブはApple自身も推奨していないのでできるだけ使わないようにまず頑張る

  • ただしApple含め多くのアプリが採用しているのが実情なのでアプリの規模が大きくなってきたら検討もあり

ぜひ解説も含めて参考にしてほしい。


UI/UXデザイン関連の質問があれば気まぐれで答えていくので、お気軽にこの記事へコメントかXでリプライどうぞ。

こういう相談に即日おこたえするデザイン顧問も枠少なめだけれど、下記サイトのお問い合わせフォームより受付中。


いいなと思ったら応援しよう!

ピックアップされています

#デザイン 記事まとめ

  • 7,263本

コメント

コメントするには、 ログイン または 会員登録 をお願いします。
Q. 「ホーム」と「トップ」どっち使うべき?|広野 萌
word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word word

mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1
mmMwWLliI0fiflO&1