널리

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

매해 널리 아티클 돌아보기를 작성할 때마다 시간이 참 빠르다는 것을 느낍니다.

2022년 올해도 지난 한 해 동안 여러분의 접근성에 대한 지식을 높여 드리기 위해 저희가 열심히 연구하고 공유했던 아티클을 다시 한번 살펴보고, 저희가 고민해 온 향후 방향성을 여러분께 공유하고자 합니다.

웹 접근성 아티클: 마크업, 스타일, 스크립트

1. WAI-ARIA 바르게 사용하기 10부 - TreeView: Windows 탐색기에서 폴더만을 모아볼 수 있는 트리뷰 목록을 웹 콘텐츠에서 정의할 때 사용되는 WAI-ARIA의 유형과 상태 정보, 고려해야 하는 키보드 접근성, 시각적인 디자인에 대해 다룹니다.
2. WAI-ARIA Pattern Library 제작하기 1, 2부: 개발자 및 전문가 외의 다양한 사람들이 접근성이 구현된 커스텀 웹 요소를 손쉽게 사용할 수 있도록 하는 패턴 라이브러리를 제작하는 기법을 버튼과 체크 상자 구현을 중심으로 설명합니다.
3. 접근성 좋은 정렬 가능 데이터 테이블 만들기: 데이터 테이블에서 각 제목셀 기준으로 오름차, 내림차순 정렬 기능이 있는 테이블의 제목 셀에 어떻게 오름차순/내림차순 상태 정보를 제공할 수 있는지 설명합니다.
4. 모든 사용자를 위한 더 보기 메뉴 만들기: 접근성이 고려된 커스텀 드롭다운 메뉴를 구현하는 여러 가지 방법, 모바일 디바이스를 고려했을 때의 주의사항에 대해 설명합니다.
5. Chrome 최신 버전에 추가된 ARIA Reflection 자바스크립트 API와 AOM 소개: 웹에서 set, getAttribute를 거치지 않고 Javascript를 통해 직접 WAI-ARIA를 다룰 수 있는 AOM에 대한 개요, 최신 Chrome에서 추가된 AOM의 일부 기능인 ARIA Reflection을 소개합니다.
6. iOS, macOS Safari 페이지에 스마트한 배경 반전 요소 제공하기: Apple 운영체제에서 지원하는 CSS 미디어 쿼리를 이용하여 스마트 반전 사용 시에도 CSS 배경 이미지가 반전되지 않고, 본래의 색상으로 표시되게끔 하는 방법에 대해 설명합니다.
7. Modal.js를 활용한 모달 대화상자 접근성 개선하기: 기존 콘텐츠를 보이지 않거나 사용할 수 없게 덮는 모달 형태의 팝업 화면을 구현할 때, 접근성을 손쉽게 구현할 수 있는 modal.js를 제작하여 사용법과 함께 소개합니다.

모바일 접근성

1. 안드로이드에서 사용 가능한 접근성 유틸 클래스 소개: Java, Kotlin에서 커스텀 컨트롤을 조금 더 빠르고 간편하게 구현할 수 있게끔 돕고자 만든 라이브러리로, 배포 및 소개, 사용법을 공유합니다.
2. iOS 네이티브에서 접근성 초점 캐치하기: VoiceOver 초점이 롤링 배너에 접근하면 슬라이드 일시정지하거나, 서버와 통신하기 위해 view 전체를 새로 고치는 상황에서 VoiceOver 초점을 관리하여 접근성 초점이 다른 곳으로 이동하지 않도록 예외 처리를 하는 방법에 대해 다룹니다.
3. 안드로이드 네이티브에서 확장/축소 버튼 접근성 적용하기: 안드로이드에서 제공하고 있는 접근성 API를 활용하여 확장/축소 버튼에 접근성을 적용하는 방법에 대해 다룹니다.
4. 스크린 리더 사용자를 위한 안드로이드 네이티브 동영상 플레이어 접근성 구현하기 1, 2부: 동영상을 재생했을 때, 일정 시간이 지나면 동영상 제어기를 숨기고, onTouchListener로만 숨은 제어기를 표시할 수 있게끔 구현된 사례에 대한 접근성 이슈 및 해결 방안을 다룹니다.
5. iOS 커스텀 탭 막대(TabBar) 구현 시 접근성 적용하기: 기본 탭 막대를 사용할 수 없을 때 커스텀 탭 막대에 사용자를 위한 탭 막대 정보를 제공하는 방법에 대해 소개합니다.
6. 접근성 향상을 위한 iOS 커스텀 슬라이더 구현 방법: UISlider를 사용하지 않고 커스텀으로 슬라이더를 구현했을 때 생기는 접근성 이슈를 해결하는 방법을 다룹니다.
7. Android 접근성 트리 디버깅 3부: UIAutomator viewer 활용하기: 안드로이드 앱을 개발하기 위해 필요한 SDK 내에 포함된 UIAutomatorViewer를 활용하여 현재 실행 중인 앱의 접근성 트리 구조를 확인하는 방법에 대해 다룹니다.
8. 스마트폰 네이티브 앱 하드웨어 키보드 접근성 구현하기 2부, 안드로이드 시스템 포커스: 안드로이드 앱에서 하드웨어 키보드 접근성을 구현할 때 알아 두어야 할 특징과 키코드 사용방법, 화면에서 가려진 콘텐츠가 Tab 키로 탐색되지 않도록 하는 등의 하드웨어 키보드 지원 방법을 다룹니다.

접근성 기능 소개, 접근성 관련 소식

1. Windows 11에서 변경된 고대비 모드 소개: 2021년 6월에 깜짝 발표한 새로운 Windows 11에서 추가된 고대비 테마와 설정 방법, 웹 개발 시, CSS에서 고대비 테마를 어떻게 대응할 수 있는가를 다룹니다.
2. SNS에서의 사용자 지정 대체 텍스트 직접 넣어 보기: 페이스북, 인스타그램 사진에 대체 텍스트를 작성하는 방법, 페이스북에서 자동으로 제공하고 있는 이미지 설명 기술 등에 대해 다룹니다.
3. 색맹 사용자를 위한 특정 색상 이름 확인하기: 색맹 사용자가 색상에 의존하는 서비스를 사용할 때, 색 확인을 위해 사용할 수 있는 여러 방법과 색에만 의존하지 않는 콘텐츠 기획 및 디자인의 중요성에 대해 다룹니다.

널리 포럼 팁에서 다룬 내용들

1. iOS, Android 앱을 개발할 때 놓치기 쉬운, 접근성에 도움이 되는 디테일들: 랜드마크, HTML 네이티브 버튼 태그 사용의 중요성, 안드로이드에서의 화면 제목 제공 등 기존에 이미 소개되었으나 놓치거나 간과하기 쉬운 세부적인 접근성 이슈를 정리하였습니다.
2. 모바일 앱 접근성 구현 관련 코드 조각: 커스텀 액션, 확장/축소, 커스텀 탭, 스크린 리더 초점 관리 등의 코드를 포함한 접근성 구현 예시를 공유했습니다.
3. 웹 및 안드로이드에서 접근성 구현을 쉽게 할 수 있는 유틸 클래스와 여러 자바스크립트 코드 파일을 배포하고 소개했습니다.

2022년 널리 아티클 계획

접근성은 인식에 대한 부분도 중요하지만 이미 만들어져 있는 서비스에 대한 접근성 구현 시 효율적인 해결 방안을 제시하는 것 또한 중요한 부분이라고 생각합니다. 따라서 저희는 올해에도 개발과 관련된 내용을 위주로 널리 아티클을 꾸미고자 합니다.

1. Flutter로 개발된 앱 접근성 개선 방법: Flutter에서 제공하고 있는 여러 접근성 API를 활용하여 Flutter 앱 개발 시 다양한 접근성 개선 방법에 대해 다룰 예정입니다.
2. SwiftUI로 개발된 Apple 앱 생태계 접근성 개선 방법: iOS 13부터 지원하기 시작한 SwiftUI는 현재 기존 UIKit보다 더 많은 접근성 API를 가지고 있으며 가까운 미래에 UIKit을 대체할 것으로 예상하고 있습니다. 따라서 SwiftUI의 기본 기능과 SwiftUI의 API를 활용한 접근성 구현 방법에 대해 다룰 예정입니다.
3. 기존과 같이 웹 접근성, Microsoft Office 문서 저작도구에서 독자를 위해 적용할 수 있는 접근성 기능, 사용자와 개발자 모두를 위한 IT생태계 접근성 소식 등, 다양한 주제를 작성할 예정입니다.
4. 널리 아티클과 마찬가지로, 널리 포럼 팁 또한 앞으로도 꾸준히 작성하여 더 다양한 사람이 새로운 접근성 정보를 얻고, 알고 있던 지식을 복습할 수 있는 기회를 제공하고자 합니다.

2022년도 널리와 함께 접근성 지식을 살찌우고 모두가 행복한 환경을 만드는 보람찬 한 해가 되기를 기원합니다.