ILMOL.COM

드디어 오늘 사파리의 엔진인 웹킷이 최근 공개된 Acid3 테스트를 통과하였습니다. 이번 통과와 함께 서로 밀고 당기고 하는 에피소드가 있었는데요. 최근 몇일간 Webkit이 순식간에 Acid3 테스트 통과에 높은 점수를 보이며 수일안에 100%를 도달하겠다는 야망이 보이는듯 했습니다. 그 순간 갑자기 나타난 오페라. 어제 비공개 코어엔진이 100% 통과했다는 소식을 블로그를 통해 전달 하면서 웹킷 개발팀을 놀라게 하는 해프닝이 있었습니다. 그에 놀란 웹킷팀은 Acid3 에 약간의 버그가 있다는 점을 지적 Ian Hicks 가 바로 수정에 착수, 완료가 되면서 웹킷이 오늘 자신들이 첫번째 100% 통과한 공개버전을 내 놓았다는 뉴스를 내보내었습니다.

오페라는 다음주중에 “최초로 Acid3를 통과했다는” WinGogi Desktop build 를 공개한다고 밝혔고, Webkit팀은 자신들의 엔진이 “최초로 Acid3를 통과한 공개버전이다” 라는 비슷하지만 다른 뉴스를 보내고 있습니다. 오페라는 비공개 엔진이 통과했으므로 인증샷으로 설득하려 하며 사파리는 당당히 공개버전이 통과했다며 군중을 설득하려 하고 있습니다. 재밌죠 ^^

With r31342 WebKit has become the first publicly available rendering engine to achieve 100/100 on Acid3.

일단 어찌 판명될지는 두고봐야겠지만 일단 Acid3를 통과한 오페라와 사파리 엔진들 축하합니다.

여담. 어제 자기전에 모질라 10주년 축하 샷을 찍었는데 영 폼이 안나는군요. 졸리긴 졸렸나 봅니다. 저건또 머라 쓴건지;;

“10주년 축하합니다!” 앞에다가 “자랑스럽습니다. 당신의” 를 넣고 “그리고 감사합니다” 를 뒤에 넣는다고 css selector 넣고 멀 끄적였는지 원. 하고보니 촌스러워요. ㅡㅡ; 공개사과 합니다.;;

여담2. 요즘 시간 나는데로 일모리네를 업데이트 중입니다. 지금 한 RC1 정도밖에 안된거 같네요. 접근성 꽝, CSS는 정리도 잘 안되서 크키만 하고 꽝, 오늘중으로 guestbook 정도는 손보고 열으려 합니다. 웹표준이란? 이 글을 쓰다보니 한 글로 쓰기에 좀 무리인거 같아서 아예 위키식으로 방대하게 작업하려 합니다. 화이팅.

사파리 브라우저의 엔진인 Webkit 의 최근 Nightly 버전이 Acid 3 테스트를 92% 통과했습니다. 곧 출시될거라 믿고 있는 사파리 3.1 베타는 70% 정도 이며 오페라 9.5 베타는 65%, 그리고 인터넷익스플로러 8 베타는 17% 입니다. Webkit의 Acid3와 관련된 버그 업데이트나 각각의 브라우저들의 Acid3 통과에 대한 업데이트를 꾸준히 테이블에 올리는 곳들도 알아두면 좋을듯 합니다.

It’s true that acid tests like this are not thorough standards compliance tests, and often enter the realm of very obscure standards details. But Acid 3 tests a lot of technologies that matter to everyday web development.

이러한 Acid 테스트가 표준의 절대적인 기준이 되는것은 아니지만 실질적인 웹 개발에 필요한 기술을 테스트 하고있다.(그러므로 웹킷은 이것을 지키기로 한다). - Webkit Blog

여담이지만 인터넷익스플로러의 css 버그들에 관한 업데이트가 css-discussion 에 업데이트 되고 있습니다. - 현재 다운되었군요;;

예전 글들을 돌아보니 ‘IE는 종양이다‘ 에서부터 ‘이번 IE7 비공개 스샷을 보니 완전 사파리더라‘ 까지 일모리네서 IE가 많이 맞기는 했더군요. 요즘 부단히 브라우저에 많은 노력을 기울이는 마소를 보며 가끔 참 고민 많겠구나라는 걱정의 배려모드까지 가곤 합니다. 아무튼 결론이 어찌되었든 저희에게 해야할 일들은 많습니다. IE팀, 고마우어요.

예전에 한창 IE 파해치기 모드이었을때에 IE6를 돌리며 동시에 IE 5.5를 다운받아 사용할수 있는 사이트를 소개 했었는데 이젠 링크도 깨졌고 약 3년전의 이야기라 그동안 설마 Microsoft 의 OS 를 가동시키시며 포멧을 안하신 분들이 그리 많지 않을거라 생각하며 재포스팅 하기로 했습니다. 이번엔 설치 프로그램으로 돌아가더군요. 해서 오래전 Internet Explorer 3.0 버전부터 ^^;;; IE4.01, IE5.01, IE5.5, IE6.0 까지 5개의 버전을 설치하여 최근 인증확인없이 IE7, IE8베타 설치가 가능해 지면서 7개의 버전들을 동시에 구동할수 있게 되었습니다. 물론 이제 5.5 이하 버전은 거의 사라졌다고 봐도 되지만 가끔 5.5 버전까지의 크로스 브라우징을 원하는 곳들이 있기에 깔아두면 좋을듯 합니다.

페이지가 영어이긴 하지만 용기를 내시고 TredoSoft 포스팅 마지막 부분의 “Download Multiple IE installer” (10.3MB) 을 클릭하시면 됩니다.

그러고 보니 2005년 당시에는 사파리의 윈도우 버전은 꿈도 못꾸었기 때문에 사이트가 사파리에서 어떻게 보이는지 스크린샷으로 보여주는 사이트들이 인기가 있곤 했습니다. 불여우는 대망의 1.0으로(2004 11월) 뉴욕타임즈 1면에 전면 광고를 하는 기염을 토하며 시작했었고 말이죠. Opera 는 무료이긴 했으나 작은 광고가 붙어 나왔기에 무광고 브라우저를 위해 블로거들이 오페라 베너를 달아 일정다운로드 수가 넘어가도록 했었죠 ^^;;; 기억에 lunamoth 님께서 성공하셨던거 같은… 이루마를 듣고 있으니 센티멘탈해져버렸습니다 ㅡㅡ;;;

아무튼 이제 편하게 IE7 / IE8 베타 까시고 IE6 이하 버전들까지 한 컴퓨터에서 돌리시며 즐거운(고통스러운) 크로스브라우징의 세계를 즐기시기 바랍니다. 물론 막히시는 부분은 일모리네 혹은 CSS Design Korea 등의 도움을 절대 받으시는 것도 정신 건강에 도움이 됩니다. 담배는 몸에 해롭습니다………..

오늘도 밤을 새시는 여러 많은 분들 힘내세요;;;;;;;;;

아시다시피 IE8의 엔진이 ACID2 를 통과하였다는 발표가 사방에 퍼졌던때를 기억하실 것입니다. 그리고 오늘 IE8 을 다운받으신후 ACID2 테스팅 사이트에서 깨져있는 Smily Face 를 보셨을 것이구요. 이러한 가운데 왜 IE8이 처음과는 다르게 깨져있는가를 설명하는 IE블로그를 보고 제가 설명만 하기 보다는 이미 상당한 표준인식이 자리잡아가고 있는 여러분들에게 번역하고자 합니다.

자려했는데 오늘밤에 고쳐야할 친한 동생의 컴퓨터가 있는지라 포멧하면서 기다리는 동안 키보드를 두드리고 있습니다.. ㅠㅠ

원문 IEblog: why isn’t ie8 passing acid2?
왜 ie8이 acid2 를 통과하지 않는걸까?

비록 IE8 베타1이 ACID2를 통과한다 했지만 몇몇분들은 위의 이미지처럼 깨져있는것을 보셨을 것입니다. 해서 약간의 설명이 필요하다 생각했습니다. IE8 은 ACID2 테스트를 http://www.webstandards.org/files/acid2/test.html 사이트에서 통과하였습니다. (참고로 이곳은 acid2 테스팅을 위한 인기높은 사이트입니다. 현재 접속이 힘드실수 있습니다.) 웹에는 이 acid2 테스트가 가능한 여러 사이트들이 있으며 제가 최근 본 acid2 서비스 사이트는 http://acid2.acidtests.org 입니다.

IE8 은 Active X 컨트롤의 크로스 도메인 보안 확인 기능으로 인해 ACID2의 “복사본” 사이트의 테스트를 통과하지 못했습니다. IE가 Object 태그의 HTML 컨텐츠를 자체적으로 돌리지 않고 IE의 렌더링 엔진을 Active X 처럼 구동하여 HTML 컨텐츠를 보여주므로 동일한 크로스 도메인 보안 확인또한 적용(다르게 해석하면 거치게) 되는 것입니다.

그렇다면 어떻게 ACIDTEST.ORG 카피(역: 카피라고 자꾸 강조하는군요) 가 OBJECT fallback 을 어떻게 이해하여 스마일얼굴의 눈을 처리하는지 보겠습니다.

<object data=”data:application/x-unknown,ERROR”>
<object data=”http://www.damowmow.com/404/” type=”text/html”>
<object data=”data:*the eyes DATAURI* …>
</object>
</object>

IE 는 위의 하이라이트된 라인 부분의 OBJECT fallback 과정을 멈추게 됩니다. 이 일에 참여했던 팀과 나는 이것이 바른 작동이라 결정내렸으며 이유는 이 크로스 도메인 컨텐트가 404 HTTP 에러코드의 실패한 리소스 인지 혹은 다른 표준의 한 부분이 실패를 알리는 부분인지 알기 위해서 네비게이션을 허락해야하기 때문이죠. 호환성을 유지하며 기본적으로 보안을 유지하기 위해서 원래 웹저자들이 원하지 않았을지도 모르는 fallback 물러서는걸 발동하고 싶지 않았습니다. 제일 안전한 해결책과 함께 시작했으며 이제 앞으로 이 부분을 미래 베타를 위해 안전하게 조금 느슨하게 하는 것을 고려하고 있습니다.

이제 www.webstandards.org 가 제공하는 공식 ACID2 테스트 페이지를 보겠습니다.

<object data=”data:application/x-unknown,ERROR”>
<object data=”http://www.webstandards.org/404/” type=”text/html”>
<object data=”data:*the eyes DATAURI *>
</object>
</object>

보시다시피 (역: ACID2 를 통과했을때의) 테스트 도메인이 같으며 고로 모든것이 잘 돌아갑니다. 아시다시피 http://webstandards.org (앞에 www 가 없음을 주목) 라는 네비게이션을 허락합니다. 이것 또한 크로스 도메인 접근 이죠. www.webstandards.org != webstandards.org 처럼말입니다. 이것 또한 ACID2 테스트가 맨위의 그림처럼 깨어지게 보이게 할 것입니다. 그러므로 테스트 시에는 www.webstandards.org 를 타입하기 바랍니다.

Phil Nachreiner
Internet Explorer Developer

음….

번역이 잘 되었나 모르겠습니다. 일단 ie8 이 Active X 컨트롤의 크로스도메인 보안 체크를 하므로 www.webstandards.org 라는 공식적인 페이지에서만 smily face 가 완성이 된다는 해명으로 볼수 있겠네요.

이 부분에 대한 Ian Hickson(acid2와 acid3 개발) 의견입니다.

But if it’s failing — for whatever reason, cross-domain or not — you should fallback. Hence the current behaviour is still a bug. :-)

(BTW why would it be a cross-domain problem? This should be exactly the same as an iframe, which can cross domains fine.)

하지만 일단 (acid2 테스트를) 실패했다 어떠한 이유에서건 크로스 도메인이든 아니든 말이다. 그러므로 현재 동작상태는 버그이다. :-)

(헌데 그것이 왜 크로스 도메인 문제인가? 이건 크로스도메인이 가능한 iframe과 동일한 것이다.)

역시 루머아닌 루머가 맞았습니다. 베타1 버전이 출시되었군요. Server 2003, Vista, XP SP2 버전까지 나와있습니다. 아시다시피 베타 버전이라는 점 유념하시구요. 다운로드시 마이크로소프트 다운로드 센터의 명시를 보니 이렇게 설명되어 있습니다.

이 베타는 모든 이들에게 오픈이지만 특별히 개발자들과 디자이너들이 새 툴과 새 레이아웃 엔진등을 테스트 하는 것에 있다. 웹사이트를 개발하지 않을 시에는 Emulate IE7 버튼을 눌러 IE7 에서 서핑하듯 돌아올수 있다.

아마도 IE7 엔진을 담고있는 이득을 여기서 보는듯 하군요. 아무튼 오늘 블로고스피어 뿐만 아니라 수많은 개발자들, 유저들 가운데서 IE8 이야기로 후끈후끈 할듯 보입니다. 특히 IE8 의 표준모드는 ACID2 테스트를 통과하지 못하는 지라 못내 아쉬움이 많이 남긴 합니다. 그래도 많은 발전이라고 기쁘게 받아들이며 일단 이곳저곳을 테스팅 중입니다.

덧: 현재 제 사이트도 그러하지만 ^^ 많은 사이트들이 form 부분에서 상당수 깨지고 있습니다. 혹시나 공통적인 해결점이 있다면 알리도록 하겠습니다.

덧2: 버전지정을 통한 대충 대충 어느정도 해결점을 찾음.

버전타게팅을 사용한 편법

이 버전지정 테크닉은 아마도 빠르게 번질 “IE8에서 사이트가 깨지는것을 해결하는” 편볍 해결책으로 나올듯 싶습니다. 여러가지 테스트를 해본 결과 이전에 말씀드린 버전타게팅이 제대로 작동하는듯 보입니다. 다시말해서 meta 태그를 사용하여 ie7 렌더링 엔진을 사용하도록 하면서 ie8 표준모드를 사용치 않도록 함으로 해서 깨어진 ie8 의 사이트를 제대로 보이게 하는 것이죠.. 특히나 대형 커뮤니티 사이트나 포털등은 지금이라도 ie8에서 깨지는 것을 일단은 막고 차후에 고치는 방향으로 가는것도 좋다고 생각이 됩니다. 편볍 해결법은 이렇습니다.

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

이 코드를 해더에 삽입을 하면 되지만, 주의해야할 부분은 ie7 코멘트핵을 쓰셨다면 ie8 핵을 지정한후 ie7 스타일시트를 그대로 옮겨와야 합니다. 여러 테스팅을 해본결과 ie7 렌더링을 하게되지만 브라우저는 ie8 이므로 ie8 코멘트핵을 이해하더군요.

<!--[if IE 7]>
  <link type="text/css" rel="stylesheet" href="styleie7.css" />
 <![endif]-->
 <!--[if IE 8]>
  <link type="text/css" rel="stylesheet" href="styleie7.css" />
 <![endif]-->

혹은 ie 핵을 잘 쓰시는 분이라면 “ie7 과 그 이상” 이라는 핵을 설정해 주면 위와 같은 효과를 내겠죠. [if IE 7] 을 [if gte IE 7] 으로 바꿔주면 되습니다.

<!--[if gte IE 7]>
  <link type="text/css" rel="stylesheet" href="styleie7.css" />
 <![endif]-->

일단 웹의 진보적인 성격과 웹표준의 발전으로 볼때에 한 버전에만 머무는 버전지정은 그다지 추천하고 싶지는 않지만 일단은 IE8이 베타버전인만큼 버전지정을 통하여 IE8 표준모드에 맞는 사이트가 개발될때까지 IE7 렌더링으로 채택하는 것이 바른 방향이라고 생각됩니다. 그저 버전지정으로 머무는것보다는 앞으로 꾸준히 발전할 익스플로러를 보면서 표준을 채택한 웹개발의 방향을 바라보는것이 맞다고 생각됩니다.

새로운 기능들

마이크로소프트는 웹사이트를 통하여 새로운 기능들을 5가지로 소개하고 있습니다.

“Activities”

“Activities 는 어느 웹페이지에서든지 빠르게 필요한 서비스를 사용할수 있도록 돕는 서비스 입니다.” 라고 말하고 있네요.

2가지 종류의 “활동”을 보통 담당하게 될텐데 첫번째는 “찾기” 류의 기능으로 어떠한 정보를 찾는것을 말합니다. 웹사이트의 주소를 보고 곧바로 지도에서 찾도록 하던지 구글에서 직접 정보를 찾아서 보여주는 것이죠. 두번째인 “보내기” 부분은 웹사이트의 컨텐츠를 어디론가 보내는 역할입니다. 예를들어 자신의 블로그나 이메일로 보낸다거나 하는 기능이겠죠.

특징은 유저들이 직접 “Activities” 를 지원하는 서비스들을 선택하여 사용할수 있다는 것입니다. 아마 네이버도 들어가겠죠?

WebSlices

Slice 가 ‘자르다’의 뜻인만큼 웹의 어느 필요한 부분을 자르다 라는 의미를 내포하고 있는거 같습니다. 이는 피드 리더기를 브라우저에 실용화하여 적용시킨듯 하군요. 즐겨찾기 기능처럼 피드를 WebSlice 로 툴바부분에 선택해 놓으면 피드가 업데이트 될때마다 사이트에 방문하지않고도 툴바의 링크를 클릭함으로도 피드를 읽어볼수 있는 기능입니다.

즐겨찾기바

이름과 약간의 기능들이 추가된 툴바 입니다. 즐겨찾기를 해 놓은 사이트들 뿐만 아니라 여러 다른 문서들 예를들어 워드, 엑셀, 파워포인트 문서들도 즐겨찾기를 해 놓을수 있군요.

자동 크래쉬 복구 기능

ACR 이라고 불리운다는군요. 약간 아이러니 한 기능이 아닐까 했는데요 ^^ 브라우저가 갑자기 다운된다거나 탭이 담고 있는 사이트가 다운될때 복구되는 기능입니다.

향상된 피슁 필터

피슁기능에 “Safety Filter” 기능이 더 생긴 것입니다. 더욱 안전한 서핑을 위함이라고 하는군요.

내 사이트를 IE8에 최적화

Activities, WebSlices 등의 적용방법들과 함께 CSS2.1 준수, 더 나은 AJAX 개발, DOM 코어 향상, API 선택자, 플랫폼 기능향상, Circular 메모리 누출 경감, HTML 향상과 ACID2, 그리고 Namespace 와 Protected Mode API 지원의 부분들을 이야기 하고 있습니다. 이 부분들은 계속 업데이트 하겠습니다.

일모리네에서 IE8 의 Version Targeting 에 관한 번역글들(Doctype을 넘어, IE8의 버전지정 2차 공방) 을 접하시면서 최근 한달간 이루어졌던 공방을 보셨을 것입니다. 오늘 IE 팀의 블로그에 이에대한 공식 입장이 발표가 되서 화제입니다.

아시다시피 IE8의 방향은 웹을 깨지 않는, 즉 IE7의 렌더링을 기본으로 삼으면서 원하는 개발자들에게는 IE8의 소위 “표준 렌더링 모드”를 선택할수 있도록 하는 것이었습니다. IE6 에서 IE7으로 넘어오며 깨어진 수많은 사이트들이 더이상 브라우저 업그레이드를 통해 깨어지지 않도록 “배려” 한다는 명분 아래 IE8은 새로운 버전과 ACID2 를 통과한 렌더링 엔진을 갖고 있으면서도 하위버전으로 렌더링이 되는 방향을 택하려 했었던 것이죠.

이제 이 방향을 틀어 IE팀은 원래 계획이었던 Version Targeting을 중심으로 한 호환성 유지 보다는 IE8 이 Standard Mode, 표준 모드를 기본모드로 택하게 되면서 IE 가 배려하고자 했던 IE6 이나 IE7 에 종속적인 사이트들을 감싸기 보다는 표준 준수를 권장하는 미래 지향적인 표준의 브라우저로 거듭날 것이라는 입장을 알린 것입니다. 그 입장이 사실인지 아닌지는 잘 모르겠지만 일단 웹표준 커뮤니티에서는 “일단은” 기쁘게 받아들이고 있는 뉴스가 되었습니다.

In light of the Interoperability Principles, as well as feedback from the community, we’re choosing differently. Now, IE8 will show pages requesting “Standards” mode in IE8’s Standards mode. Developers who want their pages shown using IE8’s “IE7 Standards mode” will need to request that explicitly (using the http header/meta tag approach described here).

하지만 아직 이르다

아마 이 뉴스에 가장 크게 반응 할 그룹은 웹개발자들 소위 퍼블리셔로 불리는 그룹과 사이트를 소유하고 있는 그룹일 것입니다. 퍼블리셔/ui 개발자들은 상호연동성(Interoperability)을 선택한 IE8 과 함께 표준으로 변화된 사이트들을 제작하는 것이 꿈만 같은 일이겠으나 꾸준히 남아있을 IE6와 IE7 잔재들 가운데 과연 사이트 관리자가 투자를 통한 표준지향을 선택하게 될까요?

이슈는 이것입니다. IE8 이 표준렌더링 모드를 기본으로 탑제하지만 IE7 의 렌더링 모드를 Version Targeting 을 통해 제공하게 됩니다. IE6와 IE7에 종속적인 사이트들이 IE8이 출시 되었을때 IE7 때처럼 새 브라우저에 맞는 개발을 선택하기 보다는 현재 유지되고 있는 IE7 의 렌더링을 메타태그 한줄로 사용할수 있게 되면서 IE8 표준모드 대신 불완전한 표준 브라우저 IE7 렌더링 엔진을 사용할 가능성이 상당히 높습니다. 또한 IE8 이 출시 된 후 라고 하더래도 IE7 과 IE6 의 브라우저 점유율의 변화가 급격히 찾아오지 않는한 IE8 표준 모드에 맞추어 사이트를 개발하게 된다면 IE7, IE6에서 깨어지는 현상을 피할수 없으므로 하위버전 또한 고려하여 사이트 개발을 진행해야 하니 과연 IE가 어느정도의 위험을 감수하는 것인지.

IE8 이 표준모드를 기본모드로 탑제 했다고 하지만 앞으로 버전지정(version targeting) 기술의 잔재가 어디까지 어떻게 이어질지는 두고 봐야할 문제인듯 싶습니다.