안녕하세요, 엔비전스입니다.

버튼을 눌렀을 때 누른 버튼과 관련된 하위 요소들을 나타나게 하거나 숨기도록 구현하는 경우가 많습니다. 이때 각 플랫폼별로 접근성 적용은 선택이 아닌 필수입니다. 접근성 적용하지 않으면 버튼의 구체적인 목적을 알 수 없을 뿐만 아니라 현 상태가 하위 요소들이 숨겨진 상태인지 표시되고 있는 상태인지조차 알 수 없기 때문입니다. 접근성을 잘 아는 분이라면 웹에서는 aria-expanded true/false 속성을 사용하거나 detail과 summary 태그를 이용하여 확장/축소 상태를 알릴 수 있다는 것을 잘 알고 계시리라 생각합니다. 그렇다면 안드로이드 네이티브에서는 어떻게 접근성을 적용할 수 있을까요? 본 문서에서는 그 방법에 대해 함께 살펴보도록 하겠습니다.

접근성 적용 시 지양해야 하는 사항들

1. 대체 텍스트 상태정보 알리기: ‘세부 정보 펼치기’, ‘세부 정보 접기’와 같이 대체 텍스트를 사용하여 확장, 축소 정보를 주는 것이 접근성 구현의 가장 간단한 방법입니다. 그러나 대체 텍스트를 사용하여 확장, 축소 정보를 주는 것은 접근성 구현을 하지 않는 것보다는 당연히 훨씬 도움이 되지만 다음과 같은 부분에서 사용성을 만족시키기 어렵습니다.
   1. 이중탭했을 때 변경된 내용을 읽지 못할 수 있습니다: Button, ImageButton 요소로 확장, 축소 버튼이 구현된 경우에는 별 문제가 없지만 ImageView와 같이 누르는 동작과 직접적으로 상관없는 요소를 사용했다면 접근성 피드백에 대한 추가 구현을 하지 않으면 이중탭해도 변경된 텍스트를 읽지 못합니다. 따라서 사용자는 펼치기 혹은 접기 버튼을 이중탭해도 아무 피드백도 받지 못합니다. 변경이 제대로 되었는지 다시 한번 해당 요소를 터치하거나 역탐색을 하여 해당 정보를 다시 확인해야 하지요.
   2. 피드백이 간결하지 못합니다: 버튼이나 이미지버튼을 사용하여 확장, 축소를 구현했다 하더라도 이중탭할 때 변경되는 내용은 콘텐츠 전체가 아닌 확장, 축소에 대한 상태정보 뿐입니다. 그러나 대체 텍스트로 상태정보를 제공하면 Talkback에서는 텍스트가 변경되었다고 판단하게 되므로 전체 텍스트를 다 읽게 됩니다. 따라서 불필요하게 과한 피드백을 받게 됩니다.
   3. 사용자의 읽기 선호도를 반영할 수 없습니다: Talkback에서는 레이블, 요소 유형, 상태정보의 읽기 순서를 사용자가 설정할 수 있는 옵션을 제공하고 있습니다. 디폴트 옵션은 상태정보, 레이블, 요소 유형입니다. 그러나 펼치기, 접기를 대체 텍스트로 제공하면 이러한 읽기 순서에 따른 피드백을 받을 수 없습니다.
2. 상태정보를 announceForAccessibility 메서드로 알리기: 해당 요소에 포커스 할 때는 상태 정보를 읽어주지 않지만 이중탭을 하면 ‘확장됨’, ‘축소됨’과 같은 음성 피드백을 announceForAccessibility 메서드를 통해서 주는 경우입니다. 물론 이러한 접근성 구현 역시 아예 관련 정보가 없는 것보다는 훨씬 도움이 됩니다. 그러나 해당 피드백은 단 한번의 알림이기 때문에 다시 초점을 이동시키면 상태정보를 들을 수 없다는 문제가 있습니다.
   참고: announceForAccessibility는 화면에 보이지 않는 토스트 형태의 알림을 스크린 리더 사용자에게 제공할 때 사용하는 메서드입니다.
3. 선택됨 정보로 펼침/접힘 상태를 대체하기: selected true, false 속성을 사용하여 확장되었을 때에는 선택됨으로, 축소되었을 때에는 아무런 정보를 제공하지 않는 컴포넌트를 예로 들 수 있습니다. 이 역시 아무런 정보가 없는 것보다는 훨씬 도움이 되지만 선택됨 정보는 탭 요소와 같이 여러 요소 중 하나가 선택되었다는 정보를 전달할 때 사용해야 합니다. 즉 해당 버튼이 토글 형태임을 알려주지 못합니다.

확장, 축소 버튼의 상태정보의 접근성을 올바르게 적용하였다면 Talkback에서는 다음과 같이 정보를 줍니다.

1. 상태정보에 대한 음성 피드백은 ‘접힘’과 ‘펼침’입니다.
2. 상태 정보가 정확하게 구분이 되므로 이중탭했을 때 상태 정보가 변경되면 접힘, 펼침 정보만 읽습니다.
3. 사용자의 읽기 순서 설정에 맞게 피드백을 줍니다.
4. 커스텀 액션 메뉴로도 해당 요소를 펼치거나 접을 수 있습니다.

확장 축소 정보는 AccessibilityAction 사용

체크박스나 스위치 등의 상태정보를 사용하지 않은 커스텀 뷰에서는 AccessibilityNodeInfo 수정을 통하여 상태정보나 요소 유형을 정할 수 있었습니다. 그러나 확장, 축소에 대한 상태정보는 AccessibilityNodeInfo 정보 수정으로는 해당 정보를 줄 수 없습니다. 이는 AccessibilityNodeInfo는 네이티브에서 지원하는 컨트롤 유형과 상태정보만 변경할 수 있기 때문입니다. 때문에 커스텀 탭을 사용할 때 탭에 대한 유형 정보는 AccessibilityNodeInfo에서 지원하는 roleDescription 속성을 사용할 수밖에 없는 것입니다. 참고로 Google의 탭 라이브러리조차도 탭에 대한 요소 유형 정보를 제공하기 위해 roleDescription 속성이 사용되었습니다.

물론 확장, 축소 상태정보를 stateDescription 속성을 통하여 줄 수도 있습니다. stateDescription 은 명칭에서도 유추할 수 있듯이 선택됨, 체크됨이 아닌 별도의 상태정보를 주어야 할 때 사용할 수 있는 속성입니다.

AccessibilityNodeInfo 수정을 통해서 요소 유형 및 상태정보를 변경할 수 있다면 AccessibilityAction을 통해서는 Talkback이 가지고 있는 여러 접근성 액션을 변경할 수 있습니다. AccessibilityAction은 AccessibilityNodeInfo 클래스 내에서 addAction 을 통하여 액션을 추가하고 removeAction 을 통하여 액션을 제거할 수 있으며 performAccessibilityAction 을 통하여 추가한 액션에 대한 동작을 정의합니다. 여러 접근성 액션 중에 ACTION_EXPAND, ACTION_COLLPASE Constant가 있는데 이 두 액션이 바로 확장, 축소와 관련이 있는 액션입니다.

AccessibilityAction은 접근성 동작을 추가하거나 삭제할 때 사용하지만, 특정 액션은 추가될 때 액션과 관련된 정보를 Talkback이 함께 제공하기도 합니다. 예를 들어 클릭 가능한 요소를 만나면 Talkback에서 항상 ‘활성화하려면 이중탭하세요.’ 라는 힌트 메시지를 제공하게 되는데 이 힌트 역시 ACTION_CLICK 접근성 액션이 추가되어 있기에 음성 피드백을 하는 것입니다.

이쯤 되면 ACTION_EXPAND, ACTION_COLLAPSE 액션을 추가했을 때 Talkback에서 어떻게 읽어주는지 짐작이 될 것입니다. 두 액션은 상태정보를 준 것은 아니지만 확장과 축소 액션이 추가되었기 때문에 이에 대한 상태정보를 Talkback에서 자연스럽게 함께 읽게 되는 것입니다. 확장 액션을 주었을 때는 ‘접힘’, 축소 액션을 주었을 때는 ‘펼침’입니다.

이렇게 액션을 추가하면 Talkback에서는 Talkback 메뉴에 해당 액션에 대한 접근성 메뉴를 추가합니다. 따라서 접혀 있을 때는 펼치기, 펼쳐져 있을 때는 접기 메뉴가 추가됩니다. 만약 ACTION_EXPAND, ACTION_COLLASPE 액션을 추가만 한 경우에는 Talkback 커스텀 액션 메뉴에서 펼치기, 접기를 이중탭하면 아무런 동작도 수행되지 않습니다. 이는 접근성 액션은 추가했으나 이에 대한 동작은 performAccessibilityAction 메서드를 활용하여 정의해 주지 않았기 때문입니다. 따라서 펼치기, 접기 액션에 대한 동작을 추가하는 것 또한 잊어서는 안 되겠습니다.

지금까지 설명한 것을 바탕으로 한 코드 예제는 널리 포럼 팁을 참고하도록 합니다.