deute의 모든 글

HTML, CSS는 어느정도 다 했구요

가끔 보면 XHTML, CSS는 어느정도 다 했는데 이제 뭐할까요. 하는 사람들을 볼 수 있는데…정말 부러워… 그 자신감이… 근데 좀만 얘기하다 보면  아는것보다 모르는게 더 많아… (a 요소의 href가 뭘 말하는지는 아니?)

HTML, CSS좀 해서 약간!!!의 시멘틱한 페이지 좀 만들 수 있고, 브라우저 몇개 맞추면서 웹 접근성 품질마크 한 두번 따보면 HTML, CSS는 대충 다했다고 할 수 있는거 였어?

예전에 내가 좋아했던 카트라이더라는 게임이 있었는데(지금도 좋아해) 그때 통했던 캐쥬얼게임의 정석같은 개념은 “처음에 시작은 쉽게, 하면 할수록 어렵게, 마스터는 정말 어렵게” 였는데 난 HTML, CSS 가 그렇다고 생각해…

한국에 웹 표준 좀 한다고 알려져 있는 사람들 중에 자기는 HTML, CSS 어느정도 했다고 하는 사람 있는지 찾아봐. 그들은 겸손한게 아니라 정말 그 어려움을 알기 때문이라고 생각해(뭐 아닌 사람도 있겠지만)

남들보다 좀더 안다고 생각해서 각종 커뮤니티 활동이나 각종 발표 하는사람들도 너무 겁만주는것도 문제지만 무조건 태그 몇개, CSS 속성만 알면 바로가능 이딴 스레기 같은 얘기 좀 하지 말고(진짜 이런사람은 없지?), 장기적인 관점으로 로드맵을 그려주는것을 목표로 해봐

그리고 HTML,CSS 다하고 javascript하는게 아니라 그냥 다같이 하는거다. 졸라 씨발 단계 생각하지 말고  HTML, CSS 공부하고 있으면 닥치고 좀 봐라. 좀 프로그래밍의 로직도 좀 생각해보고.

p.s1 눈팅하던 하코사는 진짜 탈퇴해야겠다(모르는 사람들이 짜증나는게 아니라, 잘난사람들이 짜증나) CDK도 사람늘어나면 저리 되려나

p.s2 이빨까는 웹표준을 성민님 현석님과 podcast 방식으로 기획했었는데.. 요즘 나꼼수는 재미있더라 근데 우린 찬양할사람이 별로없어서 말이지;;;; 그리고 닥치고 웹표준을 좀 외쳤더니 존경하는 김어준 총수는 닥치고 정치 라는 책을 내었구나. 역시 싱행력이 있어야한다.(까는거 아님 멋진 실행력이 절대 부러운거임 =_=)

p.s3 요즘 맘의 짐을 한 두개 정도 버려 버리고 대충 살기로해서 블로그에서 정제된 언어보다는 내가하고 싶은 말이나 표현을 그냥 여과없이 해보려고

CDK study

2010년 5월말에 웹표준의 날을 했었는데요.  그 당시 웹 표준 경진 대회를 진행하면서 세미나 보다는 좀 더 심도있게 모여서 공부하는것에 관심을 가지게 되었고 하코사의 한 스터디에 들어가게 되었습니다.

그렇게 열심히 스터디에서 공부를 하는데 저는 책 중심의 스터디가 맞지 않는것이었습니다.

보통 스터디는 책을 선정해서 정해진 부분을 정해진 사람이 발표를 준비해서 사람들에게 발표하는 방식이었습니다. 제가 느끼기에는 한사람이 준비를 해와서 그것에 대해서 설명하는것보다는 모두가 공부를 해오고 내용에 대한 설명은 대충 생략하고 토론을 원했거든요. 사실 책을 보는것은 혼자서도 할 수 있으니까요. 책을 보고 의견을 나누는 것이 제가 원했던 것이었는데 그렇질 못했습니다.

또한 자율적으로 스터디를 하다보니 준비도 미흡하고 결석자도 많고 그렇더라구요. 당연히 흐름은 끊기게 되고, 약간은 산만한 느낌이 들었습니다.

주말에 내가 큰시간을 할애해서 공부를 모여서 하는것인데 산만해 지는것은 싫었습니다. 그래서 강력한 규칙을 정하는 스터디를 만들어서 다같이 공부해보자는 마음을 먹게 되었습니다.

그래서 CDK에서 스터디를 모집 하게 되었습니다. 책만 보는것이 아닌, 웹 표준의 깊숙한 부분, 사상(이라고 하기엔 거창하지만), 무엇보다 공부를 하는 자세를 연구하는 스터디를 모집하고 싶었습니다. 그렇게 저를 제외한 8명의 사람들이 모였습니다. 그래도 책을 한권 정해서 같이 공부하는것이 수월했기 때문에 책을 한권 정해서 공부하기로 했습니다. 그 책이 바로 제프리 젤드만의 웹 표준 가이드였습니다. 이 책은 웹 표준이 생길 당시의 이슈들을 주로 얘기하는책이었던 만큼 웹 표준을 심도있게 공부하기에는 딱이었습니다.

물론 발표도 했었습니다.  그러나 누가 준비해 오는것이 아닌 다같이 발표 준비를 해오고 그중에 즉석에서 발표를 정하는 방식이었습니다. 당연히 준비를 안해오는사람은 거의 없었고(없진않았습니다.-_-+) 책은 그렇게 진행을 했습니다.

그리고 또한 자유 주제를 선정하거나 제가 할당해주어 그것에 대해 심도있게 공부하고 내용을 공유하는 방식으로 진행되었습니다. 그 결과물들은 CDK위키에 조금씩 정리 되었습니다:)

제가 목표로 했었던건 스터디를 통해서 그냥 단순히 페이지를 쳐내는 사람이 아니라 어떤 이슈가 생겼을때 ‘왜’ 라는 의문을 가지고, 근본적인 원인과 문제를 파악하여 처리하는것을 목표로 하는 사람을 만드는것이었습니다. 그렇게 1년을 진행했습니다.

스터디를 하는 사람들이 얼마나 발전했는지는 모르겠지만, 오히려 저는 나름 많은걸 배우고 느낄수 있었습니다. 이제 남은분들이 열심히 하셔서 좀 더 좋은 방향으로 스터디를 이끌었으면 좋겠습니다.  또 다른 스터디를 할것이냐는 아직 모르겠네요.

 

집세 보증금

아는사람은 다알겠지만 난 고2때부터 자취를 했었는데… 집구할때보면 꼭 내가 가진 보증금에 30퍼센트 정도만 딱 더하면 내가 생활 하던 그 수준에서 딱 맘에 드는 집이 나오더라는것… 그런데 언제나 나에겐 그 30퍼센트가 그당시에는 가장 큰돈 이라는것

그런데 지금은 30프로는 택도없고 가진돈의 두배는 있어야 맘에 드는 집이 보인다는것이지…

이건 내가 생활수준이 높아서일까… 아님 가카 때문일까… 에효….

Pajet KWAG2.0 Ver.

웹 접근성을 향상을위한 페이지 검증 도움도구인 pajet이 KWCAG2.0 기반으로 변경이 되었습니다.

예전 버전과 크게 변경된것은 아니지만, 몇몇 기능이 추가되었고 결과에 대한 리포팅을 지침별로 정렬시켜 두었습니다.

https://mydeute.com/was/pajet.html 페이지에서 확인이 가능합니다.

PAJET은 js, CSS를 기반으로 실행되는 툴이기 때문에 웹 사이트에 대해 영향을 많이 받습니다. 때문에 결과가 제대로 보이지 않을 수 있습니다.  ㅠ_ㅠ

저도 노력해서 디버깅을 하고 있지만, 사용하시는 분들의 도움이 절실히 필요합니다. 많은 성원 부탁드립니다 🙂

동영상에 자막제공하기

예전부터 만들어논 문서인데.. 그냥 오픈합니다.

동영상 서비스의 접근성 지침 및 가이드(WCAG2.0)

지침 1.2 시간에 기반한 미디어(Time-based Media): 시간에 기반한 미디어를 위한 대체물을 제공하라.

  1. 텍스트 콘텐츠를 이해하기 쉽게 도와주는 미디어의 역할
  2. 자막을 제공
  3. 음성 서비스(대체 콘텐츠)를 제공
  4. 설명에 대한 자막제공
  5. 수화

자막이란?

멀티미디어 콘텐츠에 대한 정보나 대화 내용, 번역 등을 콘텐츠에 동시에 보여주는 방식

자막(sami) 제공하기

SAMI

SAMI(사미, Synchronized Accessible Media Interchange; 접근성 미디어 동기화 교환)는 마이크로소프트 사에서 1998년에 발표한 미디어 접근 제안이다. 마크업 언어로 구조화되어 있으며 개인용 컴퓨터에서의 미디어 재생용 자막을 간단히 만들 수 있도록 하는 데 중점을 두고 설계되어 방송용으로는 적합하지 않다.
SAMI 문서를 전문적으로 만들 수 있는 유틸리티도 있지만, SAMI 문서는 문자열로 되어 있기 때문에 어떤 문서 편집기로도 다룰 수 있다. 파일 확장자로 .smi 혹은 .sami를 사용하는데 .smi는 SMIL 파일도 사용하는 확장자이기 때문에 서로 충돌하게 된다.  SAMI 문서에 여러 종류의 언어를 담을 수 있다.
대한민국에서는 자막 포맷으로 SAMI가 가장 많이 쓰인다.

youtube는 플래시 기반의 멀티미디어 재생기임에도 불구하고 자막 업로드를 제공하고 있다.
youtube의 자막이 보여지는 방식

youtube에 자막을 업로드...

기타 멀티미디어 업로드 사이트에서는 특별한 자막 지원여부를 확인해보지 않았다.

MEDIAPLAYER를이용해 자막을 지원하기

https://mydeute.com/tip/mov/gee.html

<object id="Player" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" width="480" height="272">
<param name="URL" value="gee.wmv">
<param name="autoStart" value="false">
<param name="captioningID" value="captions">
<param name="SAMIFileName" value="gee.smi"> 
<!--[if !IE]> <-->
<object type="application/x-ms-wmp" data="gee.wmv" width="480" height="272">
<param name="pluginspage" value="http://www.microsoft.com/Windows/MediaPlayer/">
<param name="url" value="gee.wmv">
<param name="autoStart" value="false">
<param name="captioningID" value="captions">
<param name="SAMIFileName" value="gee.smi"> 
</object>
<!--> <![endif]-->
</object>
<div id="captions" style=""> </div>
  • <param name=”captioningID” value=”captions”> : 자막이 보여질 element의 ID 지정
  • <param name=”SAMIFileName” value=”gee.smi”> : 자막 파일의 경로

대부분의 브라우저에서 자막 확인이 가능함

올바른 자막의 제공

단순한 대화나 말에 대한 자막뿐만 아니라, 상황을 이해 할 수 있는 설명도 포함 하는것이 좋다.

사용자가 쉽게 자막을 제공 할 수 있게 하는 방법

자막을 제작할 수 있는 환경을 구성한다. (동영상 업로드시)