모바일 앱 접근성 - by. UXKM

요약 설명

모바일 앱 접근성(이하 'MACAG' - Mobile Application Content Accessibility Guidelines)은 모바일 디바이스와 애플리케이션을 사용할 때 모든 사람들이 정보와 기능에 접근할 수 있도록 하는 것을 의미하며, 터치스크린 사용, 소형 화면 크기, 다양한 입력 방식 등 모바일 특성을 고려한 접근성입니다.

국내 행정안전부고시 제2011-38호에 따르면 모바일 접근성 이란 모바일 기기를 사용하여 모바일 애플리케이션을 이용하고자 하는 장애인, 고령자 등을 포함한 모든 사람들에게 활용가능성이 제공됨을 말한다. 라고 정의하고 있습니다.

국제 웹 접근성 이니셔티브는 모바일 접근성을 WCAG(Web Content Accessibility Guidelines)의 일환으로 다루고 있으며, 국내에서는 이러한 국제 기준에 맞춰 모바일 앱 접근성 지침을 마련하여 적용하고 있습니다.
웹 콘텐츠 접근성 가이드라인(WCAG)과 마찬가지로, 모바일 애플리케이션 접근성도 장애인을 포함한 모든 사용자가 콘텐츠를 인지하고, 운용하며, 이해하고, 견고하게 제공받는 것을 중요하게 여깁니다.

4.3.1. 모바일 앱 접근성 지침과 주요 측면

모바일 앱의 접근성을 향상시키기 위해 다양한 지침과 주요 측면을 고려할 필요가 있습니다. 이러한 지침은 장애가 있는 사용자들도 앱을 효과적으로 사용할 수 있도록 도와줍니다.
모바일 앱의 접근성을 개선하기 위해서는 지침을 일관되게 적용하고, 사용자 피드백을 통해 지속적으로 조정 및 개선하는 것이 중요하며, 접근성을 고려한 설계는 모든 사용자가 앱을 보다 편리하게 사용할 수 있도록 하는 데 큰 도움이 됩니다.

  • 시각적 접근성
    • 텍스트 대비

      텍스트와 배경 사이의 색상 대비를 충분히 높여 시각적으로 구분이 잘 되도록 합니다. 충분한 대비는 색맹 사용자와 시각 장애가 있는 사용자들에게 도움이 됩니다.

    • 글꼴 크기 및 스타일

      사용자가 글꼴 크기를 조정할 수 있게 하고, 읽기 쉬운 글꼴을 사용합니다. 텍스트를 확대하거나 줄 간격을 조절할 수 있는 기능도 중요합니다.

    • 이미지 대체 텍스트

      이미지에 대한 대체 텍스트(alt text)를 제공하여 스크린 리더가 이미지를 설명할 수 있도록 합니다.

  • 청각적 접근성
    • 자막 및 오디오 설명

      비디오 및 오디오 콘텐츠에 자막을 제공하고, 중요한 시각적 요소에 대한 오디오 설명을 추가합니다.

    • 시각적 알림

      청각 장애가 있는 사용자를 위해 소리 알림 외에 시각적 또는 진동 알림을 제공합니다.

  • 상호작용 접근성
    • 터치 및 제스처

      터치 스크린의 버튼과 제스처 인식을 최적화하여 손의 사용이 어려운 사용자도 쉽게 조작할 수 있도록 합니다. 버튼 크기를 충분히 크게 하고, 제스처의 오작동을 방지합니다.

    • 키보드 내비게이션

      앱의 모든 기능을 키보드 또는 대체 입력 장치로 접근할 수 있도록 합니다. 화면 읽기 도구와 호환되는지 확인합니다.

  • 비주얼 디자인
    • 단순하고 일관된 디자인

      직관적인 사용자 인터페이스를 설계하여 사용자가 쉽게 탐색할 수 있도록 합니다. 일관된 디자인 패턴을 사용하여 학습 곡선을 줄입니다.

    • 명확한 레이블과 안내

      버튼, 링크 및 입력 필드에 명확하고 설명적인 레이블을 붙입니다. 사용자에게 필요한 정보를 제공하여 오류를 줄입니다.

  • 읽기 및 이해
    • 단순하고 명확한 언어

      직관적이고 간결한 언어를 사용하여 모든 사용자가 내용을 쉽게 이해할 수 있도록 합니다. 복잡한 용어와 문장을 피합니다.

    • 구조적 요소

      헤더, 리스트, 표 등 구조적 요소를 사용하여 정보를 체계적으로 제공하고, 스크린 리더가 정보를 명확하게 해석할 수 있도록 합니다.

  • 테스트 및 피드백
    • 접근성 테스트

      다양한 접근성 도구를 사용하여 앱의 접근성을 테스트하고, 실제 사용자로부터 피드백을 받습니다. 자동화된 접근성 검사 도구와 수동 테스트를 병행합니다.

    • 사용자 피드백

      장애가 있는 사용자들로부터 직접 피드백을 받아, 앱의 접근성을 지속적으로 개선합니다.

  • 국제화 및 지역화
    • 다국어 지원

      다양한 언어를 지원하여 국제적으로 사용 가능한 앱을 만듭니다. 언어 선택 시 접근성 표준을 따릅니다.

    • 문화적 배경 고려

      지역에 따른 디자인 및 콘텐츠의 적절성을 고려하여 사용자가 편안하게 사용할 수 있도록 합니다.

4.3.2. 모바일 앱 접근성 체크리스트

모바일 앱 접근성을 향상시키기 위한 체크리스트는 앱 개발 시 모든 사용자가 쉽게 접근하고 사용할 수 있도록 다양한 접근성 요소를 고려하는 데 도움을 줍니다.
아래 체크리스트를 활용하면 모바일 앱의 접근성을 체계적으로 검토하고 개선할 수 있습니다.

4.3.2.1. 인식의 용이성(Perceivable)

  • 대체 텍스트

    모든 이미지, 아이콘, 버튼 등에 적절한 대체 텍스트가 제공되었는가?

  • 자막 제공

    동영상 및 오디오 콘텐츠에 자막을 제공하는가?

  • 색상 대비

    텍스트와 배경 간의 색상 대비가 충분히 높은가? (최소 4.5:1)

  • 확대/축소

    사용자가 텍스트 크기를 조정할 수 있는 기능을 제공하는가?

  • 콘텐츠 구조

    헤딩, 리스트, 테이블 등 콘텐츠 구조가 논리적이고 명확한가?

4.3.2.2. 운용의 용이성(Operable)

  • 터치 타겟 크기

    버튼과 인터랙티브 요소의 터치 영역이 충분히 큰가? (최소 44x44픽셀)

  • 키보드 접근성

    외부 키보드 사용 시 모든 기능을 사용할 수 있는가?

  • 쉬운 네비게이션

    앱 내 네비게이션이 직관적이고 쉽게 사용할 수 있는가?

  • 제스처 대체

    복잡한 제스처를 단순한 터치로 대체할 수 있는가?

  • 초점 순서

    화면 요소 간 초점 이동 순서가 논리적이고 예측 가능한가?

4.3.2.3. 이해의 용이성(Understandable)

  • 명확한 언어 사용

    단순하고 명확한 언어로 정보를 제공하는가?

  • 일관된 레이아웃

    모든 화면에서 일관된 레이아웃과 디자인을 유지하는가?

  • 피드백 제공

    사용자 작업 완료 또는 오류 발생 시 명확한 피드백을 제공하는가?

  • 에러 방지

    사용자가 실수하기 쉬운 부분에서 경고 메시지를 제공하는가?

  • 입력 지원

    입력 시 자동 완성, 입력 도움말 등을 제공하는가?

4.3.2.4. 견고성(Robust)

  • 기기 호환성

    다양한 기기와 운영체제에서 앱이 일관되게 작동하는가?

  • 최신 기술 지원

    최신 접근성 기술과 표준을 적용하고 있는가?

  • 콘텐츠 접근성

    동적 콘텐츠가 접근성을 유지하며 제공되는가?

  • 호환성 테스트

    다양한 보조기기와 호환성을 테스트했는가?

  • 코드 품질

    접근성 표준을 준수하는 코드로 작성되었는가?

4.3.2.5. 추가 고려 사항

  • 사용자 피드백 수집

    접근성과 관련된 사용자 피드백을 정기적으로 수집하고 반영하는가?

  • 교육 및 훈련

    개발자와 디자이너에게 접근성 관련 교육을 제공하는가?

  • 지속적인 개선

    접근성 문제를 지속적으로 모니터링하고 개선하는 프로세스를 갖추고 있는가?

4.3.3. 모바일 앱 접근성 항목별 체크리스트

  • 대체 텍스트

    텍스트 아닌 콘텐츠는 대체 가능한 텍스트와 함께 제공되어야 합니다.

  • 자막, 수화 등의 제공

    영상이나 음성 콘텐츠에는 동등한 내용의 자막, 원고 또는 수화가 제공되어야 합니다.

  • 색에 무관한 인식

    화면에 표시되는 모든 정보는 색에 관계없이 인식될 수 있어야 합니다.

  • 명도 대비

    화면에 표시되는 모든 사용자 인터페이스 컴포넌트와 텍스트는 전경색과 배경색이 구분될 수 있도록 제공되어야 합니다.

  • 명확한 지시 사항

    지시 사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 합니다.

  • 알림 기능

    알림 정보는 화면 표시, 소리, 진동 등 다양한 방법으로 제공되어야 합니다.

  • 초점

    의미나 기능을 갖는 모든 사용자 인터페이스 컴포넌트에는 초점(focus)이 적용되고, 초점은 논리적인 순서로 이동되어야 합니다.

  • 누르기 동작 지원

    터치(touch) 기반 모바일 기기의 모든 컨트롤은 누르기 동작으로 제어할 수 있어야 합니다.

  • 응답 시간 조절

    시간 제한이 있는 콘텐츠는 응답 시간을 조절할 수 있어야 합니다.

  • 정지 기능 제공

    자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 합니다.

  • 컨트롤의 크기와 간격

    컨트롤은 충분한 크기와 간격으로 제공되어야 합니다.

  • 입력 도움

    입력 서식 이용 시, 입력 오류를 방지하거나 정정할 수 있는 방법을 제공해야 합니다.

  • 사용자 인터페이스의 일관성

    사용자 인터페이스 컴포넌트들은 일관성 있게 배치되어야 합니다.

  • 깜박거림의 사용 제한

    깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 합니다.

  • 자동재생 금지

    자동으로 재생되는 배경음을 사용하지 않아야 합니다.

  • 예측가능성

    사용자가 의도하지 않는 화면 전환이나 이벤트 등이 실행되는 경우 사용자가 이해할 수 있는 방법으로 제공되어야 합니다.

  • 폰트 관련 기능의 활용

    텍스트 콘텐츠는 운영체제에서 제공하는 폰트 관련 기능을 활용할 수 있는 방법을 제공해야 합니다.

  • 보조 기술과의 호환성

    사용자 인터페이스 컴포넌트는 보조 기술을 이용하여 사용할 수 있도록 해야 합니다.

4.3.4. 모바일 앱 접근성 용어

  • 접근성

    장애인, 고령자 등을 포함한 모든 사람이 모바일 기기를 사용하여 모바일 애플리케이션 콘텐츠를 이용할 수 있는 가능성

  • 모바일 기기

    입력 및 출력기능이 있고 무선 인터넷 서비스를 사용 할 수 있는 휴대용 기기(운영체제를 갖는 모바일 전화기, 운영체제를 갖는 태블릿 기기)

  • 모바일 애플리케이션 콘텐츠

    모바일 플랫폼 개발언어로 제작된 응용 프로그램 및 콘텐츠

  • 서비스 제공자

    모바일 기기를 이용하여 콘텐츠 및 서비스를 제공하는 공공기관 및 사업자

  • 무리한 부담(undue burden)

    현재 가능한 기술 수준과 적절한 비용으로 실현시킬 수 있는 정도 이상의 노력을 요구함

  • 보조 기술
    • 장애인의 신체적․인지적 기능을 증진, 보완, 향상시키기 위하여 사용하는 기기, 장비의 일부분, 시스템 또는 소프트웨어
    • 보조기술의 예로는 시각 장애인용 화면 낭독기, 저시력 장애인용 화면 확대 프로그램, 점자 표시를 위한 점자 디스플레이 및 상지 장애인을 위한 안구 마우스 등이 있음
  • 대체 텍스트

    이미지의 표현 또는 이미지를 설명하는 텍스트

  • 명도 대비

    화면의 배경색과 사용자 인터페이스 컴포넌트 및 텍스트를 표시하는 데에 사용되는 전경색 사이의 명도 차이의 비율(contrast)

  • 초점(포커스)
    • 화면상의 선택된 사용자 인터페이스 컴포넌트의 내용을 화면 낭독 프로그램 등의 보조 기술을 통해 이용할 수 있도록 도와주는 기능
    • 선택된 사용자 인터페이스 컴포넌트는 초점이 적용되고, 초점은 화면상에서 테두리나 하이라이트로 표시됨
    • 개별 사용자 인터페이스 요소는 커서를 표시하여 초점을 표현함
    • 어떤 사용자 인터페이스 요소가 초점을 받았다는 것은 그 요소가 선택되어 사용자가 입력을 수용할 준비가 되어 있는 상태임을 의미함
  • 누르기 동작

    화면상의 사용자 인터페이스 컴포넌트를 손가락 끝으로 접촉하여 만지거나(touch) 가볍게 두드리는(tap) 동작

  • 컨트롤(control)

    버튼 또는 위젯과 같이 사용자 인터페이스 화면에서 누르기 동작으로 기능을 활성화시키는 사용자 인터페이스 컴포넌트

  • 폰트 관련 기능

    운영체제에 내장되어 확대/축소, 기울임, 색변환, 음영 등의 변형 형태가 제공되어 보조 기술(스크린리더 등)이 처리할 수 있는 기능

  • 기본 사용자 인터페이스 컴포넌트

    사용자 인터페이스 구성에 사용되는 표준 도구(대화상자, 버튼과 체크박스, 타이틀바 등)

  • 팝업

    사용자의 동작에 의하여 문맥에 따라 나타나는 정보

  • 손가락을 댄 후, 손을 떼지 않고 계속적으로 끄는(drag) 움직임

  • 지시 사항

    사용자 인터페이스에서 무엇을 하거나 사용하는 데 필요한 자세한 설명

  • 객체

    사용자 인터페이스에서 시스템의 구성 요소가 아이콘과 같은 화면상에 표시되는 가시적 실체에 의해 표현되는 것

4.3.5. W3C 모바일 접근성(WCAG 2.0) Guidelines

4.3.5.1. 인식의 용이성(Perceivable)

  1. 대체 콘텐츠 Guideline 1.1: Alternative content
  2. 누락된 콘텐츠 Guideline 1.2: Missing content
  3. 강조 표시 Guideline 1.3: Highlighting
  4. 텍스트 구성 Guideline 1.4: Text configuration
  5. 볼륨 설정 Guideline 1.5: Volume configuration
  6. 합성 음성 설정 Guideline 1.6: Synthesized speech configuration
  7. 사용자 스타일 시트 구성 Guideline 1.7: User style sheet configuration
  8. 뷰포트의 방향 Guideline 1.8: Orientation in viewports
  9. 대체 보기 Guideline 1.9: Alternative views
  10. 요소 정보 Guideline 1.10: Element Information

4.3.5.2. 운용의 용이성(Operable)

  1. 키보드 접근 Guideline 2.1: Keyboard access
  2. 순차적 탐색 Guideline 2.2: Sequential navigation
  3. 직접 탐색 및 활성화 Guideline 2.3: Direct navigation and activation
  4. 텍스트 검색 Guideline 2.4: Text Search
  5. 구조적 탐색 Guideline 2.5: Structural navigation
  6. 설정 선호 Guideline 2.6: Preference settings
  7. 그래픽 컨트롤 Guideline 2.7: Graphical controls
  8. 시간 비독립적 상호작용 Guideline 2.8: Time-independent interaction
  9. 깜빡임 Guideline 2.9: Flashing
  10. 시간 기반 미디어 Guideline 2.10: Time-based media
  11. 기타 입력 장치 Guideline 2.11: Other Input Devices