iOS 뒤로가기 제스처 접근성 대응에 관하여
안녕하세요, 엔비전스입니다.
iOS VoiceOver 사용자는 “이전 화면” 혹은 “닫기” 컨트롤이 있으면 그 버튼을 직접 찾아서 이중탭하기도 하지만 두 손가락 위아래 혹은 좌우로 움직이기 제스처를 사용하여 이전 화면으로 이동하려고 시도하는 경우가 많습니다. 마치 안드로이드에서 이전 화면으로 가고 싶을 때 상단의 버튼을 찾아서 탭하지 않고 하단의 뒤로가기 버튼을 탭하거나 제스처를 사용하는 경우가 많은 것과 같습니다.
이는 아이폰에 접근성 기능이 도입된 이후 많은 화면에서 두 손가락 문지르기 제스처가 동작되도록 구현되어 있었기 때문에 습관적으로 새로운 앱에서도 해당 제스처를 시도해 보는 것입니다.
앱에서 이 제스처를 지원하면 뒤로 버튼을 일일이 찾아서 이중탭하지 않아도 될 뿐만 아니라 블루투스 하드웨어 키보드 사용시 ESC 키를 눌러 이전 화면으로 돌아갈 수 있기 때문에 탐색의 효율성이 훨씬 높아지게 됩니다. 또한 닫기, 혹은 뒤로가기 버튼 자체를 화면에 제공하지 않고 빈 영역을 터치하여 이전 화면으로 돌아갈 수 있도록 구현된 화면에서는 이 제스처가 없으면 스크린 리더 사용자는 이전 화면으로 돌아갈 수 있는 방법 자체가 없어지게 됩니다.
그런데 접근성이 잘 되어 있는 앱에서 조차도 두 손가락 문지르기 기능 구현이 되어 있지 않은 경우가 많습니다. 또 어떤 경우는 뒤로가기 제스처의 접근성 구현을 별도로 하지 않았음에도 두 손가락 문지르기 기능이 작동되는 경우도 있습니다.
따라서 본 문서에서는 뒤로가기 제스처의 접근성 API에 대해서 자세히 다루어 보도록 하겠습니다.
UINavigation Controller의 backBarButtonItem을 사용한 경우
UINavigationController의 navigationItem.bckkBarButtonItem을 사용하여 뒤로가기 버튼을 구현하는 경우에는 별도로 접근성 대응을 하지 않더라도 두 손가락 문지르기 제스처를 사용하여 이전 화면으로 이동할 수 있습니다. 또한 NavigationItem에 화면의 제목을 삽입할 경우에는 이 역시 접근성 대응을 하지 않아도 제목에 header trait가 삽입되어 ‘테스트 머리말’과 같이 제목 유형으로 VoiceOver가 읽어주게 됩니다. 다음은 NavigationItem.backBarButtonItem으로 뒤로 버튼을 구현한 뒤로 버튼에 대한 접근성 API의 특징에 관한 설명입니다.
- 뒤로가기 버튼에 시각적으로 표시될 이전 화면 제목 레이블을 표시했다면 VoiceOver는 이전 화면의 제목과 함께 ‘뒤로 버튼’이라고 읽어줍니다. 예를 들어 이전 화면의 제목이 과일 리스트이고 현재 사과 화면에 들어와 있다면 뒤로 버튼에 포커스 했을 때 VoiceOver는 ‘과일 리스트, 뒤로 버튼’이라고 읽게 됩니다. 따라서 사용자는 이전 화면으로 이동했을 때의 제목이 무엇인지를 미리 확인할 수 있습니다.
- 만약 뒤로 가기 버튼의 시각적 레이블이 비워져 있고 이전 화면의 화면 제목도 없다면, 즉 이전 화면의 NavigationBar 제목 요소를 비워 두었다면 읽어줄 제목이 없으므로 ‘back, 뒤로 버튼’이라고 읽어줍니다.
- 1번과 2번의 예에서 알 수 있듯이 backBarButtonItem을 사용하는 순간 VoiceOver는 자동으로 ‘뒤로’라는 레이블을 붙여서 읽습니다.
- 뒤로가기 버튼의 시각적 텍스트를 이전 화면의 제목이 아닌 ‘닫기’와 같이 부여한 경우에는 VoiceOver에서 ‘닫기, 뒤로버튼’이라고 읽어주므로 이전 화면의 제목이 마치 닫기 인것처럼 읽어주어 사용자에게 혼란을 줄 수 있습니다. 따라서 ‘닫기’와 같이 버튼의 레이블만 단독으로 표시해야 할 경우에는 일반 버튼을 사용하는 것이 접근성 측면에서 더 적절한 방법이라 할 수 있습니다.
- 그럼에도 불구하고 backBarButtonItem을 사용하여 ‘닫기’와 같이 보이는 텍스트를 변경하여 구현해야 할 때는 swift에서 이에 대한 대체 텍스트를 다르게 지정하여 VoiceOver 사용자는 ‘닫기, 뒤로 버튼’이 아니라 <이전 화면 제목, 뒤로 버튼>으로 읽어주도록 구현할 수 있습니다. 구현 방법은 간단합니다.
관련 화면의 ViewController swift에 다음을 추가합니다.
self.navigationItem.backBarButtonItem?.accessibilityLabel = “VoiceOver가 뒤로가기 버튼 앞에 읽을 제목 텍스트"
이렇게 하면 이전 화면의 뒤로 가기 버튼의 시각적 레이블이 닫기라 하더라도 대체 텍스트로 삽입된 제목을 읽게 됩니다. 단 해당 대체 텍스트는 반드시 swift 파일을 작성해야 삽입이 가능하며 storyboard에서는 삽입이 불가능합니다.
뒤로 버튼을 커스텀으로 구현하는 경우
위의 섹션에서처럼 NavigationController에서의 backBarButtonItem을 사용하여 뒤로 버튼을 사용하는 경우에는 별 문제가 없으나 기본 제공된 뒤로 버튼을 숨기고 커스텀으로 뒤로가기 버튼을 제공하거나 NavigationController를 사용하지 않는 경우, 혹은 뒤로 버튼 자체가 없는 경우에는 반드시 두 손가락 문지르기로 이전 화면으로 이동할 수 있도록 이에 대한 접근성 대응을 해 주어야 합니다. 이 때 사용하는 메소드는 accessibilityPerformEscape() 입니다. 사용 방법은 다음과 같습니다.
override func accessibilityPerformEscape() -> Bool {
뒤로가기 기능 수행을 위한 명령
return true
}
이렇게 하면 굳이 뒤로가기 버튼을 찾아서 이중탭하지 않아도 두 손가락 문지르기 제스처로 해당 기능을 수행할 수 있게 됩니다.
지금까지 iOS VoiceOver 사용 시 뒤로가기 제스처에 대한 여러 접근성 이슈들에 대해 살펴보았습니다. 이 글이 iOS VoiceOver에서의 뒤로가기 접근성 처리 방식을 이해하는데 조금이나마 도움이 되었으면 합니다.