크로스 브라우징?
웹페이지 제작 시에 어느 브라우저에서도 이상없이 작동되게 하는 것이다. 이전 브라우저 동작 원리 글에서 말한 렌더링 엔진에 따라 같은 페이지라도 다르게 나타날 수 있기 때문이다.
이것을 신경쓰지 않고 작업하면 아래와 같은 문제점들이 있을 수 있다.
- 작동되지 않는 HTML5, JS 코드가 존재
- 해석하지 못하는 CSS 코드가 존재
- 브라우저 버그들이 존재
- 브라우저마다 자체적인 CSS 스타일 존재
- IE를 버전마다 크로스 브라우징하는 이유
보통 브라우저는 최신 버전으로 자동 업데이트가 되지만 IE는 그렇지 않다.
IE는 사용자가 직접 업데이트를 진행해야 하며, 윈도우 버전에 따라 최대 버전이 한정되어 있다.
대응 방법?
- 점유율 순서대로
타켓층이 가장 많이 사용하는 브라우저를 가장 먼저 고려해야 할 것이다. 현재 1.크롬(71.7%) 2.Edge(16.13%) 3.Whale(5.99%) 정도이다.(한국에서)
- 작업 방법
- css 초기화 작업 - 브라우저마다 다른 css 스타일을 모두 같게 초기화한다.
- 여러 외부 사이트를 이용해 사용할 기능에 대해 각 브라우저에 대한 호환성을 체크한다.
- 핵(Hack) - css에서 특수문자를 넣어서 다른 브라우저들은 인식하지 못하지만 특정 IE 버전에만 인식되도록 하는 방법이다. 유지보수의 어려움으로 인해 추천되지 않는 방법이다.
- IE용 주석을 이용하는 방법 - html 문서 내에서 주석을 이용하여 구별한다.
- 메타 태그를 이용하기 - <head>태그의 <meta>태그에 삽입해 원하는 모드로 랜더링하게 한다.
백엔드 개발자