소개 : The Accessibility Inspector enables you to identify parts of your app that are not accessible. It provides feedback on how you can make them accessible, as well as simulating voice-over to help you identify what a Voice Over user would experience.
Watch a live-demo of an app being fully debugged in the Accessibility Inspector, and learn how to leverage this powerful tool to make your apps better for everyone.
Accessibility 이슈와 관련한 테스트를 진행하고 싶다면? Xcode 상단의 Xcode > Open Developer Tools > Accessibility Inspector
Accessibility Inspector 창의 좌측 - iPhone 설정
우측의 두번째 Audit 버튼 클릭하여 Audit 탭으로 이동
Run Audit 클릭
경고 메시지를 클릭하면 관련 UI 요소를 확인 가능하다. 경고 메시지 우측의 Help 버튼을 클릭하면, 해결방법을 알려준다.
경고-1. Image name used in description → Set a human-readable, localized accessibilityLabel
Assisting Tech. 중 하나인 Voice Over 기능은 UILabel에 대해 "OO Label"이라고 읽어준다.
경고-2. Potentially inaccessible text
sender UIKit 또는 app key controls???를 쓰면 accessibility를 자동으로 적용한다. 하지만 여기서는 CATextLayer를 사용하여 직접 설정해줘야 한다.
경고-3. Contrast Failed (대비)
대비가 너무 낮아서 사용자가 텍스트를 알아보기 어렵다는 내용이다. 권장 대비는 3.0인데, 현재 2.32인 상태이다.
Color Contrast Calculator 툴을 사용하면 텍스트 색상 및 배경 색상을 비교해준다. (Xcode 상단 Window > Show Color Contrast Calculator)
Inspector 탭으로 이동
Custom 버튼에 대해 알아보자. 상단 가운데의 point inspection 버튼 클릭
Basic의 Label을 확인하면 image 파일이름으로 지정되어 있다. (ex. camera.on.rectangle)
우측 상단의 스피커 버튼을 누르면 Voice Over simulator를 작동시킬 수 있다. Label 이름을 읽어준다.
버튼을 누르면 다음 UI 요소를 읽어준다.
코드 수정
경고-1
//...
favoriteButtom.accessibilityLabel = data.favorite ? "Remove Favorite" : "Favorite"
}
private func setupCameraButton(with data: PBViewModel) {
cameraButton.accessibilityLabel = "Take a photo"
}
private func setupBuyButton(with data: PBViewModel) {
cameraButton.accessibilityLabel = "Buy"
}
//...
경고-2
assistive tech.에게 해당 UI요소 (Label)가 Accessibility Element임을 알려주면 된다. 그리고 브랜드 이름과 동일하게 설정한다.
customView.isAccessibilityElement = true
경고-3
텍스트 색상을 바꿔준다.