IE 버전별 웹사이트 테스팅 팁

구버전의 인터넷 익스플로러(Internet Explorer)를 사용하는 유저들이 워낙 많기 때문에 웹사이트를 만들때 항상 구버전에 대해서 잘 동작하는지에 대한 체크가 필요하다. Windows XP, Vista 사용자들의 경우 낮은버전의 IE를 사용하는 경우가 많으며 특히 XP의 경우 IE 8 이후의 버전은 설치 자체가 불가능하니 주의가 요구된다.

IE 호환성보기 관련 주의사항

정부사이트를 포함한 바보같은 국내 몇몇 웹사이트에서 호환성 보기 체크를 권고할때가 있기때문에, 많은 사용자들이 시키는대로 체크를 한 후 적용해제하는것을 잊어버리는 경우가 꽤 있는듯 하다. 덕분에 최신버전의 인터넷 익스플로러를 사용하면서도 호환성 보기 모드로 웹브라우저를 사용하다보니 레이아웃이 깨지는 경우가 발생한다. 따라서 HTML5 등 최신기능을 사용했다면 웹페이지 <head>부분에 다음 메타태그를 꼭 넣어주는 것이 좋다.

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

위 메타 태그는 사용자의 IE에 호환성 보기 설정이 되어있더라도, 이를 무시하고 강제로 최신버전으로 렌더링하도록 해준다.

IE 자체 기능을 이용한 버전별 테스팅

ie_dev

인터넷 익스플로러에서 F12키로 개발자도구를 호출하면 위와 같은 화면을 볼 수 있다. 여기서 브라우져 모드를 변경하게되면 상위버전의 IE에서 그보다 낮은 버전들의 IE 렌더링엔진에 대하여 테스트를 하는 것이 가능하다. 주의할 점은 레이아웃 등 대부분은 설정된 버전의 브라우저를 거의 비슷하게 에뮬레이션 하지만, 자바스크립트에 대한 실행 등은 실제 버전과 다른 경우가 많다. 즉, IE9에서 IE7모드를 선택하여 웹페이지를 열었을때 진짜 IE7과 거의 비슷하게 보여지며 스크립트에러는발생하지 않는다. (하지만 진짜 IE7에서 해보면 스크립트에러가 발생하곤 한다.)
따라서 개발자 도구를 너무 믿으면 안되고 꼭 실제버전에서 테스트를 해보는 것이 필요하다.

이를 위해 가상 머신을 이용하여 이전 버전의 실제 윈도우에서 실제 해당 버전의 IE를 직접 사용하여 테스트하는 것이 가장 효율적이다.

가상머신을 이용한 테스팅

버추얼박스(VirtualBox)나 VMware, 패럴럴스(Parallels) 등의 가상머신 유틸리티를 이용하면 손쉬운 테스팅이 가능하다. 아래 링크를 통해 원하는 OS와 IE버전에 맞는 가상머신 이미지를 다운로드 하면 설치과정없이 바로 테스트가 가능한 가상머신을 실행 할 수 있다.

http://www.modern.ie/en-us/virtualization-tools#downloads