web-dev-qa-db-ja.com

モバイルWebサイトの平均ヘッダー高さとは何ですか?

モバイルWebサイトに推奨される/平均のヘッダーの高さ。 ChromeやSafariなどのブラウザの上部にはアドレスバーがあり、スペースをとるため、UXの観点からはヘッダーの大きさ(例bootstrapナビゲーションヘッダー)) ?

enter image description here

6
Eugene

正解はアプリによって異なります

しかし、ここでは、決定を下すのに役立つモバイルWebサイトに関するいくつかの重要な考慮事項を示します。

  • OSガイドライン。ヘッダーの高さに関するモバイルOSの公開ガイドライン。 IOSメニューとナビゲーションバーのレイアウトに関するガイドラインがあります(たとえば、 this を参照)。Googleはマテリアルデザインサイトのガイドラインも公開しています( こちら )。

  • 人間工学。ガイドラインに従うかどうかに関係なく、最小限のバーの高さは、タッチしやすいように設計する必要があります。 この記事 には、Apple、Microsoft、Nokiaなどの仕様に基づく、タッチフレンドリーな高さに関する優れたガイドラインがあります。それは少し古いですが、それは注意します:

    • AppleのiPhoneヒューマンインターフェイスガイドラインでは、最小サイズは44ピクセルを推奨しています。マイクロソフトでは34pxを推奨しており、Nokiaでは28px以上が推奨されています。

お役に立てば幸いです。

3
tohster