본문 바로가기
Blog Tip/Basic

구형 웹 브라우저에서의 블로그 확인하기 (1) IETester

by 카쿠覺 2013. 1. 5.

 

인터넷 익스플로러와 넷스케이프가 주류였던 시절에는 이렇다할 웹표준이라는 개념이 없었습니다. 그로 인해 브라우저간에 서로 보이는 화면의 모습이 다른 경우가 많았기에 웹표준의 필요성이 대두되었고, 그 후 웹표준이 제정되었지만 두 브라우저간에 벌어진 차이는 쉽게 좁혀지지는 않았습니다. 두 브라우저 모드 웹표준에 맞춰 브라우저를 만들어 갔지만, 익스플로러의 경우에는 다소 더디게 움직여서 익스플로러 6까지 웹표준을 잘 지원하지 못했습니다.

 

인터넷 익스플로러6은 2006년 PC월드에서 '전대 미문의 최악의 기술' 25위중 8위에 랭크될 만큼 좋지 않았던 브라우저이지만 그 당시 90%를 상회하는 브라우저 점유율을 보였기에 지금까지도 익스플로러6이 사용되고 있는 경우가 많이 있습니다. 이를 알았는지 마이크로소프트에서도 익스플로러6을 7이나 8,9로 업그레이드를 권장하고, '10년전에 만든 브라우저가 지금도 쓰이고 있습니다'라며 전세계의 IE6의 사용률을 보여주며 0%로 떨어지기를 기원하고도 있습니다. (IE6-Countdown : http://goo.gl/uvvRL)

 

하지만 인터넷 익스플로러6이 아니더라고 해도 상위버전인 9나 10에서 보이는 화면과 7,8의 화면은 다소 차이가 있을 수 있습니다. 그렇다고 '최신 브라우저를 사용하지 않을거라면 이곳에 올 생각은 하지마세요!'라며 쫓아낼 수도 없는 노릇입니다. 어디까지나 방문객이 갑이고 운영하는 입장에서는 을일수밖에 없으니까요. 때문에 이전 브라우저에서 페이지가 어떻게 보이는지 점검을 할 필요가 있습니다.

 

그렇지만 사용하는 운영체제의 버전에 따라서 다운그레이드 할 수 있는 익스플로러 버전에는 한계가 있습니다. 더군다나 다른 버전의 브라우저에서 어떻게 보이는지 확인하려고 설치와 삭제를 매번 반복할수는 없는 노릇입니다. 오늘은 이런 번거로움을 덜어주는 IETester이라는 프로그램에 대해서 살펴보도록 하겠습니다.

 

IETester란?

 

앞서 언급했던대로 모든 방문객이 상위 버전의 브라우저를 사용한다는 기대를 할 수 없으며 그렇기를 강요할 수도 없습니다. 때문에 접근성을 높이기 위해서는 구형의 웹 브라우저를 통해서 접속하는 방문객 역시도 고려해줘야 합니다. 하지만 앞서 언급했듯이 윈도우의 경우에는 익스플로러의 경우 하나의 버전만 설치해서 사용할 수 있으며, 윈도우7이나 8같은 경우는 기본적으로 상위 버전의 익스플로러가 설치되어 나오기 때문에 하위버전의 브라우저를 설치하여 사용할수도 없습니다. (위키피디아 '인터넷 익스플로러' 페이지의 운영 체제 호환부분 참고 : http://goo.gl/xQ7Sq)

 

IETester은 하위 버전의 웹브라우저를 설치하여 사용할 수 없는 경우를 위해 상위 버전의 윈도우를 사용하고 있는 경우에도 구형 브라우저를 설치할 수 있게끔 하여 다양한 버전의 브라우저에서 웹 화면이 어떻게 보이는지 테스트할 수 있는 기능을 제공하고 있습니다. (다만 인터넷 익스플로러에 한해서입니다.)

 

IETester 다운로드 / 설치하기

 

IETester 공식 홈페이지링크로 접속한 후 중앙에 위치하는 다운로드 버튼을 클릭하시면 됩니다.

 

 - 공식홈페이지로 이동하셔서 다운로드를 진행하신 후 설치해주시면 됩니다.

    URL : http://www.my-debugbar.com/wiki/IETester/HomePage

 

 - 설치 과정중에 언어팩 설치부분이 있습니다. 굳이 다 설치하실 필요는 없으니 참고하시길 바랍니다.

 

IETester 사용하기

 

IEtester 메인 화면

 

1. 설치 후 실행하시면 다음과 같은 화면을 보실 수 있습니다. '새 탭'메뉴를 이용하여 원하는 버전의 브라우저에서 웹페이지가 어떻게 출력되는지 확인해볼 수 있습니다. 모든 브라우저 버전에서 어떻게 보이는지를 한번에 확인하기 위해 '여러 IE'를 선택해 진행하겠습니다.

 

한번에 여러 버전의 IE열기 화면입니다.

 

2. 확인하고자 버전을 선택, 주소를 입력합니다.

 

앞선 과정에 따른 결과물로써 여러 버전의 페이지들이 탭으로 나타나 있습니다.

 

3. 상단에 탭으로 출력된것을 확인할 수 있습니다.

 

좌,우측으로 화면을 분할하여 버전간에 보이는 화면을 비교하는 모습입니다.

 

4. 비교하고자 하는 탭을 끌어다 창의 오른쪽으로 보내시면 동시에 두 화면을 볼 수 있습니다. IE7과 IE9에서 보이는 화면을 비교해봤습니다. 내용을 읽는데에는 문제가 없지만 상단과 카테고리 부분에서 많은 차이가 보이네요. 수정을 해야될 것 같습니다 :)

 

궁금하신 점은 답글로 남겨주세요 :D

반응형

댓글