#001 UX Quiz - どちらがより正しい？

こんにちは！ドイツ在住のUIデザイナーのヒトミです。今回は、私が最近ハマっているUXクイズについてです。クイズ形式で勉強できるのは有効的だなーと感じたので、早速私が知っている知識からクイズを出題します。

#1 Quiz - Breadcrumbs パンくずリスト

どちらがより正しいでしょうか？

UX Quiz - 答え

さて、パンくずリストとはなんでしょうか。

Breadcrumbs are an important navigational element that supports wayfinding — making users aware of their current location within the hierarchical structure of a website. Breadcrumbs are a list of links representing the current page and its “ancestors” (parent page, grandparent page, and so on), typically going all the way back to the site homepage. NN/g has been recommending breadcrumbs since 1995, as they provide many benefits to users at almost no cost to the UI.

Breadcrumbs are represented as a trail of links at the top of the page, usually just below the global navigation; the home page (or root node of the hierarchy) is the first link and the links are usually separated by the symbols “>” or “/”. We recommend the “>” character, though there is no functional difference, and either is acceptable.

引用元: Breadcrumbs: 11 Design Guidelines for Desktop and Mobile

日本語訳

ブレッドクラムは、経路探索をサポートする重要なナビゲーション要素です。ユーザーは、Webサイトの階層構造内の現在の場所を認識できます。ブレッドクラムは、現在のページとその「祖先」（親ページ、祖父母ページなど）を表すリンクのリストであり、通常はサイトのホームページに戻ります。 NN / gは、UIにほとんどコストをかけずにユーザーに多くの利点を提供するため、1995年からブレッドクラムを推奨しています。

ブレッドクラムは、ページの上部、通常はグローバルナビゲーションのすぐ下にあるリンクの軌跡として表されます。ホームページ（または階層のルートノード）が最初のリンクであり、リンクは通常、記号「>」または「/」で区切られます。機能的な違いはなく、どちらでもかまいませんが、「>」文字をお勧めします。

なぜ、記号「>」で表示されるべきなのでしょうか？
情報を図にして整理してみましょう。ほとんどの情報は親子か、同レベルなのかで整理できます。

Homeは一番親の情報です。
ドリンク、フード、デザートは同列の情報です。
ドリンクの中には、ビール、ワイン、カクテルがあり、それぞれはドリンクの子オブジェクトです。

親オブジェクトは子オブジェクトより大きいです。

なので、記号「＞」がカテゴリーの間に使用されるのです。

今までふわっとしか頭の中になかった方は、これを機会に意識してこれらの記号を使用してみてください。そして、なぜそうあるべきなのか、いつでも誰にでも説明できるようにしてみてください。

Follow me!

Twitter | Instagram | Facebook | Behance | dribbble