<figure> and <figcaption>

概要

<figure> 要素は自己完結型のコンテンツを表し、<figcaption> 要素でオプションのキャプションを付与できます。

対応ブラウザ

基本構文

<figure>
  <img src="chart.png" alt="2024年の売上推移グラフ">
  <figcaption>図1: 2024年の月別売上推移</figcaption>
</figure>

実務での使いどころ

• <figure> and <figcaption> の活用

  自己完結型のコンテンツ（図表、画像など）を表す要素。<figcaption> でキャプション付与。

注意点

アクセシビリティ

• スクリーンリーダーでの読み上げを確認すること。

参考リンク

• MDN Web Docs — <figure> and <figcaption>