見出し画像

DailyUI #056 パンくずリスト



1.DailyUI#056のお題

56日目のお題は「パンくずリスト」。
パンくずリストとは、Webサイトのページ階層をリスト化して表示したもので、Webページを訪れたユーザーが、現在サイト内のどこ(どのページ)を閲覧しているかを示すナビゲーションの役割を担う機能があります。
架空の通販サイトのパンくずリストを制作しました。

2.ざっくりワイヤー


ざっくりワイヤー

3.制作したデザイン


制作したデザイン


4.デザインする上で考えたこと

ユーザ自身の現在位置と辿ってきたルートがわかりやすいよう、現在地の文字色のみ色を変えました。
テキスト部分を押すとそのページに遷移する想定なので押しやすいように要素間の間隔を広めにとりました。

5.反省点

かなりシンプルな仕上がりになったので、もう一工夫入れられたら良かったと思いました。

6.おわりに

パンくずリストはユーザーが今現在サイト内のどのページを閲覧しているのかを把握することに役立つと学べました。
また、パンくずリストが検索結果に表示されているとページ内容を把握しやすくなり、クリック率が上がる可能性も期待できるなど、パンくずリストがもたらすメリットも知ることができました。


この記事が気に入ったらサポートをしてみませんか?