ARIA 접근성 가이드

역할 · 문서 구조

role="blockquote"

다른 출처에서 가져온 인용 단락을 나타냅니다.

중급HTML 요소 우선

한눈에 보기

분류
문서 구조
대응 HTML
<blockquote>
이름 정하는 방법
작성자 (author)
이름 필수
아니요
필수 상위 요소
없음
필수 하위 요소
없음

설명

blockquote는 다른 출처에서 인용한 콘텐츠 구획입니다. WAI-ARIA 1.2에서 HTML <blockquote>와 짝을 맞추기 위해 추가되었습니다. 대부분의 경우 <blockquote>를 그대로 쓰면 되고, role="blockquote"를 직접 쓸 일은 거의 없습니다.

짧은 문장 안 인용은 <q>를 씁니다. 들여쓰기 효과만 원할 때 <blockquote>를 쓰면 화면낭독기가 인용으로 잘못 알리므로 CSS로 처리합니다. 출처는 <cite>나 본문 텍스트로 함께 표시합니다(cite 속성 값은 보조기술에 거의 노출되지 않습니다).

함께 쓰는 속성

전역 속성(이름·설명 등)은 모든 역할에 쓸 수 있어 생략했습니다.

사용 예

인용과 출처

권장HTML
<figure>
  <blockquote>
    <p>웹의 힘은 보편성에 있습니다.</p>
  </blockquote>
  <figcaption>— 팀 버너스리</figcaption>
</figure>

들여쓰기 용도로 사용 (비권장)

비권장HTML
<blockquote>
  <p>신청 기간: 7월 1일 ~ 7월 15일</p>
</blockquote>

인용이 아닌 내용입니다. 여백은 CSS로 만듭니다.

화면낭독기에서는

화면낭독기 안내 예시 (표현은 화면낭독기·브라우저·버전에 따라 조금씩 다릅니다)
상황들리는 안내 (예)
인용 영역으로 이동인용, 웹의 힘은 보편성에 있습니다. 인용 끝

사용 지침

이렇게 쓰세요

  • 인용한 내용은 <blockquote>로 표시하고 출처를 함께 적습니다.

이렇게 쓰지 마세요

  • 시각적 들여쓰기를 위해 blockquote를 쓰지 않습니다.
figureparagraphnote

참고 자료