[프로젝트 동글] 웹 접근성 관리 대상 선정 및 개선

이 글은 동글이 고민한 웹 접근성과 적용 결과에 관한 글입니다.

1. 개선 할 웹 접근성 선정과 개선 과정

모든 사람들이 동글을 차별없이 동일하게 사용할 수 있도록 웹 접근성을 고려했다.

고려해볼 웹 접근성은 다양한데, 그 중 잘 안지켜지는 웹 접근성 TOP8 중에 동글 서비스에 적용하면 좋은 접근성을 우선으로 선정하여 개선하려고 했다.

잘 안지켜지는 웹 접근성 TOP8

동글은 글을 관리하고 발행하는 서비스이기 때문에 그 기능을 제공하는데에 중요한 명도대비, 반복영역 건너뛰기, 키보드 사용보장을 선정했다.

텍스트 컨텐츠의 명도 대비

동글은 글을 봐야하기 때문에 글자와 배경의 명도대비가 중요하다.

또한 시각장애인들이 이용하려면 키보드로만 이용할 수 있어야한다.

웹 컨텐츠 접근성 가이드 라인인 WCAG 2.1 에 따르면, 명도대비가 4.5:1 이상이면 AA 수준이라고 한다.

동글의 사용자는 글을 읽어야하기 때문에 최상위인 AAA 수준까지는 아니더라도 AA 수준을 맞추고자했다.

컨텐츠 반복영역 건너뛰기

반복영역 건너뛰기는 키보드조작과 관련이 있다.

또한 스크린리더를 이용하는 시각장애인들에게 중요한 요소이다.

대한항공, 아시아나 항공의 웹페이지를 통해 먼저 알아보자.

예시

항공사 웹페이지에서는 정말 많은 기능들을 제공한다. 그래서 각 기능들 페이지로 접근하기 위해 메인 네비게이션에는 많은 메뉴들이 있다. 그래서 이 메인 네비게이션에 대한 접근성은 매우 중요하다. 탭키로 서브 메뉴들을 이동할 수는 있지만, 스크린리더 사용자에게는 치명적인 불편함이 있다.

예를 들어 아래와 같이 아시아나 항공사에서 마일리지 사용을 위해
아시아나클럽 > 마일리지사용 > 아시아나항공으로 넘어가기 위해서는 무려 탭키를 거의 100번 가까이 눌러야한다.

불편한 접근성

이렇게 탭키를 이용해 메뉴를 탐색하는건 기능은 사용할 수 있지만 굉장히 불편하다. 그래서 대한항공의 경우 메인 메뉴가 서브 메뉴를 엔터키를 눌러 펼쳐질 수 있게 구현하였다.

훨씬 가까워진 마일리지 몰

이렇게 반복영역 건너뛰기는 장애인들에게 아주 중요한 기능을 한다.

반복영역 건너뛰기: 동글의 경우

동글에는 카테고리 영역이 있다.

맨 마지막 "곰이란 무엇인가?" 글을 보고싶다고 가정하자.

만약 아시아나 항공처럼 각 카테고리에 탭키로 포커싱이 되었을 때 자동으로 카테고리가 열린다면 

탭키를 많이 눌러야할 것이다.

따라서 동글은 대한항공처럼 엔터를 클릭해서 카테고리 내부로 진입할 수 있게 하였다.

동글

동글은 키보드만으로 글 업로드, 배포를 할 수 있다!

음성 피드백을 들으며 키보드만으로 동글을 이용하는 모습

보이스오버를 통해 음성 피드백을 받을 수 있기 때문에 

시각장애인이나 마우스를 사용할 수 없는 사람들이 동글 서비스를 이용할 수 있다.

2. 마치며

시각장애인이 아이폰을 사용하는 방법을 보면서 느낀 점이 정말 많다.

정상인으로 살면서 한번도 장애인들은 어떻게 인터넷이나 어플등을 이용하는지, 또 어떤 어려움을 겪을지 생각을 해본적이 없었는데

저 영상을 보고 많은 공감을 했고 개발자로서 웹 접근성을 꼭 지켜야겠다고 생각했다. 

 

웹 접근성을 개선하면서 어떤 이유로든 동글의 서비스를 이용하지 못했던 유저들도 

보이스 오버를 이용해 동글의 핵심적인 기능을 사용할 수 있게 되었다는 점이 기쁘다.

앞으로 개발하면서 음성 피드백을 더 섬세하게 제공해서 접근성을 더 높이고, 꾸준한 유지보수를 해야겠다!