깔끔함, 참을수 없는 유혹

anchor, button 등의 태그를 클릭하게 되면 바깥 라인이 찍혀 보인다. 이 테두리는 마우스 사용이 제한된 환경에서 사이트를 탐색하는데 탁월한 역할을 수행한다. 나 역시 마우스를 사용하지만 테두리가 있는 덕에 조금은 안정적인 느낌을 받는다. 그런데 웹 디자인을 하면서 테두리를 싫어하는 사람들을 종종 본적이 있다. 사이트의 미관을 헤치거나 깔끔한 느낌을 더 하기 위한 이유인 것 같다.

Javascript

onfocus="this.blur();"
이 스크립트가 들어간 요소는 키보드 탐색이 완전히 불가능하다. 요소를 선택(focus)하는 순간 해제(blur) 행동을 취하기 때문이다. 스크립트를 통해 테두리를 숨기는 방법은 최악의 접근성을 자랑한다.

CSS

스타일 서식을 사용하여 바깥 라인을 숨기는 방법이다. 한때 나도 즐겨쓰던 방법으로 접근성을 헤치지 않는다고 생각했었다. 거치적거리는 테두리를 없애고 접근성도 지키고 일석이조 아닌가? 하지만 실상은 그렇지 않더라.

[질문]

css를 이용해서 포커스 테두리를 보이지 않게 할 수 있습니다.

이럴 경우 접근성에 좋지 않은 영향이 있을 수 있나요?

스크립트를 사용하지 않은 경우입니다.



[답변]

CSS든 스크립트든 포커스 테두리를 보이지 않게 하는 것 자체가 접근성에 좋지 않습니다.
상지 장애 등의 이유로 키보드만을 이용해 컴퓨팅을 하는 경우 포커스가 현재 사용 중인 기능을 나타내주기 때문입니다.

^{포커스 영역 테두리 유무}