web-dev-qa-db-ja.com

通知アイコン上の番号の位置

通知アイコンの番号は通常、ベルのアイコンの右側に表示されますが、その理由は何ですか。

数字がベルのアイコンの左側にある逆を見たことがありますか?

enter image description here

3
Rajat Agarwal

あなたの説明から、私はあなたがバッジコンポーネントを参照していると思います。バッジは、ユーザープロファイル、メールボックス、ベルのアイコンなど、多くの場所でステータスインジケーターとして使用されます。また、実行中の集計の数値カウンターや、ステータスを示す単なるドットの形をとることもあります。

配置については、左または右にバッジを配置することを明示的に規定するルールはありませんが、LTRを読むユーザー向けに設計している場合、デフォルトでは、残りの部分と一致するように右側に配置する必要がありますコンテンツの。また、(左から右に読む)ユーザーが最初にコンテキストのアイコンを確認し、次にバッジで追加情報を確認するのに役立ちます。

Material.angular.ioによると、バッジのデフォルトの位置は「上」(右上)で、必要に応じて変更できます。

Material-ui.comでは、バッジを四隅のいずれかに配置することもできます。

enter image description here

enter image description here

あなたはここでそれについてもっと読むことができます:

https://material.angular.io/components/badge/overview

https://material-ui.com/components/badges/

https://material.io/design/usability/bidirectionality.html#

3
Sooraj MV

以下は私の解釈です:

数値は通知アイコンの右側に配置され、ユーザーの読み方のパターンに対応します。例では、左から右(LTR)です。右から左に読むユーザーにとっては、通知アイコンの左側になるのではないでしょうか。

左側にアイコン、右側にカウントがある通知は、ユーザーに次のことを伝えます。

イベントタイプ(通知)+数(カウント)。

1
Chandan

どこでも従う一般的なパターンは、右上隅にカウントを配置しています。カウントが左上ではなく右上に配置されている場合、最初に確認するのはアイコンが次にカウントするものであるため、解釈は簡単です。

1
NB4