【HTML Living Standard】figcaption要素の使い方
figcaption要素の使い方について、初心者にもわかりやすく解説します。
作成日: 更新日:
基本的な使い方
figcaptionオブジェクトは、HTMLの<figure>要素に内包される図、写真、コードブロック、表などのコンテンツに対して、キャプションやタイトルを提供するオブジェクトです。この要素は、<figure>要素の内部に配置され、そのコンテンツの内容を簡潔に説明したり、文脈を補足したりする目的で使用されます。例えば、科学論文の図のタイトル、写真の撮影場所や日付、コードスニペットの機能説明、データテーブルの要約などを記述する際に非常に役立ちます。
figcaption要素の最大の利点は、コンテンツとキャプションがセマンティックに（意味的に）関連付けられる点にあります。これにより、Webページの構造がより明確になり、人間だけでなく、スクリーンリーダーなどの補助技術や検索エンジンもコンテンツの意味を正確に理解できるようになります。結果として、Webサイトのアクセシビリティが向上し、SEO（検索エンジン最適化）にも良い影響を与えます。単なるdivやpタグでキャプションを記述するよりも、意味的な情報が付与されるため推奨されます。
この要素は、親となる<figure>要素の最初の子要素、または最後の子要素としてのみ配置することができます。これにより、キャプションが必ず対象のコンテンツの直前または直後に位置することが保証され、視覚的・構造的な一貫性が保たれます。figcaption要素は、HTMLドキュメントの構造に意味的な層を追加し、コンテンツの理解を深めるために不可欠な役割を担います。
公式リファレンス: <figcaption>: The Figure Caption element
構文(syntax)
1<figcaption>図や画像のキャプション、あるいは凡例やタイトル</figcaption>
引数(parameters)
引数なし
引数はありません
戻り値(return)
戻り値なし
戻り値はありません