요즘 몇몇 웹사이트들이 다음과 같은 URL패턴을 사용하기 시작했습니다.
http://twitter.com/#!/search/twitter

혹 모르고 지나가고 계신분들을 위해 이 URL에 있는 #!의 의미를 설명드릴까 합니다.

1) #
#은 브라우저가 리로딩 없이 자바스크립트를 불러오기위한 방법입니다. 동시에 URL을 브라우저 히스토리에 남깁니다. 예를들어, http://twitter.com/# 을 방문한다음 http://twitter.com/#!/search/twitter 링크를 클릭하면 이 URL은 (#이 있으므로) 서버로 요청이 전송되지 않습니다. 그러나 URL이 이렇게 change되면 url change에 따른 이벤트 핸들러 자바스크립트를 호출 할 수 있습니다. (예를들어 http://benalman.com/projects/jquery-hashchange-plugin/ 같은 플러그인 사용) 그리고 그 이벤트 핸들러가 AJAX로 요청을 처리하게 합니다.

이렇게 한번 돌아가는게 좋은점은 브라우저의 REFRESH가 없으면서도, URL이 각 동작마다 바뀌고, 그 URL이 브라우저 히스토리에 남는다는 겁니다. 그래서 손쉽게 브라우저의 앞으로, 뒤로를 클릭할 수 있도록 만들어주는 것이죠.

(아시는 분은 아시겠지만 브라우저 BACK/FORWARD가 먹히도록 히스토리에 URL을 남기는 AJAX를 만들어보자는 노력은 5년도 더 전부터 해왔던 것입니다..)

2) #!
문제는 # 은 본래 서버에 요청을 보내는 형태의 URL이 아니기때문에 크롤러가 그 URL을 아무리 서버로 보내봤자 정상적으로 데이터를 크롤할 수 없다는 것입니다. 그리고 이걸 해결하기위한 기법이 바로 #! 이죠.

http://code.google.com/web/ajaxcrawling/docs/getting-started.html를 보시면 알 수 있듯이, 앞서 예의 http://twitter.com/#!/search/twitter는 http://twitter.com/?/search/twitter와 같은 컨텐츠라는 것을 선언하는 의미입니다. 그리고 ? 가 들어간 URL은 아무 문제 없이 서버가 응답을 하게 되고, 따라서 크롤러는 아무 문제 없이 해당 URL을 크롤할 수 있게 되는것이죠.

정리하면,
1) AJAX에서 브라우저 BACK/FORWARD 버튼이 먹게하고,
2) 크롤러에 친절한 웹사이트를 만들기 위해서 만들어진 패턴입니다.