IE 6 ... <-- 이거 정말 어떻게 안되나? 정말 짜증 난다...

웹개발자들이 가장 큰 고민은 레이아웃을 잡을 때입니다.
특히 요즘 같이 브라우저 시장이 혼탁(?) 해 지면 웹개발자는 정말 많이 당황하게 됩니다.
한국에서는 아직도 IE 6 가 굳건히 버티고 있어서, 웹표준으로 개발을 한다고 해도 많은 에러가 발생하게 됩니다.
오죽하면 웹표준을 다루는 책에서도 보면 항상 IE 핵이니, 버그 잡는 법등을 소개하는 것을 보면, 모든 사용자들이 IE7 으로 빨리 전환했으면 하는 바램도 있습니다.

특히 IE6 는 png 파일들을 전혀 표현하지 못합니다.
아니 엄밀하게 말하면 png24 파일을 정확하게 표현하지 못합니다.
png24 파일이 같은 gif 파일보다 파일의 용량은 상대적으로 크지만, 투명처리에서는 gif 파일을 능가하기 때문에 요즘 제작되는 사이트들은 png 파일을 자주 쓰게 됩니다. 아니 자주라기 보단, 전체 사이트에서 png 로 표현하면 아주 깔끔하게 표시되는 곳에 쓰이고 있다고 보시면 되겠지요. ^^
png24 파일은 IE7 이나 기타 브라우저에서는 <img src="imgs/result.png"> 만 하더라도 제대로 표현되는 것에 비해 IE 6에서는 약간의 요령이 필요하게 되는 것입니다.


처음 CSS 파일 내부에
.png24 {
    tmp:expression(setPng24(this));
}

이런 정규식으로 표현해 주고

function setPng24(obj) {
    obj.width=obj.height=1;
    obj.className=obj.className.replace(/\bpng24\b/i,'');
    obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image'); "
    obj.src='about:blank;'; 
    return '';
}


자바스크립에는 위와 같은 fuction 을 추가해 준 후

<img src="imgs/result.png" class="png24" />
 
이렇게 처리해야 제대로운 png 24파일 보이게 됩니다.

이것만 해도 얼마나 많은 수고가 필요한지 원..
특히 재미 있는 것은 위의 자바스크립도
ASP에서와 PHP 에서는 조금씩 틀리게 작동을 합니다.

위의 표현식은 ASP 방식이며 PHP 방식은 아래와 같습니다.

function setPng24(obj) {
    obj.width=obj.height=1;
    obj.className=obj.className.replace(/\bpng24\b/i,'');
    obj.style.filter = progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+ obj.src +',sizingMethod='image');
    obj.src=''about:blank;'; 
    return '';
}


차이를 느끼시나요??

웹서버도 어떤 웹서버를 사용하는가에 따른 표현 방식도 조금은 차이가 난다는 것도 참조하시면 좋겠네요.

웹개발자가 조금이라도 편하게 될려면 IE7 의 시장 점유율이 80%을 넘거나 Firefox 가 전체 시장을 장악해 버리는 것도 하나의 방법인데....
Firefox 가 시장을 전부 장악하면 어떤 브라우저를 사용하던, 어떤 운영체제를 사용하던 거의 대부분의 사이트들이 제대로 보일텐데... 왜 한국에서만은 Firefox 의 성장이 더디고, 많은 사이트에서 지원을 하지 않는건지 모르겠네요.  
물론 Firefox 도 웹표준에 100% 적합하진 않습니다. 완벽한 웹표준 브라우저는 아니지요.
하지만 IE6는 정말 대책이 없습니다.