Dragonkun in Tistory

요즘의 웹 사이트들은 점점 Ajax 의 사용추세가 늘어나고 있습니다.
하지만 사실 Ajax 에는 치명적인 단점이 있습니다.
바로 웹 접근성이죠.

Ajax 가 처음 등장했을 때 문제로 제기된 큰 문제가 몇가지가 있었는데..
그 중 하나는 뒤로 가기 버튼이었고, 다른 하나가 이 접근성에 해당하는 문제였습니다.

물론 모든 Ajax가 웹 접근성을 해치는 것은 아닙니다.
Ajax 를 사용하더라도 접근성을 해치지 않는 방법들이 여럿 고안되었으니까요.
하지만 국내에서 사용되고 있는 Ajax 의 대부분은 Javascript(또는 기타 클라이언트 스크립트)에만 의존하는 경향이 있습니다.

<a href="#" onclick="sampleFunction();"> 는 이제 그만.

그 중 가장 간단히 생각할 수 있는 것이 <a href="#" onclick="javascript:"> 등으로 시작하는 코드입니다.
하지만, Javascript 가 제대로 동작할 수 없는 환경에선 무용지물입니다. 그럼 어떻게 해야하는가..

<a href="대체 URL" onclick="return !sampleFunction();">

여기서 포인트는 두 개입니다. 대체 URL 과 sampleFunction() 앞의 ! 죠.
대체 URL 은 말 그대로 Javascript 가 동작하지 않을 때 이동해야할 페이지입니다.
물론 해당 동작에 대한 대체 페이지가 마련되어야 겠죠.

그러면 클릭할 때, onclick 이 실행되는게 아니라 대체 URL로 이동해버리는 것이 아니냐..라고 생각하시는 분들이 계실텐데..
!(느낌표) 는 그것을 막기 위해 고려된 것입니다.
여기서 조건은 sampleFuntion 은 xmlHTTPRequest 가 성공하면 True, 실패하면 False 를 리턴하도록 구현되어야합니다.

만약 sampleFunction 이 동작을 성공하면 True가 리턴되고, <a> 태그의 동작은 return false; 가 되어 실제로 페이지 이동을 하지않게 됩니다.