크로스 브라우징이란?

'크로스 브라우징' 이라는 용어가 나온지도 10년이 훌쩍 넘은 듯 하다. 그런데 10년이 넘도록 크로스 브라우징에 대한 이해는 여전히 잘못된 면모가 자꾸 보인다.

크로스 브라우징은 동일성을 의미하지 않는다.

결론부터 이야기 해서 대다수의 가지고 있는 오해는 바로 '동일성'이다.
크로스 브라우징을 이야기 할 때 종종 볼 수 있는 글이 '모든 브라우저에서 똑같이 보이게'라고 하는 것인데 당장 네이버에서 크로스 브라우징을 검색해만 보아도 이러한 글을 쉽게 접할 수 있다. 더구나 하코사에서는 심심치 않게 이것을 정의(definition)로 말하고 받아들이는 일이 빈번하게 이루어지고 있고 덕분에 잘못된 정보가 해를 거듭해도 정정될 기미가 보이지 않는다.

더구나 고용노동부에서 제공하는 한국직업사전에 조차 크로스 브라우징에 대해 '어떤 웹 브라우저를 써도 화면이 똑같이 나오고'라고 기재되어 있으니 기가 찰 노릇이다.

크로스 브라우징은 동등성(등가성)을 의미한다.

크로스 브라우징은 대체 어디에서 시작된 용어이고, 대체 어떤 의미를 가진 용어일까?

우선 한국어로 된 크로스 브라우징에 대해 정의되어 있는 공신력이 있다고 추측 가능한(?) 문서를 한 번 찾아봤다.

2005년에 Mozilla 한국 커뮤니티에 올라온, 한국소프트웨어진흥원 공개SW지원센터에서 발간한 것으로 보이는 'CSS Browsing 가이드'라는 문서가 있다. (그리고 저자는 현재 AWS 테크 에반젤리스트로 계시는 윤석찬 님이다.)

이 문서에서 역시

웹 페이지의 상호 호환성(Cross Browsing) 구축에 대해 이야기하면 기본적인 오해가 있다. 그것은 바로 이것이 모든 웹 브라우저에서 100% 똑같이 보이도록 만드는 것이라는 생각이다.작게는 1990년대 후반 Netscape사와 Microsoft사의 Browser War 기간 동안 일어난 브라우저의 비호환성을 억지로 끼워 맞추려는 기법 정도로 치부되는 것이다.

라고 언급하고 있다. 무튼 여기에서는 크로스 브라우징에 대해서 다음과 같이 설명하고 있다.

Cross Browsing이란 적어도 표준 웹기술을 채용하여 다른 기종 혹은 플랫폼에 따라 달리 구현되는 기술을 비슷하게 만듦과 동시에 어느 한쪽에 최적화되어 치우지지 않도록 공통 요소를 사용하여 웹 페이지를 제작하는 기법을 말하는 것이다. 또한, 지원할 수 없는 다른 웹 브라우저를 위한 장치를 구현하여 모든 웹 브라우저 사용자가 방문했을 때 정보로서의 소외감을 느끼지 않도록 하는 방법론적 가이드를 의미하는 것이다.

크로스 브라우징이라는 용어가 정확히 언제부터 시작되었는지, 어떤 의미로 시작되었는지는 사실 명확한 시점을 찾을 수 없었다. 다만, 시간을 거슬러 올라가다보니 'viewable with any browser'라는 캠페인 사이트에 도달했다. (이 사이트의 도메인은 1997년부터 등록된 것으로 확인 된다.) 추측컨대 이 캠페인이 크로스 브라우징의 시작점이지 아닐까 싶다. 웹 표준 준수 운동을 Web Standards Project에서 확인해 볼 수 있음같이 말이다.

해당 문서의 일부 내용을 발췌해보면

어떤 페이지는 일부 브라우저들에서 다른 브라우저에서 보다 더 좋아 보일 수 있지만, 어떤 브라우저로도 읽을 수 있게 되어야 합니다. 나는 적절한 방법이고 사용할 이유가 충분한 경우에만 브라우저 별 태그를 사용하려고 노력하고, 이미지 맵, 프레임, 자바 등과 같은 일부 브라우저들만이 지원하는 태그를 사용한 것이 이 경우에 해당합니다. 그것들을 지원하지 않는 브라우저들에 대해서는 HTML로 사용할 수 있는 우아한 낮춤을 활용하거나 대안을 제공하는데 최선을 다했습니다.

라고 되어 있다.

마지막으로는 많은 웹 개발자들이 참조하고 있는 MDN 사이트에서는 어떻게 설명하는지를 보자.

다음 내용은 MDN 문서 중 What is cross browser testing?에서 발췌했다.

여기에서 몇 가지 용어를 설명해야 합니다. 우선, 사이트 "크로스 브라우저 작업"에 대해 이야기 할때 다른 브라우저들 사이에서 수용 가능한 사용자 경험을 제공해야 한다고 말하고 있습니다. 어떤 방식으로든 핵심 기능에 접근이 가능하기만 하면, 모든 브라우저에서 정확히 동일한 경험을 제공하지 않는 것은 잠재적으로 괜찮습니다. 최신 브라우저(mordern browsers)에서는 애니메이션, 3D, 반짝이는 것들을 얻을 수 있는 반면 구형 브라우저에서는 동일한 정보를 나타내는 평면 그래픽을 얻을 수 있습니다.

세 문서 어디에도 '똑같이 보이게' 구현한다거나 그 비슷한 표현은 존재하지 않고, 세 문서 모두가 동일하게 이야기하는 것은 결국 동등한 수준의 정보, 기능 접근에 있다.

그리고 google에서 cross browser를 검색해보면 'cross browser'라는 용어 뒤에 'compatible' 혹은 'compatibility'라는 단어가 뒤따라오는 것을 쉽게 발견할 수 있는데, 결국 'cross browsing'이라고 하는 것은 '호환성'이라는 성질(?)을 가지고 있고 호환성은 똑같음을 이야기 하지 않는다는 것은 누구나 다 알고 있을 거라 생각한다.

디자이너의 의도를 최대한 살리는 것은 당연히 좋다. 하지만 의도를 살리기 위해 어거지성으로 맞추는 것이 과연 좋은 것이라 할 수 있을까?

오래전 CSS3의 이런 저런 효과들이 짠~ 하고 나타났을 때, 이를 구현하기 위해 PIE.htc 같은 것들을 이용하여 우겨넣었다가 구형 브라우저에서 사이트 자체의 퍼포먼스가 아예 바닥을 치는 경우가 있었다. 모든 브라우저에서 똑같이 보여야 한다는 잘못된 생각으로 인해 정작 중요한 것이 무엇인지를 놓치는 결과를 만든 꼴이다.

개인적인 생각이지만 정말로 크로스 브라우징을 잘 하는 사람은 모든 브라우저에서 똑같은 수준으로 보이고 동작하게 하는 사람이 아니라, 특정 브라우저에서만 지원되는 기능을 구현하기 위한 별도의 라이브러리 등을 주입하지 않고도 최대한의 호환성을 제공함을 통해 어떤 브라우저에서 접근하든 정보와 기능을 충분히 제공할 수 있도록 점진적 향상을 이끌어 낼 수 있는 사람이 아닐까?

번외 — 어디까지 맞춰야할까?

글을 써내려 가다가 문득 기억에서 떠올라 예정에 없던 부분으로 추가로 적어본다.

종종 하코사에서는 크로스 브라우징을 어디까지 해야 하는가에 대한 질문이 올라오고 대다수 각자 생각의 기준대로 어디까지 맞추라는 식의 답변을 보게된다.

사실 질문의 대상도 잘못되었고 답변도 잘못되었다고 본다. 개인 토이 프로젝트나 포트폴리오 같은 것은 제외하고.

일단, 크로스 브라우징의 범위는 회사가 서비스하려는 대상에 따라 달라져야 하는 것이 보통이다.
많은 부분 서비스 이용자 통계는 고려하지 않고 단지 브라우저 점유율만 가지고 이야기하는 경우를 쉽게 볼 수 있는데, 만일 IE 8, 9 사용자로부터의 매출이 전체 매출의 20%를 차지한다고 했을 때, 스탯 카운터의 브라우저 점유율 같은 통계를 기준으로 혹은 커뮤니티의 답변에 의존해서 아무 말 없이 IE 10으로만 맞춰서 개발 했을 경우, 20% 매출이 순식간에 사라지는 상황을 만들 수 있다. (그리고 욕을 배불리 먹고 시말서를 쓰고 다시 맞추느라 야근 지옥에 들어가겠지...)

회사에서 업무를 하는데 어느 브라우저까지 지원해야 하는가는 너무나 당연하게 회사에 물어봐야 하는 것이고, 각 관계자들과 협의가 진행되어야 하는 부분이다. 이건 집단 지성으로 해결할 문제가 아닌거다.

아마 최신 브라우저에만 맞추고 싶은 욕구는 모든 프론트엔드를 개발하는 사람들의 희망사항일 것이다. 하지만 그건 어디까지나 개발자의 희망사항일 뿐이고, 결국의 범위는 만드는 서비스의 사용자에 달려있다.
많은 이들이 이 점을 간과하고 있는 것처럼 보이는데, 브라우저 지원 범위를 임의로 축소시켰다가 발생 될 수 있는 매출의 영향에 대해 책임 질 수 있다고 한다면 원하는 대로 해도 좋을 듯 하다.