개발&Development/웹 43

CDATA는 운이 좋으면 해석될 뿐

아래의 코드를 보자. 겐도 오빠 사랑해 ㅇㅇ 파이어폭스는 나의 사랑을 잘 표현해 주고 있다. 허나 IE 7. 로딩부터 심상치 않다. 그리고는 깔끔한 흰 화면을 보여준다. 사파리는 거의 기대를 말자. ""까지 날려준다. 위처럼 script 영역을 벗어나는 주석태그가 있는 경우 오동작 한다. 오동작이 맞는지는 모르겠다. HTML Spec을 아무리 읽어봐도 어느것을 먼저 해석해야 하는지에 대해선 모르겠다. 아무튼 자바스크립트 영역에 뭔가 출력할땐 조심하자. 저 문서의 타이틀에서 살짝 보이듯이 곧 "G-Test Pattern V5" 공개하겠습니다.

웹 접근성에 대한 단상들

요즘 TV 오락물들을 소리없이 시청해 본적이 있는가. 요즘 다니는 헬스장에서, 메인 운동을 하기전에 5분정도 뛰면서 몸을 풀때 TV를 앞에 틀어 둔다. 옆에 이어폰이 있기는 하지만 귀찮거나 해서 그냥 화면만 보는데 시청에 전혀 문제가 없다. 밑에 자막으로 다 나오기 때문이다. 뉴스들중 일부는 하단에 청각장애인을 위한 수화를 보여주는데 개인적인 생각으론 뉴스도 자막만 좀더 자세해 지면 정보를 전달 받는데 별 지장이 없을 것 같다. 때론 수화때문에 자막이 가려 이어폰을 꼽지 않았으나 수화를 모르는 내가 정보를 잘 못얻는 경우까지 있으니.... 메일을 텍스트로 보내던 시절엔 글자크기라는 것이 없었으니 자기가 보고 싶은 데로 볼 수 있었으나 지금의 대부분의 메일은 Rich Text Format을 사용하니 본연의..

사파리의 앵커 버그

둘다 같은 me2day의 특정 글을 가르킨 것인데 Firefox는 제대로 나오고 Safari는 해맨다. 절대 me2day의 버그가 아니라 Safari의 버그이다. 왜냐면 같은 페이지 내의 앵커는 제대로 표시되기 때문이다.(리로딩이 없는 경우) 사실 이런 식으로 me2day는 앵커를 만들고 있는데 Empty block의 경우 실제 랜더링 영역을 잡지 못하기 때문에 여러 버그를 일으키고는 한다. 아무 내용도 없는 영역은 최적화를 위해 계산을 대충하는 경향이 있어서 문제를 쉽게 일으킨다. 겐도는 땜빵으로 트릭을 알려주기도 한다. 공백이라는 문자가 존재하는 것이다. 이때는 이 공백을 출력하기 위한 영역을 잡는다. 허나 이것은 정말 땜빵이라는 점을 기억하기 바란다. 아침해가 떠오르는데 모두 정신이 오락가락할 때 ..

Safari 3.1 updates

집으로 퇴근하는 사이 3.1 업데이트가 나왔군요. 소프트웨어 업데이트 기능을 사용하거나 http://www.apple.com/safari/download/ 에서 다운로드 가능합니다. 변경점은 http://docs.info.apple.com/article.html?artnum=307467-ko 에서 확인가능합니다. JS 빨라졌다라... 뭐 체감하긴 힘들겠습니다만. CSS 3 web fonts 지원에 HTML 5의 video/audio 태그 지원이라... 그보다는 개발자 기능이 강화된게 맘에 드는군요. 업데이트를 하니 재부팅 하라고 해서 재부팅 하고 이래저래 뜯어봐야 겠습니다. 개발자용 업데이트. 환경설정에서 "개발자용 메뉴보기" 추가 이런 메뉴가 추가됩니다. 웹속성(Web Inspector) 화면 여기서 ..

벨리데이터는 벨리데이터일뿐

"네이버 탑페이지 HTML 유효성 검사 통과" 코멘트에서 id와 name의 중복문제가 나온다. 사실 "보안된 페이지의 HTML Validation Check 방법"을 보면서 살짝 예상하기도 했었다. (더불어 W3C Validator는 내부에 설치할 수도, 파일을 직접 올려서 확인해 볼 수도 있다.) W3 Validator나 SGML Parser는 DTD에 따른 문법 검사만 한다고 보면 된다. 가령 이번에 문제가 된 "12.2.3 항목"은 DTD에 정확히 표현되어 있지 않다. HTML의 과도기적 문제라고도 할 수 있는데 id 속성과 Anchor의 name은 서로 문법이 틀리다. DTD가 뭔지 id와 name이 뭐가 틀리다는 건지는 직접 찾아 보시고(하단 덧글 참고) 맞춤법이 맞다고 해서 올바른 국어가 아니..

p안에 div를 넣으면

리퍼러 중에 이런 문제로 고심하는 분들을 위해 왜 p안에 div를 넣으면 안되는지를 간략히 살펴보자. 우선 W3의 HTML 4.01 스펙부터 보자. 9.3.1 Paragraphs : the p element를 보면 p 태그는 inline 요소만을 자식으로 가질 수 있다고 한다. div는 block 그룹에 속한다. 따라서 p안에 div를 쓰면 잘못된 것이다. 헌데 다들 잘 쓰고 있지 않은가? 심지어 텍스트큐브나 티스토리 에디터도 이런 식으로 html을 생성하기도 한다(정확히는 각 브라우저의 위지윅 에디팅 모듈의 버그라고 할 수 있지만). 많은 웹사이트 코더들이 이 부분을 묵과한다. 아래의 코드를 보자. 테스트문장 정상적인 문단 "테스트문장"이 전형적으로 실수한 부분이고 아래는 정상적이다. p 영역이 정확히..

MacOSX 레퍼드에서 웹 공유가 안될때

타이거에서 레오파드로 업그레이드 했을 때 /User/{account}/Sites에 있는 파일들이 /~{account}로 접근하면 403이 뜨는 경우가 있다. 어떤 사람은 아예 httpd.conf를 고치는 사람도 있지만 간단한 방법. /etc/httpd/users 의 파일들을 /etc/apache2/users로 복사하면 된다. /var/log/httpd는 남아 있지만 실제론 /var/log/apache2에 파일이 생성되는 것이 기본임에 유의. 덕분에 몇시간 삽질 -ㅅ-. 그냥 슬림 피씨에 리눅스 깔 껄 그랬나. ㅠ.ㅠ

IT강국 대한민국

"마XXX"오락을 띄우는데 "nPxxxxxx"의 "GxxxGuxxx"가 뜨다가 죽으면서 키보드 드라이버를 해 드셨다. 키보드 드라이버가 완전 사망, 키 입력을 할 수가 없다. 그거 고치느라 쌩쑈를 했다. 마침 타블렛이 연결안되어 있었으면 우짤뻔 했노. 패스워드를 타블렛으로 입력하는 경험을 하게 해준 그 프로그램에게 감사. (최근에 얼핏 USB 키보드까지 제어하겠다라는 금융권 보안시스템의 이야기를 듣고 어찌나 무섭던지. 일반인들은 키보드 나가면 OS 재설치 해야 하는데 말이쥐.) 부모님이 집에 오셨다가 전기요금의 E-mail 청구서를 한번 보게 해달라고 하셨다. 대단한 "한X". Excel로 보내 주셨내. 집컴에는 오피스가 없어서(완전 오락용) 급한대로 Excel Viewer를 설치해 봤다. 열수 없다고 ..

다음 블로그의 문제점이라고 한다면

나의 FeedDemon 에서 글을 구독하다가 부분 공개라 직접 가서 글을 봐야 할때 글이 스크롤이 안된다. 일부 자바스크립트로 스크롤을 구현한 경우 제대로 스크롤이 되지 않는다. 브라우저가 임베디드 되어 있는 경우 IE로 인식 되지만 IE가 아닌것을. 전에 일부 블로그가 스크립트로 커스텀 스크롤바를 만들던지 하면 스크롤이 안되서 자바스크립트를 끄거나 주인장을 협박하기도 하였는데 이번엔 어째야 하나. 사람들이 다양한 이펙트를 위해 JS를 막 쓰려고 하면 일단 부정적인 의견을 내는것이, 예외상황들 다 고려하기가 너무 어렵다. 사이드바에 드래그&드랍을 구현하고 나서 이후 버그리포팅들을 보면, 정말 골때리는 케이스들이 많다. 그리고 아직도 버그 천지일 것이다. 예전에 윈도우 프로그래밍을 하면서 느낀 것 중 하나..