역할 · 문서 구조
role="time"
특정 시점(날짜·시각)을 나타냅니다. HTML <time>에 대응합니다.
중급HTML 요소 우선
한눈에 보기
- 분류
- 문서 구조
- 대응 HTML
<time>- 이름 정하는 방법
- 작성자 (author)
- 이름 필수
- 아니요
- 필수 상위 요소
- 없음
- 필수 하위 요소
- 없음
설명
time은 특정 시점을 나타내는 요소로, WAI-ARIA 1.2에서 HTML <time>과 짝을 맞추기 위해 추가되었습니다. 경과 시간을 실시간으로 보여 주는 카운터는 timer입니다.
HTML datetime 속성(기계가 읽는 값)에 해당하는 ARIA 속성은 1.2에 없습니다. 그래서 role="time"을 쓸 때는 텍스트 내용 자체를 유효한 날짜·시간 문자열(예: 2026-10-22, 14:30)로 제한하라고 명세가 권장합니다. 사람이 읽기 좋은 표기와 기계용 값을 함께 쓰려면 HTML <time datetime="…">가 적합합니다.
화면낭독기는 대부분 time을 따로 안내하지 않고 텍스트를 읽습니다. 그러므로 보이는 텍스트를 사람이 이해하기 쉬운 형식(“2026년 10월 22일”)으로 씁니다.
함께 쓰는 속성
전역 속성(이름·설명 등)은 모든 역할에 쓸 수 있어 생략했습니다.
사용 예
HTML time (권장)
<p>반납일: <time datetime="2026-11-05">2026년 11월 5일</time></p>역할로 지정
<span role="time">2026-11-05</span>화면낭독기에서는
| 상황 | 들리는 안내 (예) |
|---|---|
| 문장 읽기 | 반납일: 2026년 11월 5일 |
사용 지침
이렇게 쓰세요
- 날짜·시각은
<time datetime>으로 표시하고 텍스트는 읽기 쉽게 씁니다.
이렇게 쓰지 마세요
- 흘러가는 시간을 표시하는 카운터에 time을 쓰지 않습니다(timer 사용).