WAI-ARIA

근듀·2023년 5월 31일
0

궁금해요

목록 보기
9/15
post-thumbnail

WAI-ARIA
Web Accessibility Initiative - Accessible Rich Internet Applications
웹 콘텐츠의 접근성을 개선하기 위한 기술적인 표준

1. 등장 배경

  • 웹은 초기에 문서와 문서를 연결하기 위한 목적으로 설계되었다, 웹의 가장 중요한 개념은 문서 간의 연결이었고 이를 '하이퍼텍스트(Hyper Text)'라는 개념으로 불렀다.

  • 웹이 매우 빠른 속도로 성장하면서 더이상 문서의 개념이 아닌 '사용자 경험(UX, User eXperience)'을 요구하기에 이르렀고 이런 요구를 충족시키기 위해 등장한 것이 '리치 인터넷 애플리케이션(RIA, Rich Internet Applications)' 이다.

  • RIA는 기존의 정적인 HTML과 단순한 자바스크립트 사용 환경에서 벗어나 한층 강력해진 자바스크립트와 Ajax(Asyncronous Javascript and XML) 등의 기술을 활용하여 웹 어플리케이션을 제작하고 좀 더 향상된 UX를 제공할 수 있다.

  • RIA는 모든 사용자가 동등하게 접근하고 사용할 수 없는 문제가 있었는데 바로 스크린리더 등 보조기술을 사용하는 장애인이 RIA 기술로 제작된 웹 애플리케이션을 제대로 사용할 수 없었기 때문이다.

  • RIA 기술이 접근이 접근성에 취약하다는 비판을 받아왔고 이러한 문제를 해결하기 위해 등장한 것이 WAI-ARIA이다.

2. 역할

  • WAI-ARIA는 스크린리더 및 보조기기 등에서 접근성 및 상호 운용성을 향상시키기 위해 마크업에 역할, 속성, 상태 정보를 추가할 수 있도록 지원한다.

  • 이렇게 추가된 정보는 웹 브라우저에 의해 자동으로 해석되고 각각 운영체제(OS)의 접근성 API로 변환되도록 설계되었다.

  • 스크린리더 및 보조기기는 운영체제(OS)에서 제공하는 접근성 API를 통해 데스크탑 애플리케이션과 동일한 방법으로 자바스크립트 컨트롤을 인식하고 상호 작용을 하게 된다.

  • 최신 버전의 웹 브라우저는 WAI-ARIA의 다양한 기능을 잘 지원한다. 하지만 웹 브라우저와 스크린리더의 조합에 따라 WAI-ARIA 지원이 균일하지 못한 상황이다.

  • WAI-ARIA는 개발자의 의도가 보조 기술에 잘 전달될 수 있도록 요소나 컴포넌트에 누락된 의미 구조를 제공하는 것을 목적으로 한다.

  • 이것을 통해 논리적 구조 설계가 가능해지고 페이지 영역의 빠른 탐색을 제공할 수 있게 된다. 또한 접근성 API를 활용하여 적절한 이벤트 알림 등을 제공하여 보조기기의 사용성을 향상 시킬 수 있다.

3. 기능

  • 역할(Role)
    UI에 포함된 특정 컴포넌트의 역할을 정의

  • 속성(Property)
    컴포넌트의 특징이나 상황을 정의하며 속성명으로 "aria-"라는 접두사 사용

  • 상태(State)
    컴포넌트의 상태 정보를 정의


참고자료

profile
프론트엔드 개발자 취준생입니다.

0개의 댓글