data-* 속성과 aria-* 속성의 차이점은 무엇인가요??

Question

data- 속성과 aria- 속성의 차이점은 무엇인가요??

기본적 사용법은 비슷한듯하고... 더 많이 쓰이는건 data-* 속성으로 보입니다.

두 속성의 차이점은 무엇이고 어떠한 경우에 어떤것을 쓰는게 알맞는것인지 궁금합니다.

Answer 1

안녕하세요.

data- 속성과 aria- 속성은 html spec에 추가된 목적이 다릅니다.

data- 속성 : html 태그 속성 이외의 추가적인 데이터를 저장하기 위한 태그입니다. 예를 들어 목록을 출력 시 row의 ID를 가지고 있어야 할 때 ID를 data- 속성에 지정할 수 있습니다.

aria- 속성 : 웹 접근성을 위한 속성입니다. 보통 role 속성과 같이 사용되는데 role은 태그가 하는 역할을 정의하고 aria 속성으로 property와 state(상태)를 정의합니다.