개념

• 문서의 본문과 관련은 있지만, 제거하거나 위치를 옮겨도 본문 흐름이 깨지지 않는 독립적인 콘텐츠 묶음을 나타내는 시맨틱 블록 요소이다.
• 보통 이미지, 다이어그램, 코드, 인용, 표 등과 그 설명을 함께 감싼다.

<figcaption>

• 제목/설명/출처 등 메타 정보를 명시
• figure 안에서 첫 번째나 마지막 자식으로 두는 것이 일반적이다.

주의사항

• figcaption은 figure 안에서만 사용
• 여러 개 둘 수 있으나, 하나만 사용 권장
• 본문 핵심 서술에 필수적인 데이터는 figure로 분리하지 말고 문장 내에 유지
• 이미지의 대체 텍스트는 alt가 담당하고, figcaption은 그 묶음의 설명을 제공한다.

실무

• 이미지와 설명, 출처를 한 단위로 구성
• 근거 자료와 설명을 함께 제공

예시

figure class="media">
  <img src="/images/chart-sales-2024.png" alt="2024 분기별 매출 막대그래프: Q1~Q4 순으로 10%, 18%, 22%, 25% 증가">
  <figcaption>그림 1. 2024년 분기별 매출 추이 (자료: 내부 BI)</figcaption>
</figure>