サイトの場合、垂直方向のナビゲーションとして「パンくずリスト」が有効です。募集要項」のように表現するのが一般的で、閲覧中のページが階層構造上のどの位置なのかを確認したり、上位のページを辿っていくことができるようになります。今のところ「パンくずリスト」のマークアップ方法に正解といえる決定的なものはありません。「パンくずリスト」というくらいなのでリストだという解釈はできます。いくつか妥当と思われる例を挙げてみます。</li></ul>順不同(unordered)リストを入れ子で指定して階層構造をマークアップする例です。個人的な印象としては、コードが冗長になりがちなのが欠点でしょうか。<dd>募集要項</dd></dl>親カテゴリの下に、いくつかの子カテゴリがぶら下がる、という解釈です。子カテゴリの階層を表現できていないのが致命的な欠点のような気もします。<li>募集要項</li></ol>単純に番号順(ordered)のリストでマークアップした例。個人的にはシンプルで一番好きです。同じようにすることができます。「いやいや、パンくずのマークアップはそうじゃなくてこうだろう!」みたいなご意見がありましたら是非。この記事を共有するシェアTweetこの記事を読んだ人にオススメSVG画像のHTMLでの使い方HTML&CSSkoya2021.03.01cssでPhotoshopのように画像にエフェクトを追加する方法HTML&CSSkoya2020.04.09間違いやすいHTML5の要素を再確認HTML&CSSkoya2020.02.20Sassでテーマ用CSSを作成するHTML&CSSfujihara2019.10.31バシャログ。Web制作スタッフによるブログです。「現場で使えるテクニック」をモットーに、Web制作全般についてお届けします。