키보드와 스크린 리더의 네비게이션 차이

이 글은 Leonie Watson의 The difference between keyboard and screen reader navigation을 번역한 글입니다. 

 

* navigation은 네비게이션, navigate은 '콘텐츠를 탐색한다'는 의미로 표현했습니다. 

 

사람들은 종종 스크린 리더 사용자를 더 큰 범주인 키보드 사용자에 포함시킵니다. 대부분의 스크린 리더 사용자가 마우스를 사용하지 않기에 맞는 말이지만, 이러한 생각은 스크린 리더 사용자가 콘텐츠를 탐색하는 방식에 대한 잘못된 인식을 심을 수 있습니다. 

 

좀 더 설명하기 위해 사람을 다음 두 그룹으로 나눠보도록 하겠습니다. 

 

- 키보드 사용자 : 콘텐츠를 볼 수 있지만 마우스를 사용하지 않는 사용자 

- 스크린 리더 사용자 : 콘텐츠를 볼 수 없고, 마우스를 사용하지 않는 사용자

 

다른 두 그룹을 매우 단순하게 표현한 것이지만, 콘텐츠를 볼 수 있음과 없음은 콘텐츠를 탐색하는 데에 중요한 차이를 만들어 냅니다. 

 

키보드 네비게이션 

키보드 사용자들은 제한된 키보드 단축키들을 사용해 콘텐츠를 탐색합니다. 

 

- tab키는 link, button, form field와 같은 포커싱할 수 있는 다음 요소로 넘어갈 수 있고, 화면 밖에 있는 곳으로 스크롤할 수 있습니다. shift + tab은 이전 포커싱할 수 있는 요소로 넘어갑니다. 

- space는 다음 콘텐츠 영역이 화면에 보이도록 스크롤 할 수 있고, shift + space는 이전 콘텐츠 영역이 화면에 보이도록 스크롤할 수 있습니다. pagedown과 pageup 키가 각각 같은 역할을 합니다.

- home키는 페이지 최상단 부분이  화면에 오도록 하고, end키는 페이지 최하단 부분이 화면에 오도록 합니다. 

 

이러한 탐색 방법은 문제가 없다고 단정짓기 어렵고, 콘텐츠를 탐색하는데 최선의 방법은 아니지만, 콘텐츠를 볼 수 있는 사람에게 일반적으로 쓰이는 방법입니다. 물론, 스크린리더 사용자들에게는 어려운 방법입니다.

 

스크린 리더 네비게이션

live regions와 같은 것들을 제외하고, 스크린 리더는 현재 포커싱하고 있는 요소에 대해서만 말을 합니다. 여기서 아주 중요한 사실에 이르게 되는데, 키보드 포커스와 스크린 리더 포커스가 같지 않다는 것입니다. 

 

키보드 포커스는 포커싱 가능한 요소들 사이에서의 tab 이동으로 제한되어 있습니다. 만약 스크린 리더 사용자가 tab키를 이용해서 콘텐츠를 탐색한다면, 사용자는 포커싱 가능한 각 요소가 키보드 포커스를 받을 때마다 그것의 이름을 듣게 될 것입니다. 그들이 듣지 않게 되는 것은 텍스트나 헤딩, 이미지와 같은 콘텐츠들입니다. 

 

tab키를 사용할 때, 키보드 포커스와 스크린 리더 포커스는 서로 동기화됩니다. 나머지 시간에 스크린 리더 사용자는 키보드 포커스와는 독립적으로 원하는 대로 콘텐츠를 탐색하고 읽을 수 있는 많은 명령어들을 쓸 수 있습니다. 명령어들은 스크린 리더마다 다양한데, 공통적으로 갖고 있는 명령어가 있습니다.( 다른 HTML 요소들을 묶을 수 있습니다. ) 스크린 리더 포커스를 헤딩, 이미지, 문단, 섹션 요소, 리스트나 리스트 아이템과 같은 것들끼리 이동할 수 있는 명령어가 있습니다. form field나 checkbox, radio button, text field, button과 같은 특정 타입끼리 이동하거나 table 사이, 열이나 행끼리에서도 이동이 가능합니다. 

 

Smashing TV webinar에서 스크린 리더를 사용하는 것을 볼 수 있습니다. 약간 길지만, 요약 영상도 가능합니다. 

 

키보드 사용자이던지 스크린 리더 사용자이던지 HTML의 중요성은 아무리 강조해도 지나치지 않습니다. 목적에 맞는 적절한 요소를 사용한 HTML 없이는 스크린 리더의 네비게이션은 온전히 이뤄지지 않을 것이고, 키보드 네비게이션을 사용하는 것도 큰 위험부담이 따를 것입니다.