Page 12 -

과거에는 데스크톱과 모바일에 대응하기 위해 웹 사이트를 기기에 맞춰 따로 제작했습니다.
최근에는 거의 볼 수 없지만 웹 사이트 주소에 m.xxx.com처럼 앞에 m이 들어간 주소를 보

았다면 그 웹 사이트가 바로 모바일 버전용 웹 사이트입니다 * .

적응형 반응형 레이아웃이 등장하면서 데스크톱과 모바일 양쪽에 모두 대응하는 웹 사이트
제작이 가능해졌습니다. 덕분에 사용자는 가로 스크롤 없이 어느 기기에서나 대응하는 웹

사이트 화면을 편안하게 볼 수 있게 되었습니다. 개발자 역시 기기에 맞춰 웹 사이트를 별도
로 제작할 필요가 없어지면서 개발 비용을 줄일 수 있게 되었습니다(대신 기획자와 디자이

너는 그만큼 더 깊게 고민해야 합니다).

3 크로스 브라우징

사용자마다 웹 사이트에 접속하는 웹 브라우저가 다를 수 있습니다. 브라우저 종류에는 인
터넷 익스플로러(Internet Explorer, 줄여서 IE라고 함), 크롬(Chrome), 사파리(Safari), 파이
어폭스(Firefox), 오페라(Opera) 등이 있습니다. 또한 같은 브라우저라 해도 버전이 다를 수

있습니다. 인터넷 익스플로러만 하더라도 익스플로러 1~11, 익스플로러 엣지까지 다양한
버전이 있습니다.

사용자가 어느 브라우저의 어떤 버전으로 접속할지 알 수 없으므로 개발자는 웹 사이트를

다양한 브라우저와 버전에 대응할 수 있도록 제작해야 합니다. 이를 크로스 브라우징 작업
이라고 합니다.

크로스 브라우징은 브라우저의 종류와 버전에 상관없이 웹 사이트가 동일하게 보이는 것

은 물론 정상으로 작동되게끔 하는 기법입니다. 원래는 브라우저 종류마다 HTML 언어를
처리하는 방식이 다르기 때문에 브라우저 화면에는 조금씩 다르게 나타납니다. 또한 일부

HTML 언어는 하위 버전의 브라우저(예를 들어 익스플로러 6, 7 등)에서 적용되지 않는 경
우도 있습니다.

* 참고: 네이버 모바일 웹 사이트(https://m.naver.com/)

18 모두의 HTML5 & CSS3