전문가 상담

HOME > 지식마당 > 온라인 자문서비스 > 전문가 상담
모바일 웹 접근성 관련 문의 드립니다.
모바일 웹 접근성 관련 문의 드립니다.
작성일 2017-02-15 오후 11:48:19 작성자 장지호
첨부파일
  • 등록된 첨부파일이 없습니다.
[질문]

-webkit-tap-highlight-color:rgba(0,0,0,0);
의 사용이 모바일 웹 접근성에 어긋난다고 할 수 있나요?

PC의 경우는 초점이동에 따라서 시각적으로 구분되어야 하지만 모바일의 경우는 해당되지 않는 것으로 알고 있습니다.
예로, 네이버 tv (http://m.tv.naver.com/v/1443319) 는 .u_rmcplayerXXXX 클래스명의 태그에서 해당 속성을 제공하여 영상플레이어 내의 클릭가능한 콘텐츠들에서 초점이 갔을 때 불필요하게 생기는 기본 파란배경색을 제거하였습니다. 다음 TV팟도 플레이어 내부에서 동일한 스타일을 사용하였습니다.

빠른 답변 부탁드립니다~




[답변]

안녕하세요
-webkit-tap-highlight-color 속성은 화면에 터치(탭)된 순간 하이라이트 효과를 줄 수 있습니다.
접근성 측면에서 초점은 현재 선택된 요소의 위치를 알 수 있도록 표시해주어 키보드나 보조기기 사용자도 현재 선택된 초점 위치를 확인 할 수 있도록 해주어야 한다는 점을 고려해야 합니다.
대표적으로 outline 속성을 통해 키보드 초점을 이동시 포커스의 위치를 감추는 경우는 문제가 됩니다.

탭순간 해당 영역을 파란색(또는 브라우저 기본색상)으로 색상이 덮혀주는 효과를 -webkit-tap-highlight-color: transparent; 와 같이 투명하게 처리되도록 한다하여 일반적으로 접근성측면에서는 문제가 되지 않는다고 보고 있습니다.
outline 속성과 달리 키보드 이동시 해당 속성으로 인해 위치를 판단하는 데 영향을 주지 않습니다.
해당 속성은 사용자가 화면을 탭하는 동안 위치를 표시하는 효과를 가지고 있는데, 이는 사용자가 화면을 터치하는 위치를 명확히 판단할 수 있기 때문에 터치하는 영역을 표시해주지 않더라도 자신이 터치한 영역은 손가락의 위치를 통해 판단할 수 있어 큰 문제가 되지 않다고 봅니다.

다른 이유로는
-webkit-tap-highlight-color 속성을 투명하게 할 경우, 자신이 터치한 요소의 공간(영역)을 정확히 판단할 수 없지만
일반적으로 UI의 형태를 통해 대략적인 영역의 크기나 위치를 유추 할 수 있어 대체정보를 얻을 수 있기 때문입니다.

전문가상담 목록
번호 분류 제목 작성자 작성일
10220 일반 모바일 웹 접근성 관련 문의 드립니다. 최고운 2017-02-13
10224 일반  전문가 답변모바일 웹 접근성 관련 문의 드립니다. 장지호 2017-02-15

웹의 힘은 그것의 보편성에 있다. 장애에 구애없이 모든 사람이 접근할 수 있는 것이 필수적인 요소이다.

(The power of the Web is in its universality, Access by everyone regardless of disability is an essential aspect.)

팀 버너스 리 경 - 웹의 창시자 (Tim Berners - Lee , W3C Director and inventor of the World Wide Web)

위로가기