페이지오프

웹퍼블리셔 기술 스터디 #4 - 정규식 다루기 2차 신청 받아요~

2010-11-08T05:27:00.000-08:00

가을입니다. 그런데 첫눈 소식이 있네요.

최근에 클리어보스 운영에 집중하다 보니 제 블로그는 마냥 방치되어 있었네요. 성격이 비슷하다보니 두 집 살림하기가 쉽지 않더군요.

각설하고,

오는 11월 13일 한빛미디어 세미나실에서 클리어보스가 주최하는 웹퍼블리셔 기술 스터디 - 정규식 다루기 2차가 진행됩니다.

지난 1차와 마찬가지로 장기웅님이 강의를 해 주시고, 실습 위주로 다섯시간동안 진행될 계획입니다. 따라서 참석자 분들은 반드시 노트북을 휴대해 주셔야 합니다.

정규식은 언듯 복잡해 보이고 상당히 어려워 보이는데요. 사실 몇가지 규칙만 알아도 꽤 요긴하게 사용해 볼 수 있는 기술입니다. 굳이 중급자 이상의 실력을 갖추지 않았더라도 실무에 도움을 받을 수 있는 것이지요.

복잡한 HTML과 CSS, 그리고 수십 수백개의 파일 속에서 반복적이고 어떤 특정 패턴을 가진 영역을 찾아서 치환하고 싶을때가 있으셨죠? 그럴때 유용하게 사용할 수 있는 것이 정규식입니다. 이번 스터디 한 번만으로 완전히 익혀갈 수는 없겠지만 맛을 보고, 약간의 적응을 한다면 자바스크립트를 가지고 정규식을 응용 활용할 수 있는 수준도 만들어볼 수 있지 않을까 싶습니다. 물론! 스터디 이후에 개인 연습이 필요하겠지만요!

어느 정도 알고, 쓸 줄은 아는데 중급 이상 스킬 업이 필요하신 분들은 적당한 스터디는 아닐겁니다. 그 분들은 더 많은 연습과 책을 통해서 독학하시는게 어쩌면 더 빨리 정규식을 마스터하는 길일 것 같구요. 정규식을 전혀 모르시는분, 들어는 봤는데 어떨때 어떻게 쓰이는지 감이 안 오시는분들에게 유익한 시간이 되지 않을까 싶습니다.

아무쪼록 차가워진 가을 날씨에 감기 조심하시고, 많은 분들이 관심을 갖고 참여해 주셨으면 하는 마음으로 오랜만에 포스팅을 해 봅니다. :)

차세대 웹 서비스를 위한 새로운 웹 표준! HTML5 오픈 컨퍼런스 안내

2010-06-21T18:48:00.000-07:00

오는 7월2일 학동 건걸회관에서 한국 웹표준의 산증인 한국 웹표준 프로젝트가 오랜만에 그 모습을 공개하며 주최한 HTML5 오픈 컨퍼런스가 열립니다.

HTML5 오픈 컨퍼런스

국내 최대 웹표준 커뮤니티 CSS 디자인 코리아와 함께 제가 운영하는 클리어보스가 주관하고, 한국정보화

진흥원, 모질라가 후원하는 이번 행사는 2010년 불어닥친 HTML5의 실체를 이해하고 현장에서 어떻게 지원하게 될 것인지에 대한 궁금증을 해결해 줄 것이라고 생각됩니다.

국내 웹표준 활동의 1세대인 윤석찬, 정찬명, 신현석씨 등과 함께 자바스크립트 전문가로 유명하신 경준호님과 정보화진흥원에서 한국 웹접근성을 위해 노력하시는 현준호님, 매쉬업 블로거 권정혁님까지 각개 분야 최고들이 한 자리에 모여 발표를 합니다.

이번 행사는 1만원의 참가비를 받고 있으며 650석의 좌석을 마련하고 있습니다. 웹표준과 HTML5에 관심있는 모든 웹 제작자들이 모일 수 있는 행사가 되었으면 좋겠고, 특별히 기업의 대표분들이 참석하시어 새로운 표준에 대한 이해를 높이고 자사의 경쟁력을 키우는데 보탬이 될 수 있었으면 좋겠습니다.

등록은 별도로 마련된 홈페이지에서 받고 있습니다. 지금 바로 신청해 주세요!

CSS의 창시자 호콘 비움 리에(Opera Software CTO) 방한 세미나

2010-04-29T02:47:00.000-07:00

Håkon Wium Lie 에게 웹 표준 기술의 과거, 현재, 미래를 묻다!

오페라 소프트웨어 CTO로 있는 호콘 리움 리에(Håkon Wium Lie)가 방한하여 세미나를 갖습니다. 그는 CSS를 창시한 사람으로도 유명한데요. 이번 방한을 통해 CSS의 창시와 최신 웹 표준이라는 주제로 발표를 합니다. 그리고 신현석님께서 '한국의 웹 표준'이라는 주제로 국내 웹 개발자, 정부에서 추진하고 있는 웹 표준 활동에 대한 이야기를 들려 주실 예정입니다.

50명 정원으로 신청을 받고 있는데 아직은 자리가 남았지만 금방 찰 것 같습니다. 꼭 참석하시고 싶으신 분들은 바로 신청하세요~!

웹 접근성 지지 삼행시 짓기 이벤트

2010-04-27T22:56:00.000-07:00

행정안전부가 주최하고, 한국정보화진흥원이 주관하는 웹 접근성 지지 삼행시 짓기 이벤트가 열렸습니다. 1등 넷북과 2등 시각장애인을 위한 음성 낭독기가 걸려 있는 이벤트구요. 아쉽게 1,2등을 놓치더라도 97분께 USB 메모리를 드리는 행사입니다.

선물도 좋지만 이런 이벤트를 통해서 보다 많은 분들이 장애인 접근성 문제에 대해서 고민해볼 수 있는 기회가 되었으면 하네요.

웹 접근성 삼행시 짓기 이벤트

지금 바로 참여해 보시구요. 다른 분들께도 많이 알려주세요.

봄 맞이 새단장(?)

2010-04-23T21:31:00.000-07:00

글이 잘 쓰여지지 않을 때 특별한 의미 없이 스킨을 바꾸곤 했는데 어제는 하루 종일 100일도 안된 아들을 돌보다가 블로그 스킨을 바꾸게 되었네요.

아기가 계속 깨서 밥달라고 칭엉대고, 놀아달라고 울어대서 멋지게는 못하겠고, 마침 최근에 글도 거의 못 올리고 클리어보스 쪽에만 신경을 쓰다 보니 이 블로그는 최대한 가볍고, 단순하게 바꿔야겠다라는 생각이 들더군요.

아이폰에서 접속한 Pageoff

그래서 검색을 제외한 모든 사이드바 요소들을 제거하고, 순수하게 글에만 집중할 수 있게 바꿔봤습니다.
또 하나 아이폰과 같은 작은 디스플레이에서도 글들을 적절히 읽을 수 있도록 해야겠다는 생각이 들어서 사이드바를 과감히 없애버렸습니다. 이전 스킨은 조금 불필요하게 사이드바 영역이 커서 본문이 너무 작아 보였거든요.

그리고 조금은 큰 변화라고 할 수 있는데 오랫동안 사용했던 이 블로그의 이름을 바꿨다는 것입니다. 그동안 '웹 뒤에 숨은 web'이라는 제목을 사용했는데요. 도메인 네임과 달라서인지 많은 분들이 잘 기억해 주지는 못하신것도 같고, 당초 온라인 비평에 대한 이야기를 쓰려고 지었던 이름이기도 해서 의미에도 벗어나지 않나 해서 도메인과 같은 Pageoff로 바꿔봤습니다.

커뮤니티로 운영하려고 하는 클리어보스 사이트에 많은 신경을 쓰다 보니 개인 블로그를 소홀히 하게 되긴 했지만 언제든 되돌아올 수 있는 집은 있어야지 싶어 이 블로그는 계속 유지될 것 같습니다. 전처럼 자주는 안되겠지만 종종 글 올리면서 인사드리겠습니다.

항상 제 블로그를 방문해 주시는 분들께 새삼 감사의 인사를 드립니다.

클리어보스 기술 세미나#1 - 표준과 접근성의 재확인

2010-03-31T23:56:00.000-07:00

만우절입니다. 하지만 거짓말은 아니구요. 클리어보스가 웹퍼블리셔 오리엔테이션과 함께 2010년부터 새로 준비한 세미나인 웹퍼블리셔 기술 세미나 첫번째 행사를 오는 4월 10일 마련했습니다.

이번 기술 세미나의 개요는 아래와 같습니다.

제목 : 웹퍼블리셔 기술 세미나 #1 - 표준과 접근성의 재확인
강사 : 서정민
주최 : 클리어보스
일시 : 2010년 4월 10일 토요일 오후 2시 ~ 6시 1시 40분까지 입실 부탁드립니다.
장소 : 숭실대학교 정보과학관 501호 (이인석(inska)님께서 장소 지원에 도움 주셨습니다. 감사합니다.)
대상 : 총 30명 - 경력 1년차 이상 동종 업종 전직 경력 미포함. 퍼블리셔 경력만으로
진행 및 도움 : 루트박스외 3명
참석비 : 무료
- 무작정 신청만 하시고 연락없이 불참하시면 차기 세미나 진행시 불이익이 있을 수 있습니다.
- 뒷풀이 비용은 별도 입니다. (참석 인원에 따라 변동됩니다.)
연락 : 장기웅(루트박스) master@rootbox.co.kr

웹퍼블리셔 오리엔테이션이 신입 및 입문자를 대상으로 하는 오리엔테이션 행사라면, 기술 세미나는 경력 1년 이상을 대상으로 하는 실무 중심의 세미나입니다. 이번 행사 준비는 장기웅님이 준비를 해 주셨구요. 이인석(인스카)님께서 장소에 도움을 주셨습니다.

많은 관심과 참여 부탁드립니다.

신청은 여기에서 해 주시면 됩니다.

미투데이 입성

2010-03-09T22:03:00.000-08:00

미투데이

최근 3개월 동안 여러가지 사정으로 다니던 직장을 휴직하고, 집에서 쉬고 있었습니다. 몇가지 크고 작은 일들을 진행하면서 시간을 보내다가 아내의 배는 점점 불러 1월 21일 예쁜 아기를 낳았구요. 하루 하루 애기가 커 가는걸 보고 있자니 아빠로써 집에만 있기가 힘들더군요. 부모님도 걱정하시고, 장기적으로 움직임이 필요하다는 판단도 들었습니다.

그러다가 지인의 도움을 받아 미투데이TF팀에 합류할 수 있게 되었구요. 이번주부터 출근 도장을 찍고 있습니다. 아직 사내 분위기 적응중이고, 구체적인 업무를 시작하지는 않았지만 함께 일할 동료이자 친구에게 여러가지를 배우고 있기도 합니다.

미투데이는 제게 참 여러가지를 주는 것 같습니다. 주변분들은 대부분 알고 계시지만 제가 아내를 만난 곳도 미투데이였구요. 그렇게 연애를 시작해서 작년에 결혼까지 했으니까요. 지금은 저와 아내 그리고 아들 이준이의 미투데이까지... 우리 가족은 미투데이 가족과 다름 없었는데 이번에 제가 미투데이를 만들어가는 책임까지 함께 나누어 갖게 되었습니다.

아직은 코드 한 줄 더하지 못하고 있지만 앞으로 더 나은 서비스로, 더 나은 웹으로 만들어 가기 위해 가진 재능을 아끼지 말아야 겠다는 생각을 해 봅니다. 태어나기도 전에 미투데이를 시작하게 된 아들 이준이에게 나중에 자랑스럽게 이야기해주고 싶거든요.

덧붙임, 아직 미투데이를 모르시는 분들. 가입했지만 잘 안 쓰시는 분들. 미투데이 재미나게 사용해 주시고 많이 이용해 주세요~

세번째 웹 퍼블리셔 오리엔테이션 마쳤습니다.

2010-02-28T00:11:00.000-08:00

지난 27일 토요일 오후 클리어보스가 주최하고, CSS Nite in Seoul이 후원하는 웹 퍼블리셔 오리엔테이션 세번째 행사가 있었습니다.

이번 행사는 한국 마이크로소프트 세미나실에서 열렸구요. 총 서른 여섯분이 참석을 해 주셨습니다.

1,2기 행사와 달리 이번에는 전체 인원을 40으로 늘려 잡았고, 첫번째 세션을 교류파티 시간으로 결정해 참석자들간 인사와 이야기를 나눌 수 있도록 분위기를 만들어가는데 신경을 썼습니다. 당초 어색함때문에 대화가 없지는 않을까 하는 우려와 달리 참석자들끼리의 대화가 이루어질 수 있었구요. 2교시 발표와 3교시 토론에 이어지는 프로그램 진행에도 큰 무리가 없었던 것 같습니다.

세번째 웹퍼블리셔 오리엔테이션 - 교류파티

1교시 교류파티 시간동안 6개의 테이블에 4~8명씩 둘러 앉아 인사도 나누고, 명함도 주고 받고, 회사 이야기, 웹표준 이야기 등 여러가지 이야기들을 나누는 시간을 가졌습니다.

세번째 웹퍼블리셔 오리엔테이션 - 서정민님 발표

2교시에는 서정민님의 '의미 있는 마크업을 하자'라는 주제의 발표를 들었습니다. 언제나 그렇듯 시원 시원한 목소리와 열정으로 발표를 멋지게 해 주셨습니다.

세번째 웹퍼블리셔 오리엔테이션 - 질문시간

정민씨의 발표에 이어 참석자들의 질문 공세도 이어졌습니다. 짧은 발표 시간이었음에도 여러분들께서 질문을 해 주셔서 아주 '알 찬' 30분이었지 않나 싶었습니다.

세번째 웹퍼블리셔 오리엔테이션 - 토론시간

마지막 3,4교시는 이 행사의 주제인 '오리엔테이션'을 위한 토론 시간이 이어졌습니다. 웹 퍼블리셔로 입문하고, 회사에서 겪을 수 있는 다양한 사례와 직업적인 고민들, 업무 역활 등을 황지훈 팀장님의 사회로 이야기를 풀어갔던 시간이었습니다.

행사를 마친지 이제야 만 하루가 지났을 뿐이고, 현재는 참석자들의 온라인 평가가 이루지고 있습니다. 모든 참석자분들의 평가가 완료되어야 이번 행사의 결과가 점수로 매겨질 수 있겠지만 오티를 기획하고 준비했던 한 사람으로써 보람을 크게 느낀 행사였습니다. 더불어 아쉬움도 컸구요.

지금 머리속에는 곧바로 다음 오티에 대한 고민이 들어차 있습니다. 지난해부터 대전이나 광주, 부산 등에서 행사를 개최해 줄 수 없느냐는 요청을 몇차례 받아왔는데 올 가을쯤에는 우선 가까운 대전이나 조금 멀더라도 광주쯤에서 행사를 열어볼까 하는 고민도 함께 가지고 있습니다. 혹시 제 블로그를 찾아 주시는 분들 가운데 대전이나 광주, 부산 등 지방에 적을 두고 계신 분이 계시다면 그래서 장소 문제를 해결해 주실 수 있다면, 따로 연락 부탁드립니다.

HTML5 제정과 관련된 질문 답, WHATWG FAQ 문서 한글화

2010-02-09T04:52:00.000-08:00

의도했던 것은 아니나 스티브 잡스가 HTML5 이슈를 크게 터뜨려주어 요즘 HTML5에 대한 관심이 지나치게 높아진 요즘 제가 운영중인 클리어보스에서는 WHATWG FAQ 문서를 번역 중에 있었습니다. 2010년 들면서 클리어보스 내에 HTML5 스터디를 꾸리고 공부를 할 마음으로 진행된 것이었는데요. 아직 미흡하긴 하나 그럭저럭 읽기에는 어렵지 않은 문서가 되어 공개하게 되었습니다.

WHATWG FAQ는 HTML5 제정과 관련해서 나온 여러가지 질문들에 대한 답변을 다루고 있는 문서이고, 수시로 업데이트가 되고 있습니다. 따라서 현재 한글화된 문서가 영문 문서와 내용이 달라질 수 있음을 알아주시기 바랍니다. 시일이 다소 지난 후에는 영문서를 먼저 확인해 보시고 업데이트가 되었는지 확인하실 필요가 있을 것입니다.

또, 이 한글화 문서는 일본 문서를 재번역 한 것을 기초로 하고 있습니다. 애초에 스터디 그룹에서 사용될 것이었기 때문에 번역이 좀 더 용이한 일어 문서를 가지고 번역하기 시작했습니다. 혹시 번역된 문서를 재번역한 것이라 믿음이 덜한 분들은 꼭 원문을 읽기를 권해 드립니다.

영어 원문이든 일본어로 번역된 문서를 재번역했든 최대한 원본 글을 유지하고자 했습니다. 하지만 번역의 미숙함과 배경지식의 얕음으로 인해 아마 여러 부분에서 애매모호한 문장들이 있을 것이라고 생각됩니다. 지난주 클리어보스 자체 HTML5 스터디에서 이 문서를 다루었을 때도 이해가 되지 않아 모두들 어리둥절해 한 내용들도 있었으니까요.

일단은 HTML5에 제정과 관련된 여러가지 궁금증을 풀어보고자 그리고 풀어 드리고자 번역을 시도해 봤습니다. 일어를 번역해 주신 윤준님께 감사드리고, 영문 부분을 번역해 주신 아쿠아테라님께도 감사드립니다.

자체 스터디를 통해서 HTML5에 대한 배경 지식이 넓어지면 이 FAQ를 통해서 이안 힉슨의 답변을 좀 더 이해할 수 있을 것이라고 기대해 보고, 그렇게 깨닫게 되면 여러분들께도 함께 공유해 드리도록 하겠습니다.

세번째 웹퍼블리셔 오리엔테이션 소식

2010-02-07T16:23:00.000-08:00

안녕하세요.

클리어보스에서 세번째 웹퍼블리셔 오리엔테이션 행사를 열게 되었습니다.

세번째 웹퍼블리셔 오리엔테이션

지난해 첫번째 행사와 두번째 행사를 무사히 마치고, 2010년 새 해를 맞이하면서 오는 2월 27일 토요일 오후 1시부터 5시까지 4시간동안 서울 삼성동 포스코센터 서관 5층 한국 마이크로소프트 세미나실에서 세번째 행사를 개최하려고 합니다.

웹퍼블리셔 오리엔테이션은 웹퍼블리셔 경력 1년 미만의 신입과 입문자들을 위한 세미나로, 웹퍼블리셔들의 업무 프로세스에서부터 개인 임무의 영역까지 여러가지 주제들을 이야기하면서 스스로의 비전을 찾고 자기계발의 기회를 가질수 있도록 독려하기 위한 행사입니다. 2009년 2월 첫 행사를 시작으로 세번째 자리를 갖게 되었으며, 황지훈, 장기웅님등 여러 업계 선배님들이 함께 해 주시고 계십니다.

이번 행사부터는 종전 20명 참석에서 40명 참석으로 최대 인원을 늘렸구요. 참석 신청 후 책임비(2,000원)를 미리 공지된 계좌로 이체하여 참석 여부를 확실히 해 두는 제도를 마련했습니다. 사실 2,000원 그렇게 큰 돈도 아니어서 계좌 이체까지 하는 것 자체가 매우 불편할 수도 있습니다. 하지만 무료나 다름없이 진행되는 이 세미나를 위해서 참석자 인원대로 장소를 섭외하고 다과를 준비하는 등 비용을 들인 이후에 불참자가 많아서 고스란히 운영진들이 주머니를 털어야 하는 상황이 매번 반복되다 보니 행사 진행에 대한 어려움을 점점 크게 느껴가는 점이 있었습니다. 하지만 그보다 더 아쉬운건 오시기로 했던 분들이 부득이하게 참석하지 못하셔서 빈자리를 넓혀 갈 때 입니다. 운영진들 어깨가 축 쳐지죠^^;

아무쪼록 이번 행사에서는 보다 많은 분들이 신청도 해 주시고, 책임있게 참석도 해 주셔서 보다 의미 있는 자리가 될 수 있기를 바라겠습니다.

행사 안내와 관련한 자세한 내용은 클리어보스 세미나 페이지를 확인해 보시면 됩니다.

덤, 혹시 이 글을 읽는 분 가운데 이 작은 행사에 후원을 해 주실 곳이 있다면 서슴치 마시고 연락 주세요~! 책 한 권이라도 아주 감사하게 받아서, 참석자 분들께 나눠 드릴수 있습니다~

좋아보이는 웹사이트를 만드는 디자인 원칙

2010-02-03T19:29:00.000-08:00

좋아보이는 웹사이트를 만드는 디자인 원칙

고등학교 시절 내 꿈은 웹 디자이너였다. 페인트 샵 프로를 이용해서 머리속에 그려지는 온갖 것들을 디지털 이미지로 창조해 내는 그 느낌이 너무나 황홀했고 행복했었다. '디자이너'라는 이름이 가져다 주는 감동도 컸다. 거기에 HTML과 CSS라는 프로그래밍같은 언어를 함께 다루는 솜씨는 더욱 더 웹 디자이너를 돋보이게 했다. 하지만 대학을 졸업하고, 군대를 마치고 나니 많은 것이 변했고, 나는 HTML과 CSS를 다루는 UI개발자가 되어 있었다. 포토샵을 실행시키기는 하지만 대부분 디자이너가 작업한 PSD파일을 자르고, 약간씩 편집을 하는 수준이었다. 무엇인가 창조하는 즐거움은 사라지고 없었다. 그런 업무적 경계과 선명해질 수록 나는 웹디자이너와 다른 모습으로 살아가게 되었고, 그들의 생각이나 고민을 이해하지 못하게 되었다. 막연히 디자인도 역시 힘들고 고단하겠지하고 넘겨 짚을 뿐이었다.

우리가 하는 일-웹 사이트를 제작하는-이라는 것이 기획자나 디자이너, 개발자나 퍼블리셔 한 두명으로 되지 않는다는 사실은 누구나 알고 있다. 하지만 점점 분야의 깊이가 깊어지면서 서로의 업무의 경계를 분명해지고 벽이 만들어진다. 서로를 이해하기 힘들어지게 되며 자신만의 지식이 진리가 되어 버리곤 한다. 사이트는 쉽게 경로를 이탈하게 되고, 일정은 무한히 늘어진다. 모두가 피곤해진다.

과거에는 스스로 기획과 디자인 개발과 퍼블리싱을 모두 해내야 하는 웹 마스터가 있었지만, 지금은 보다 더 현명하게 웹사이트를 제작하고, 자신의 일을 훨씬 전문화시키기 위해서 서로를 이해할 필요가 있다고 생각한다. 그래서 종종 내가 하지 않는 일. 내가 관심을 두지 않는 일들에 대해서 관심을 둘 필요도 있지 않을까 생각한다. 조금씩 공부를 하고, 이해를 하기 시작하면 디자이너가 개발자가 얼마나 고단한지 어떤 어려움이 있는지 이해할 수 있고, 협업에 있어 도움을 주고 받을 수 있지 않을까?

그런 의미에서 최근에 내가 찾아 읽은 책은 '좋아보이는 웹 사이트를 만드는 디자인 원칙'(도서출판 인사이트)이었다. C, JAVA를 비롯해 ASP, PHP, JSP등 여러 개발 언어는 대학시절부터 꾸준히 공부를 해 왔지만 고등학교 이후 디자인 영역은 내 영역이 아니라고 생각했고 그만큼 멀찍이 떨어져 지내 왔던게 사실이다.

하지만 최근 몇년간 웹표준과 웹접근성에 대한 이야기가 많이 화자되면서 디자이너와의 협업- 접근성을 위한 유니버설 디자인 등을 이야기할 때마다 내 지식의 한계에 부딪히며 말을 잇지 못하는 경우가 많았다. 나는 디자이너들의 작업을 어느 정도나 이해하고 있을까? 그들이 생각하는 색이나 이미지, 폰트는 어떤 개념들일지 나는 몰랐다. 그래서 알아볼 필요가 있었다.

이 책은 아주 세세한 부분까지 가르침을 주는 책은 아니다. 두께도 그다지 없고, 내용의 깊이도 충분하다고 보긴 어렵다. 어떤 미술 사조를 거론하며 권위를 내보이지도 않는다. 이 책은 아주 정갈하고 가볍다.(저자는 가볍다라는 평가에 불만일 수 있겠지만) 왜냐면 나같은 무지한 인간에게도 또렷하게 읽혀졌기 때문이다. 편하게 디자인이라는 개념을 받아들일 수 있도록 친절함으로 글을 적어 놓은 책이 이 책이다.

일부러 강조하지 않으면서도 마크업을 의미 있게 작성해야 하는 이유를 가슴을 두드리며 설득하고 있으며, 접근성이라는 단어를 적지 않으면서도 접근성에 대한 고민을 하게끔 시선을 이끄는 책이었지 않나 싶다. 왜냐면 표준이나 접근성은 너무나 자연스럽게 우리 몸에 베어야 할 무형의 지식이지 강제로 주입되어야 할 암기 과목이 아니기 때문이다.

디자이너에게 좋은 책이지만, 웹퍼블리셔, UI개발자들에게도 한번 읽어보기를 추천하는 책이다.

단비를 보다 I see danbee!

2010-01-23T13:38:00.000-08:00

2010년 1월 21일 오후 5시 18분 세상에 단비가 내렸습니다. 저와 아내의 소중한 아기가 태어났지요. 엄마의 뱃속에서 갓 나온 아기는 온 몸이 붉었고, 아주 크게 울었습니다. 어찌나 크게 울던지요. 3일 동안 찍었던 사진들 가운데 몇 장으로 올려 봅니다. 저와 아내가 함께 운영하고 있는 071231 블로그에는 더 많이 있구요~

2010/1-2주차 클리어보스 소식

2010-01-07T20:12:00.000-08:00

2010년 첫번째 클리어보스 소식입니다.

최근에는 어떤 주제를 던져놓고, 투표(설문)와 의견 나눔을 통해서 글을 이끌어 가보고자 하고 있습니다. 개인 블로그에 쓰듯 단지 저만의 생각과 주장을 적다 보면, 다른 분들의 생각을 충분하게 공유하지 못하는 한계가 있었던것 같아서 이런 방법을 연습해 보고 있습니다. 클리어보스는 저 '개인'만의 공간이 아닌만큼 다양한 주제와 참여를 이끄는 공간으로 만들어볼까 합니다. 그래서 2010년 첫주와 둘째주에는 투표를 통한 설문글이 많았습니다.

주소를 address 요소로 마크업하지 말라?

- HTML5Doctor 에 올라온 글을 번역한 것입니다. address 요소를 적절하게 마크업하는 것에 대해서 고민할 기회를 주기에 번역해서 올려봤습니다.

FAQ의 의미 있는 마크업은?
- FAQ는 일반적인 웹 사이트 제작시 자주 등장하는 콘텐츠입니다. 대부분 DL 요소를 많이 사용하는데, DL 이외의 방법은 없는지 있다면 다른 사람들은 어떤 마크업을 사용하고 있는지에 대한 설문입니다. 현재 진행중입니다. 많은 참여 부탁드립니다.

웹 타이포그래피
- 오페라 웹표준 강좌중 11번째 내용입니다. 웹에서 사용되는 글꼴에 대한 주제로 웹 디자이너 분들께 특히 추천드리는 내용입니다.

어떤 직함이 좋은가?
웹퍼블리셔, UI개발자, 마크업 개발자 등 다양한 이름에 대한 선호도 조사입니다. 1월 2일 현재까지 결과는 UI개발자가 40%로 가장 많은 분들이 선호하고 있음을 알 수 있었습니다. 설문은 당분간 계속할 예정이니 아직 참여하지 않으신 분들은 한 번씩 선택해 주시고, 의견도 남겨주세요.

웹 퍼블리셔의 작업중 가장 오래 걸리는 것은?
- 역시 설문조사입니다. 마크업과 스타일시트, 자바스크립트 등 실무에서 가장 작업 시간이 긴 직무를 선택하는 설문입니다. 대체로 비슷한 결과를 보이고 있습니다. 역시 당분간 계속됩니다.

오페라 웹표준 강좌. 11장. 웹 타이포그래피

2010-01-06T20:15:00.000-08:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 11장. 웹 타이포그래피가 번역 되었습니다. 아쿠아테라님께서 번역을 해 주셨습니다. 이번 장은 웹 디자이너 분들께는 꼭 한번 읽기를 요청드리고 싶네요. 유니버설 디자인에 대한 고민도 함께 해 볼 수 있는 내용이 포함되어 있습니다.

번역된 다른 강좌들:

웹 퍼블리셔세요?

2010-01-06T19:54:00.000-08:00

클리어보스에서는 지난해 2월과 9월 경력이 1년이 못되는 서른명 정도의 분들을 모시고 '웹 퍼블리셔 오리엔테이션'이라는 자리를 가졌었습니다. 그리고 여름과 겨울에 가볍게 오프라인 모임을 갖기도 했었구요. 그 외에도 몇 차례 술자를 통해서 인사를 나눴던 분들도 계셨습니다.

첫 인사를 나누고 나면 으레 디자인을 하시는지 개발을 하시는지 업무를 묻곤 하게 되는데요. 아무래도 자리가 자리이니 만큼 짐짓 '웹 퍼블리셔'이겠지 하면서 "웹 퍼블리셔세요?"라고 질문을 해 봅니다. 그런데 의외로 적지 않은 분들이 머뭇거리시면서 "그게요... 아직은..."이라는 식으로 말 끝을 흐리곤 하시더라구요.

왜 그러셨을까요? 조금 더 이야기를 나누다 보면 저와 하는 일이 거의 같았습니다. HTML과 CSS를 주로 다루고, 자바스크립트를 너무 어려워 하지만 조금씩 공부하면서 적용해 가고 있다구요. 그럼 저는 "아 그럼 웹 퍼블리셔네요~"라면서 "왜 어려워하세요?"라고 되 묻곤 합니다.

그 분들은 웹 퍼블리셔라는 이름에 대한 부담을 갖고 계셨어요. 그리 먼 과거도 아닌 불과 몇 해 전까지만 해도 우리들 같은 사람들을 주로 HTML 코더라고 불려졌고, 그렇게 알아 왔습니다. 하지만 신현석님께서 보다 넓고, 깊은 의미로 직업적인 사명감과 자부심을 갖고자 '웹 퍼블리셔'라는 이름을 제안하셨습니다. 그리고 여러 사람들이 호응을 했고, 지금은 적잖은 곳에서 '웹 퍼블리셔'라는 직함을 사용하고 있지요. 그런데 비슷한 일을 하는데 어떤 회사는 'UI개발자' 누구는 '마크업 개발자' 어디는 계속 '코더'라고 불리고 있다 보니 혼란스러워들 하시더라구요.

웹 퍼블리셔라는 이름은 버겁고, UI개발자나 마크업 개발자, 프론트 앤드 개발자... 같은 여러 이름은 자신의 정체성을 더욱 모호하게 만드는 것 같고... 그렇지 않나 생각해 봅니다.

일단, 왜 '웹 퍼블리셔'라는 이름이 버겁다고 느껴질까요? 제 짧은 생각으로는 직함이 요구하는 전문성의 범위가 생각보다 넓기 때문입니다. HTML을 단지 기계적으로 작성하는 것이 아니라 논리적으로 판단하고, 의미 있게 작성할 수 있어야 하고, 표준에 맞도록 마크업 해야 한다는 것. 물론 CSS도 경제적이고 효율적으로 작성하고, 브라우저간 상호 운용성을 확보할 수 있어야겠죠. 핵은 지양하면서 말이죠. 거기에 웹 접근성 향상을 위한 심리적 부담감과 쉽지 않은 법률과 가이드라인. 거기에 단기간에 상승된 회사내의 입지. 웹 표준과 웹 접근성 이슈는 모두 '우리'에게 전담되어버린 듯 한 상황은 어지간한 경력자라 하더라도 쉽게 감내하기 어려울 수 있다고 봅니다. 사람마다 차이는 있겠지만 상당한 부담감이 될 수 있을것 같습니다. 그렇다 보니 '나는 아직 웹 퍼블리셔는 아니고, 코더다.'라는 생각을 갖게 되고, 족보 없는 가계도가 그려지곤 합니다. 코더를 하다가 웹 표준 좀 하면 웹 퍼블리셔, 그리고 자바스크립트를 조금 다룰 수 있게 되면 UI개발자. 로 말이지요.

지금 클리어보스에서 'HTML, CSS, JS 등을 주로 다루면서 사용자 화면을 설계하는 당신은 어떤 직함이 가장 좋습니까'라는 간단한(?) 설문조사를 진행하고 있습니다. 한 사흘 정도 진행되었는데 UI개발자가 37명으로 가장 많은 분이 택해 주셨고, 웹 퍼블리셔는 20명이 23%, 프론트 앤드 개발자가 13명으로 15%를 차지했습니다. 전체 결과를 보고 싶으시거나 설문에 참여하고 싶으신 분들은 클리어보스를 찾아주세요.

사실 설문의 결과는 그다지 중요하지 않을 수도 있습니다. 특별히 공신력이 있는 사이트도 설문 조사 방식도 아니니까요. 1위 결과를 모두 함께 사용하자라는 캠페인을 벌일 생각은 아예 없구요. 중요한 건 두가지 정도일 것 같습니다. 하나는 지금 이런 고민을 하는 순간이 과도기적 상황이라는 것이구요. 또 하나는 어떤 이름이 중요한 것이 아니라 스스로 자신의 일을 정의하고, 자부심을 갖느냐하는 점이라고 생각합니다. 최근 몇 년 동안 여러가지 상황들이 빠르게 변하면서 '코더'라는 직군이 급 부상한 상황에서 자리를 잡아가고 있다고 생각하구요. 이것은 앞으로도 몇 년은 더 지나야 조금 더 명확한 직무 범위나 가이드라인이 만들어질 것이라고 생각합니다. 그리고 두번째에 대해서 얼마전에 신현석님도 '웹 퍼블리셔의 업무범위'라는 글을 통해서 적으셨지만 우리들이 어떤 이름으로 불리는건 그렇게 중요한 것이 아닙니다. 첫번째 이유를 들어 시간이 정리를 해 줄 것입니다.(물론 그 시간 동안에 여러 사람들의 자발적인 노력과 행동들도 있을 겁니다.) 스스로 한계를 긋고 울타리를 좁게 만드는 것이 문제지요. 어떤 직군이나 자기계발은 언제나 요구되는 덕목입니다. 개발자나 디자이너, 기획자들 모두 다 그렇게 계속 공부하고, 연습하면서 자신의 직무 범위를 넓히고, 깊게 해 나갑니다. 우리도 그래야 한다는 것이지요. 자바스크립트를 어느 정도까지 해야 하는가를 고민하기 보다 일단 시작하시고 할 수 있을 만큼 계속해서 하시는 것이 좋습니다. HTML, CSS, JS, XML, SEO, 표준, 접근성, 시멘틱, 디자인, 도구, UI, UX... 이렇게 나열된 직무 갯수에 지레 겁먹지 마시길 바랍니다. 저도 위에 나열된 것중 어느것 하나 확실하게 잘 하는 것은 없습니다. 걱정하고 계시는 여러분과 크게 다르지 않은 것이지요. 어제도 HTML 공부를 했고, 오늘도 해야 합니다.

어떻게 보면 이런 논의나 설문 자체가 소모적인 논쟁이고, 답이 나지 않는 것일 수 있습니다. 하지만 고민하지 않고 넘기다 보면 나중에는 자신의 의지와 상관없이 큰 흐름에 그저 쓸려 다니기만 하기 쉽습니다.

나 스스로 고민해 보지 않으면 내 것이 되지 않는다. 그게 제 생각입니다.

2009년도 웹 퍼블리셔 연봉 조사 결과

2010-01-03T16:26:00.000-08:00

지난 2009년 12월 20일부터 31일까지 열 하루동안 총 115명이 설문에 참석해 주셨습니다. 최소 연봉자는 1,200만원, 최대 연봉자는 5,800만원까지 나왔네요. 평균 연봉은 2,600만원으로 나타났습니다. 하지만 단순 평균은 의미가 없겠죠. 경력과 기업 분야에 따라서 차이가 날 테니까요. 자세한 결과는 클리어보스에 포스팅되어 있습니다.

추신/ 현재 클리어보스에서 진행중인 설문조사입니다. 많은 참여 부탁드립니다.

웹 퍼블리셔의 작업중 가장 오래 걸리는 것은? 마크업과 CSS, 자바스크립트, 이미지 슬라이스 작업 중 가장 오래 걸리는 작업은 무엇인지 알아보는 설문입니다.
어떤 직함이 좋은가? - 웹퍼블리셔, 코더, UI개발자 등 등 우리는 불려지는 이름도 참 많습니다. 개인적으로 가장 불려지고 싶은 직함은 무엇인가요?

새해부터 이렇게 큰 눈이

2010-01-03T16:20:00.000-08:00

지난주에는 기상청이 대설주의보를 내렸다가 1cm도 채 내리지 않은 눈 때문에 곤혹스러워 하더니 오늘은 갑작스러운 폭설로 서울을 비롯한 주요 도시들 대부분이 온통 눈 난리가 난 것 같습니다.

새해 첫 출근을 하려던 지인들의 발걸음도 모두 묶이고, 평소에도 걸어서 출근을 하시던 어머니가 눈 길에 넘어지시지는 않았을지 걱정이 되어 전화도 드렸네요. 회사에 가장 먼저 도착하실 것 같다고 서둘러야 겠다고 하시며 연신 걸음을 재촉하셨습니다.

온통 눈으로 뒤 덮힌 단지

아무쪼록 모두들 출근길에 사고 없없으면 좋겠습니다. 오늘 같은 날은 회사에서도 지각했다고 혼내지 않을거에요~ 천천히 조심 조심 걸으세요~ 짜증내지 마시구요. 해피 뉴 이어~

2009/12-5주차 클리어보스 소식

2009-12-27T21:31:00.000-08:00

2009년 12월 5주차 클리어보스 소식입니다.

제가 운영하는 두개의 사이트(이 블로그와 클리어보스)의 성격이 많이 닮아 있다 보니 콘텐츠를 배치하는 일이 쉽지 않았습니다. 그래서 앞으로는 강좌나 정보성 콘텐츠는 클리어보스에 올리고, 이 블로그를 통해서는 제 개인적인 생각이나 의견 정도를 담아 두는 곳으로 사용할 계획입니다. 하지만 그동안 제 블로그를 찾아 주셨던 분들을 위해 그리고 클리어보스와의 관계를 위해서 틈틈이 클리어보스에 등록된 새로운 콘텐츠를 리스트 업 해 드리도록 하겠습니다.

클리어보스 소식지로는 첫 포스팅이기 때문에 최근에 등록된 콘텐츠들을 모두 적겠습니다.

편리한 웹 접근성 검사 도구 PAJET - 신현석, 홍윤표님이 제작하시고 배포중인 PAJET 도구에 대한 간단한 가이드입니다. (주의:접근성 자동 평가 도구는 아닙니다. 사용자의 수동 평가를 도와주는 도구입니다.)
CODA에서 Less 사용하기 - CSS를 프로그래밍 방식(변수를 정의하고, 함수를 다루듯)으로 작성할 수 있게 도와주는 Less를 CODA와 연동하는 방법입니다.
웹기반 에디터 분석 - CKEditor, DAUM OpenEditor, Naver Smart Editor 등 웹 기반의 에디터 분석 자료입니다.
웹퍼블리셔 평균 연봉 (설문 진행중) - 2009년 웹 퍼블리셔들의 평균 연봉을 조사하고 있습니다. 연말까지 설문을 받은 뒤 1월초에 별도로 포스팅할 예정입니다.
어떤 사람들이 웹퍼블리셔가 될까? (설문 진행중) - 웹기획자, 디자이너, 개발자 등 어떤 분야의 사람들이 주로 웹퍼블리셔로 전직하는지에 대한 설문조사입니다.
IE6 커닝 페이저: IE6 버그+ 해결하는 방법 - IE6의 여러가지 문제들을 해결하기 위한 종합 안내서와 같은 글입니다. 번역된 콘텐츠입니다.

짤막한 2009년 후기.

2009-12-27T21:21:00.000-08:00

2009년의 마지막 달도 이제 나흘 정도 남았습니다. 크리스마스였던 25일부터는 눈도 제법 내려서 서울이라는 거대한 도시가 숨어버린듯 새하얗게 변하기도 했구요. 가슴속을 파고드는 차가움이 무척이나 생기롭게 느껴졌습니다. 한편으로는 부지런하지 못했던 제 자신을 들킨것마냥 부끄럽기도 했구요.

2009년은 제게 참 많은 일들이 있었습니다. 클리어보스라는 웹표준 모임의 활동도 그 어느때보다 활발했구요. 2월과 9월에 웹퍼블리셔 오리엔테이션이라는 작은 세미나를 개최했고, 세번째 웹표준의날과 CSS Nite in Seoul, Vol.1 행사의 자원봉사와 기획, 운영을 맡기도 했구요. 개인적으로도 여러 세미나에서 발표를 해 보면서 스스로 더 커질 수 있는 기회도 있었습니다. 그 가운데에서도 아내를 맞은 결혼식이 가장 기억에 남구요. 최근에는 회사가 어려워서 휴직을 하게 된 일과 프리랜서로 집에만 있게 된 사연들... 이 기억에 나네요. 정말 많은 일들을 했고, 바빴고, 힘겨웠던 시간들이었던 것 같습니다. 그런데 참 이상한건 그 이전에 비해 무척 담담해지고, 걱정이랄게 없어졌습니다. 아무래도 제 곁에 저를 든든하게 지켜주고, 힘들 때 위로해줄 사람이 생겼기 때문이 아닐까 싶습니다. 그래서 2010년이 그렇게 두렵지 않습니다.

2010년에는 제 나이도 어느덧 서른이 되구요. 한 가정의 아버지가 되기도 합니다. 새로운 마음가짐으로 일을 하게 될 것이구요. 개인적으로 꿈 꾸던 일 하나를 매듭지을 수 있을것도 같구요. 그래서 그런가요. 어서 2010년이 되었으면 하는 생각도 드네요.

'장애인 웹 사용 실태 조사' 참여해 주세요

2009-12-22T21:20:00.000-08:00

웹 접근성 스터디 모임(신현석, 정찬명, 조현진, 현준호, 홍윤표)에서 장애인이 실제로 느끼고, 실제로 사용하는 문제점 등을 파악하여 장애인이 보다 웹을 자유롭게 쓸 수 있는 기초자료로 활용하기 위해 실태조사를 실시한다고 합니다.

이번 실태조사는 장애인만을 대상으로 하는 것으로 비장애인은 설문에 참여하지 않습니다. 주변에 장애인 분이 계시다면 참여를 부탁드려 주세요.

다음은 실태조사 설문지 내용

장애인 웹 사용 실태조사

안녕하십니까?

저희는 웹 접근성 개선에 조금이나마 도움이 되고자 공부를 하는 사람들의 모임입니다.

저희 모임의 참석자들은 "장애인차별금지 및 권리구제 등에 관한 법률" 제정으로, 앞으로 우리나라에서 장애인이 더 이상 장애로 인한 차별을 받지 않는 세상이 되기를 진정으로 바라고 있습니다.

많은 분들이 알고 계시는 것처럼 인터넷은 쇼핑, 정보습득, 은행업무, 정부 민원, 커뮤니티 등 이제 생활의 필수 수단으로 등장하고 있습니다. 이에 우리나라에서도 장애인의 인터넷 이용 개선을 위해 웹 접근성 제고를 위한 표준화, 교육 등 다양한 사업들이 진행 중에 있습니다.

하지만, 장애인이 직접 인터넷을 활용하는 방법에 대해 풍부한 통계가 없어, 저희 모임에서 의욕적으로 이를 진행해 보고자 합니다.

본 설문조사는 어떠한 공공이나 민간기업의 지원에 의해 실시한 것이 아니며, 웹 접근성을 고민하는 사람들이 웹 접근성 관련되는 통계를 만들어 보고자 하는 의도로 기획되었음을 알려 드립니다. 장애인의 실제로 느끼고 실제로 사용하는 문제점 등을 파악하여 보다 장애인이 웹을 자유롭게 쓸 수 있는 기초자료로 활용하고자 합니다.

본 설문조사의 취지를 이해해 주시고 장애인 여러분의 많은 참여 부탁드리며 보다 많은 장애인분들이 설문에 참여할 수 있도록 알려 주시면 감사하겠습니다.

본 설문조사는 장애인만이 해당됨으로 비장애인은 설문에 참여하지 마시기를 간곡히 부탁드립니다.

웹 접근성 스터디 모임 일동(신현석,정찬명, 조현진, 현준호, 홍윤표)  올림

2009년 11월

장애인 웹 사용 실태조사 참여하기

Firefox 3.5 세계에서 가장 인기 있는 웹브라우저 되다

2009-12-21T16:23:00.000-08:00

StatCounter 통계에 의하면 현재 세계에서 가장 인기 있는 웹브라우저는 Firefox 3.5인 것으로 나타났습니다.

Firefox 3.5가 IE 6,7,8을 모두 제치고 1위로 올라섰다

물론 IE의 모든 버전을 합치면 여전히 두배가량의 격차를 가지고 있지만 IE6와 IE7이 상당히 점유율을 잃고 있고, IE8의 상승세가 그렇게 크지 않다는 점을 볼 때 Firefox 3.5가 가지는 '1위 등극'의 의미는 남다를 수 밖에 없을 것 같습니다.

버전과 관계없이 브라우저별 점유율에서는 IE가 여전히 선두다

하지만 이런 상황에서도 한국은 여전히 IE의 초강세를 벗어나지 못하고 있습니다. IE8의 점유율 향상이 그나마 다행스럽게 여겨지는 대목입니다. 그런데 Firefox 3.0과 3.5는 기대만큼 상승 분위기를 타지 못하고 슬며시 하향 곡선을 그리고 있는 것이 보이네요.

한국의 웹 브라우저 점유율. IE8의 상승률이 두드러진다.

위 그래프만 놓고서 2010년을 예측하는 것은 위험할 수 있지만 적어도 전세계적으로는 Firefox가 더 이상 IE6보다 점유율이 낮기 때문에 지원 브라우저에서 빠질 일은 없을 것 같습니다. 반대로 IE6에 대한 개발 리소스 등을 이유로 들어 지원을 중단하는(이미 몇 몇 기업들이 그런 움직임을 보이기도 했죠) 상황도 연출되리라 봅니다.

문제는 우리인데. 현실적으로 Firefox에게 큰 기대를 걸기는 어려울 것 같습니다. 하지만 웹표준을 비교적 잘 준수하고 있는 IE8의 상승폭이 작지 않다는 점. 그리고 올 하반기 아이폰의 정식 출시로 인해 2010년의 최대 화두 중 하나는 '스마트폰'일 것이며, 스마트폰으로 즐기는 인터넷이 큰 이슈가 될 것이라는 점입니다. 아이폰의 기본 브라우저는 사파리이며, 모바일 브라우저의 최대 강자는 '오페라'죠. 내년이 그렇게 암울할 것 만 같지 않은 까닭은 거기 있습니다. 2010년에 불여우가 조금 더 힘을 내 주기를 바라면서 2009년보다 더욱 더 아름다워질 대한민국 인터넷을 꿈 꿔 봅니다.

CSS 메타프레임워크를 사용하는가?

2009-12-21T08:31:00.000-08:00

Less나 Sass와 같은 CSS 메타프레임워크를 사용하는가? 라는 흥미로운 투표가 진행중입니다. CSS 메타프레임워크는 CSS를 개발언어처럼 변수도 지정하고, 분기문이나 반복문을 작성하여 효율적(?)으로 작성 및 관리할 수 있도록 해 주는 프레임워크입니다. 처음 Sass를 접했을 때 그 방식에 충격도 받았고, 아주 획기적인 것이라고 생각했었는데요. 제 경우에는 그것을 익히는 것 자체가 부담이었고, 그것을 제대로 사용하려면 함께 작업하는 웹 퍼블리셔들 모두가 함께 배워야 제대로 써 먹을 수 있다는 것이었습니다. 그리고 그렇게 사용하더라도 CSS 코드를 있는 그대로 읽고 해석하는게 아니라 한 번 더 논리적인 판단과 고민을 거쳐야 하는 문제가 있었죠. 굉장한 것이기는 하지만 효용성 자체를 아직 느끼지 못한 것이었습니다.

PollDaddy.com에 올라온 이 투표는 저만 그런 생각을 가지고 있었던것은 아니라며 위로를 해 주는 것 같습니다. 아직 진행중이기는 하지만 368명이 투표에 참여를 하고 76%에 달하는 사람이 전혀 사용하지 않는다를 선택했습니다. 거의 사용하지 않는다라고 선택한 11%를 합치면 87%가 되는군요.

CSS 메타프레임워크를 사용하는가? 라는 투표가 진행중이다

2009년 웹 퍼블리셔 평균 연봉 조사, 참여해주세요.

2009-12-20T18:11:00.000-08:00

지난해에 이어서 올해도 웹퍼블리셔 평균 연봉 조사를 해 보려고 합니다. 2008년은 경제 위기까지 겹쳐 비단 웹 퍼블리셔들 뿐 아니라 여러 직군들이 모두 힘들었던 한 해가 아니었나 싶습니다. 그래서 대다수의 기업들이 연봉 동결 내지는 삭감을 단행했던 해이기도 하구요.

또 한편으로는 공공기관의 웹접근성 사업으로 인해 웹 퍼블리셔들에 대한 수요가 많이 들었지만 부족한 인력 때문에 연봉 인상에 대한 기대치를 높였던 해이기도 했습니다. 그만큼 새로운 인력들이 비전을 갖고 도전하는 직업이 되어 가고 있기도 합니다. 하지만 우리들 스스로가 느끼기에 자신의 연봉은 항상 부족하고, 속상할 정도의 크기였지요.

올 한 해는 어느정도의 평균 연봉이 나타날지 궁금하기도 하고, 내년에는 얼마정도를 예상해 볼 수 있을지 한 번 조사해보려고 합니다. 많이 참여를 해 주실수록 통계에 대한 믿음도 커질 수 있지 않을까요.

로드 중...

현재까지 설문 결과

클리어보스 개편 소식

2009-12-20T05:48:00.000-08:00

웹 표준을 알리는 사람들의 모임 Clearboth 공식 사이트에 변화를 주었습니다. 콘텐츠를 생산하던 위키와 게시판 운용을 위해 개설했던 포럼이 서로 다른 로그인 시스템을 갖고 있다보니 사용하기도 불편하고 해서 이번에 통합작업을 진행했구요. 함께 UI도 통일 시켰습니다.

아이폰과 같은 스마트폰에서 클리어보스에 접속하다 보니 우측으로 배치되어 있던 메뉴 영역 때문에 콘텐츠 영역이 상당히 작아져 보이는 문제도 있어 이번에는 상단에만 메뉴를 배치하는 레이아웃을 가져왔습니다.

새로운 클리어보스

스마트폰에서 손가락으로도 메뉴를 비교적 잘 클릭할 수 있도록 충분한 패딩을 주었구요. 메뉴명을 좀 더 크게 해서 보이게 하고 싶기는 했는데 그러다보니 너무 안 예쁘더군요. 일단 이정도로만-

그리고 일반적으로 사용자들은 위키라는 것을 어려워하고 생소해 합니다. 때문에 개편된 클리어보스에서는 '위키'라는 명칭을 최대한 감추어버렸습니다. 포럼과 위키가 하나의 웹 사이트처럼 보이도록 메뉴를 배치했습니다. 포럼은 내부에 여러개의 게시판(포럼)을 가지기 때문에 큰 메뉴로 '포럼'을 유지하였습니다. 하지만 여전히 실제로는 포럼을 제외한 나머지 페이지들은 '위키'로 제작되고 운영되는 것들이죠. 하지만 앞으로는 운영진만 위키 페이지를 조작하게 될 것 같습니다.

나름 2010년을 위한 리뉴얼 작업이었습니다. 일주일 정도의 작업 시간이 소요되었구요. 루트박스님이 여러가지로 많은 도움을 주셨습니다. 내년에는 보다 많은 콘텐츠를 채우고, 웹퍼블리셔 오리엔테이션과 함께 실무자들을 위한 기술 세미나도 새롭게 개최를 해 볼 작정입니다. CDK만큼 훌륭한 사이트로 만들고 싶네요.

웹개발자를 위한 스크린리더 이해 세미나 후기

2009-12-12T05:20:00.000-08:00

오늘 오후 2시 '웹개발자를 위한 스크린리더의 이해 그리고 웹 접근성(이하 스크린리더 세미나)'이라는 제목으로 세미나가 있었습니다. 서울 삼성동에 위치한 잡코리아에서 두번째로 갖는 행사였구요. 백남중 선생님께서 긴 시간 강의를 해 주셨고, 장성민과 여러 자원봉사자 여러분들이 행사를 위해 준비를 해 주셨던 자리였습니다.

백남중 선생님

이번 스크린리더 세미나는 지난 1회 세미나와 거의 동일한 내용으로 진행되었지만 아무래도 한 번 진행을 해보셨던 부분이라 그런지 1회보다 더 깔끔하고 시연들이 많았던 것 같습니다. 그리고 여러가지 보조기기들을 전시하여 참석자들이 직접 눈으로 보고, 만져보는 등 '실감'할 수 있는 기회도 가졌습니다. 그리고 이번 2회 세미나에서는 뭐니 뭐니 해도 1회에 없던 '경품'이 생겨 나서 모두들 반가워 했는데요 백 선생님께서 직접 스크린리더 제품인 '센스리더' 2개를 경품으로 지원해 주신 것이었어요. 강의료를 드려도 모자를 판에 이렇게까지 해 주신데에는 한 분의 개발자라도 더 시각장애인분들을 위해서 올바른 웹을 만들어 주십사하는 진심 때문이셨을 것이라고 생각합니다. 오늘 '센스리더'를 받아 가신 두 분께서는 다른 분들보다 더 열심히 웹을 아름답게 만들어 주셔야 할 '사명감'이 있으신 겁니다. (^^ 아셨죠?)

이번 스크린리더 세미나의 아쉬움이었다면 조훈님의 웹접근성 세션 하나가 아쉽게 취소된 것이었지요. 오랜만에 아니 저 개인적으로는 처음으로 조훈님의 강의를 들어볼 수 있었던 기회이기도 했는데요 내년으로 미뤄야 했습니다.

질의 응답 시간

그리고 마지막 세션으로 말도 안되지만 저를 포함해 4분의 전문가(여기서 저는 절대 전문가일리 없다는 해명을 하면서)를 모시고 질의 응답 시간을 가졌습니다. 사전 설문지를 통해서 깔끔하게 작성된 질문지를 들고 답변을 드리는 시간이었구요. 오페라 소프트웨어의 신현석님과 요즘 웹표준 강의로 많이 바쁘신 조현진님, 기획자지만 개발 실력도 수준급이라는 나인환님, 그리고 부족하기 짝이 없는 제가 성의껏 답변을 드렸습니다. 여러 질문들이 있었고, 앞에 나와 있던 분들도 참 대답하기 어려운 질문들도 있었구요. (몇가지 질문에 대해서는 시간이 되는대로 제 블로그를 통해서 이야기를 풀어보고 싶기도 합니다.)

그렇게 예정된 종료 시간을 40여분 정도를 넘기고서야 공식적인 일정이 모두 마쳐졌는데요. 아마 지금 이 시각엔 송년회겸 마련된 뒤풀이가 한참일 것으로 생각됩니다. 행사를 준비하신 모든 분들과 백남중 선생님, 패널분들, 그리고 참석자 한 분 한 분이 모두 수고하셨던 하루였습니다.

질의응답 시간에 나왔던 마지막 질문 하나가 집으로 돌아오는 내내 제 머리속에서 지워지지 않고 남아 있습니다. 미래의 웹접근성은 어떻게 될 것인가?라는 것이었어요. 여러분은 한 달 후 2010년 1월과 조금 더 지난 미래, 더 먼 미래에 우리의 웹이 어떻게 변하게 될지 예상하실 수 있으신가요?

저는 솔직히 모르겠습니다. 근래들어 내가 알아본 웹표준과 웹접근성이라는 지식의 알갱이들이 과연 진실이었고, 실체를 가진 것들인지. 그것들이 하루 뒤에 한 달 뒤에 어떻게, 어떤 모습으로 어떤 의미로 다시 내 감각들을 자극할지를 말이죠.

현석님이 마지막으로 마이크를 잡으시고 이렇게 말씀하셨죠. HTML이 제대도 만들어져 있다면 미래가 지금보다 더 발전했건 못 했건 우리는 콘텐츠에 접근할 수 있을 것이라구요. 미래에 어떤 새로운 표준 명세서가 발표되고, 기술이 만들어지더라도 겁먹을 필요가 없다는 말씀이신것 같아요. 현재 우리가 할 수 있는 방법으로 가장 정직하게 웹을 만들어 놓는다면 그것이 바로 현실에 대한 최선이자 미래를 대비하는 최고의 방법일 수 있을 거라는 거죠.

2010년. 많은 것들이 변하고 그래서 또 힘들 시간이 될 것이라고 생각합니다. 하지만 저는 왠지 2008년에서 2009년으로 넘어가던 그 겨울보다는 올 겨울. 이 시간이 조금 더 편안합니다. 그리고 덜 걱정되구요. 올 한해 정말 많은 분들이 웹표준을 공부하셨고, 웹 접근성을 이해하셨잖아요. 그 한 분 한 분이 2010년에는 더 많은 분들을 이해시켜서 정말 아름다운 웹을 만드실테니까요.

웹개발자를 위한 스크린리더의 이해 그리고 웹 접근성

2009-12-08T01:49:00.000-08:00

지난 9월에도 한 차례 가졌던 '웹 개발자를 위한 스크린리더의 이해' 세미나가 불과 두달여 만에 업그래이드 되서 두번째 세미나를 갖는다고 하네요.

역시 이번에도 장성민님께서 수고를 해 주고 계시구요. 한국 시각 장애인 복지관의 백남중 선생님과 디비딥의 조훈님께서 강의를 해 주신다고 합니다.

웹 접근성이 이슈화 되면서 많은 분들이 스크린리더에 대한 관심을 갖고는 있지만 실상 제품이 몇개 없고, 개인이 구입하기에는 가격도 많이 비싼 편입니다. 그래서 실제로 테스트를 해볼 수 있는 여유가 거의 없는게 현실인데요. 이 날 세미나에 참석하시면 국내 스크린리더의 역사부터 시작해서 실제 구현되는 모습과 음성을 들어보실 수도 있습니다.

첫 세미나 때는 조훈님의 발표는 없었는데 아마도 웹 접근성과 관련해서 최신의 정보를 알려 주시지 않을까 기대가 됩니다.

현재 스무명 남짓 되시는 분들이 신청을 마친 상태입니다. 총 40명을 모으는 세미나이니만큼 꼭 듣고 싶으신 분들은 서둘러서 신청해 주셔야 할 것 같습니다.

IE6 커닝 페이퍼: IE6 버그 25+ 해결하는 방법

2009-12-05T23:19:00.000-08:00

Virtuosi Media의 Benjamin이 만든 아주 환상적인 커닝 페이퍼였던 Ultimate IE6 Cheatsheet: How To Fix 25+ Internet Explorer 6 Bugs를 기억하시는 분들이 많을 것 같습니다. 아마 대부분 즐겨찾기를 해 두셨을 겁니다. 그리고 궁금한 것이 생길 때마다 찾아보시곤 하시겠지요.

그런데 아쉽게도 이 문서는 영문이기 때문에 조금 어렵게 생각하시는 분들도 많았습니다. 저 역시 그랬구요. 하지만 다행히도 이제는 한글로 된 이 커닝 페이퍼를 읽어보실 수 있습니다.

저의 훌륭한 동료이자 형인 이석진 선임 연구원께서 제 부탁을 거절치 못하시고 번역을 해 주셨거든요! 이석진님은 훌륭한 UX기획자로 일을 하고 계십니다.

UI개발이나 웹표준쪽은 거의 알지 못하십니다. 그래서 제가 조금 문맥을 고치는 작업을 진행했습니다. 그럼에도 오타나 오역이 있을 수 있으니 혹시 발견하신다면 제 블로그나 커닝 페이페 문서(위키)의 의견란에 남겨주세요!

Ultimate IE6 Cheatsheet: How To Fix 25+ Internet Explorer 6 Bugs

IE6 커닝 페이퍼: IE6 버그 25+ 해결하는 방법

잠쉬 회사를 쉬게 되었습니다.

2009-12-03T20:20:00.000-08:00

2008년 가을이 끝나갈 무렵 가슴에 뜨거운 것 하나를 끌어안고 지금 회사에 입사를 했던 것이 기억납니다. 그렇게 1년하고 한 달 동안 여러 사람들을 만나고, 함께 일을 해 오면서 즐겁기도 했고, 고되기도 했었습니다. 또, 그렇게 앞으로 1년, 또 1년 내 꿈을 키워볼 수 있겠지 하며 달려왔습니다.

하지만 참 그게 쉽지 않다는 것을 다시 한 번 느껴봅니다. 제가 다니는 회사에 대해서 안밖으로 말이 많습니다. 제 블로그를 통해서는 회사 이야기를 한 번도 한 적이 없지요. 물론 지금도 굳이 회사 이야기를 들어 내밀 마음은 없습니다. 그저 현재의 상황이 아쉽고 속상할 따름이지요. 어찌되었든 저는 당분간 회사를 쉬게 되었습니다. 외적 상황에 의한 것이긴 하지만 선택은 스스로 한 것이기 때문에 혹여라도 오해들이 없으셨으면 하여 덧붙입니다.

아직 쉬는 동안 해야 할 일을 확실히 결정하지는 못했습니다. 몇 가지 계획한 것과 시작한 것이 있지만 그 것들이 회사를 대신하여 제게 한달치 월급을 챙겨주지는 못할 것 같네요. 아내와 곧 태어날 아기를 위해서 가장의 몫은 해야 할 테인데 말이죠.

걱정도 많지만 딱히 불안하거나 부정적인 상황은 아닌것 같습니다. 쉽게 얻을 수 없는 기회라고 생각하고 값지고 훌륭한 일들을 찾아서 해보고 싶기도 합니다. 아내에게 조금 더 따듯한 남편이 될 수 있는 시간을 갖는 것과 운영하는 커뮤니티를 조금 더 멋진 곳으로 만들어내는 것과 내 욕심을 담은 작은 것들 몇 가지를 이루어 내는 시간으로 말이지요. 또, 쉬는 동안 만큼은 이 블로그도 열심히 운영해 볼 수 있지 않을까 싶기도 합니다.

오페라 웹표준 강좌 50. 자바스크립트 애니메이션

2009-12-01T21:28:00.000-08:00

오랜만에 클리어보스에서 번역중인 오페라 웹표준 강좌 하나가 공개되었습니다.

50장. 자바스크립트 애니메이션이고 졸린눈이님께서 번역 작업을 진행해 주셨습니다.

번역된 다른 강좌들:

CSS Nite in Seoul 발표 자료(PDF) 공개

2009-12-01T16:53:00.000-08:00

지난 11월 21일 서울 삼성동 한국 마이크로소프트에서 열렸던 CSS Nite in Seoul, Vol.1의 발표 자료가 CSS Nite in Seoul 공식 사이트를 통해서 공개되었습니다. 여러 분들께서 제 블로그에 문의를 남겨 주셔서 따로 공지차 포스팅을 해 봅니다.

공식사이트 발표자료 공개 글(http://cssnite-seoul.regraphy.com/archives/457)

박 태준（주식회사 NHN 웹표준1팀팀장）- 웹표준을 기반으로 한 HTML 개발 프로세스
타가노 마사히로（주식회사 스위치 대표 이사）- 일본의 웹표준 현실과 제작 프로세스
마시코 다카히로（주식회사 사이버가덴 대표 이사）- 미래의 웹표준으로써의 HTML5과 CSS3

더불어 동영상 자료는 한참 편집중에 있고, 현재는 오프닝 동영상이 공개되어 있습니다. HTML5의 VIDEO 요소를 이용해서 마크업된 웹페이지입니다. Firefox, Safari, Chrome 등 최신 브라우저를 이용하시면 보실 수 있습니다.

CSS Nite in Seoul, Vol.1을 마치고

2009-11-22T19:48:00.000-08:00

꽤 오랜만에 블로그를 통해서 인사를 드리게 되었습니다. 지난 몇 주간 개인적으로 여러가지 일들이 생겼고, 그 중 하나는 CSS Nite in Seoul, Vol.1 행사를 준비하는 것이었습니다. 그리고 이렇게 무사히 행사를 마치고 간단한 소회를 남기고자 블로그를 열었습니다.

CSS Nite in Seoul, Vol.1 단체사진

지난 21일 토요일 오후에 대문을 열었고, 한 분씩 자리에 모시기 시작했습니다. 행사가 공식적으로 시작되는 1시가 되자 거의 모든 분들이 자리를 빼곡히 채워 주셨구요. 물론 유료 세미나라는 점 때문에 미리 내주신 돈 때문(?)이실지는 모르겠지만^^ 준비한 저희들로써는 너무나 감사드리는 부분이 아닐 수 없었습니다.

그런데 하루 전날 갑작스럽게 행사 장소와 관련하여 문제가 발생했었구요. 때문에 3시간 가까이 예정보다 좁은 장소에서 여러분들을 모실 수 밖에 없었습니다. 이런 일이 생기면 안되는 것이었는데 정말 정말 죄송하다는 말씀 말고는 드릴 말씀이 없었습니다. 그나마 3시 이후에는 본래대로 넓은 세미나룸을 모두 사용할 수 있게 되어 한 시름 놓기도 했었습니다.

사실 저는 밖에서 주로 관리와 운영을 담당했기 때문에 세션 발표를 하나도 듣지 못했습니다. 그래서 내용과 관련해서는 적을 것이 거의 없네요^^; 동영상을 촬영해 놨고 지금 아마도 인스카님께서 열심히 편집 작업을 진행하고 계신줄로 압니다. 그것이 완료되면 자원봉사자들도 볼 수 있지 않을까 싶습니다. 그리고 아직 확정되지는 않았지만 영상과 사진등을 더 많은 분들이 보실 수 있도록 공개도 하지 않을까 싶습니다.

일단은 CSS Nite in Seoul 미투데이 페이지에서 핸드폰과 스마트폰, 카메라 등으로 촬영된 일부 사진들이 올라와 있습니다. 행사장 풍경이 궁금하셨던 분들은 찾아주셔서 구경도 해 주시고, 댓글도 달아 주시면 감사하겠습니다. 아울러 행사에 참가해 주셨던 분들께서 개인 블로그나 커뮤니티 게시판, 트위터와 미투데이 등에 후기를 남겨주시면 저희에게 너무 큰 선물이 되지 않을까 싶습니다.

설문지를 통해서 평가를 해 주셨지만 진솔하고 작성해 주신 후기 하나 하나를 통해서 다음 행사를 더욱 더 멋지게 준비할 수 있지 않을까 생각해 봅니다.

아무쪼록 한국이라는 작은 나라에서 '웹'이라는 직업을 갖고 살아가시는 모든 분들께 작으나마 기운과 정보를 드리고자 준비했고, 기꺼이 제 수고를 아끼지 않았습니다. 모두가 만족할 수 있는, 내신 돈이 아깝지 않은 세미나를 만들기 위해서 또 고민하고, 노력하겠습니다.

일본의 CSS Nite와 리그라피, 스폰을 해 주신 한국 마이크로소프트와 Tag & Brace, IT인재개발원. 후원해 주신 Clearboth, CSS Design Korea, 하드코딩하는 사람들, 도서출판 길벗. 관계자 모든 분들께 다시 한 번 감사의 인사를 드립니다.

감사합니다.

덧붙임.CSS Nite 주최자이시고 이 날 발표를 해 주신 타카노 마사히로씨가 찍은 사진들 보기

웹접근성 지지 서명 운동 동참해주세요!

2009-10-25T19:18:00.000-07:00

행정안전부가 주최하고 한국정보문화진흥원에서 주광하는 웹 접근성 지지서명 운동이 진행중입니다. 예전에도 한 차례 진행되었던 서명 운동이었는데 이번에 여러 후원 업체를 등에 업고, 경품까지 마련해서 다시 진행하는 것 같네요.

경품도 경품이지만 웹 접근성 향상을 위한 이같은 노력은 그것 자체로 매우 의미가 있는 운동입니다. 보다 많은 분들이 동참하여 '차이를 넘어 차별없는 세상을 만드는 웹 접근성'이 완성되기를 바라겠습니다.

웹 접근성 지지서명 운동 웹사이트

지지서명 참여는 아래 웹페이지에서 간단히 남기고 싶은말씀을 적어주시면 됩니다. 꼭 참여해 주세요!

웹접근성 지지서명 웹페이지

CSS Nite in Seoul Vol.1 무료 초대권 이벤트 담청자 발표

2009-10-21T18:14:00.000-07:00

클리어보스에서 진행한 CSS Nite in Seoul Vol.1 무료 초대권 이벤트 담청자 발표입니다.

총 열 분이 참여해 주셨습니다. 진심으로 감사의 말씀을 드리면서 약속한 시간(21일)이 지났기 때문에 추첨을 해야만 했습니다. 추첨 방식은 네이버에서 '사다라게임'을 검색하니 플래쉬로 만들어진 사다리 게임이 바로 나오더군요. 그 녀석을 이용했구요. 혹시라도 오해를 하실까봐 아래 화면을 캡쳐했습니다. 또 하나 공정성을 위해 양심껏 딱 한 번 실행했습니다.

CSS Nite in Seoul Vol.1 초대권 이벤트 추첨을 위한 사다리게임 준비

CSS Nite in Seoul Vol.1 초대권 이벤트 추첨을 위한 사다리게임 결과!

그리하여 김요한, 위연주, 박민호 이상 세 분께 무료 초대권을 드리게 되었습니다.
축하드립니다~ 혹시라도 참석이 어려우신 경우에는 제게 꼭 말씀해 주시기를 부탁드리겠습니다.

한국에서 가장 많이 사용하는 HTML에디터는?

2009-10-18T17:21:00.000-07:00

클리어보스에서 지난 9월 3일부터 '가장 많이 사용하는 에디터는?'이라는 주제로 웹제작자들이 주로 사용하는 에디터 사용율 조사를 실시해 보았다.

한국에서 가장 많이 사용하는 HTML 에디터

조사 결과는 Editplus+가 46%로 절반에 가까웠고, 그 뒤를 DreamWeaver가 17%를 차지하며 따르고 있다. vi와 Eclipse, UltraEdit, Aptana 등이 그나마 5%내외의 사용율을 보이고 있고, 그 외의 에디터들은 1,2%도 채 되지 않는 사용율을 보이고 있다.

앞서 woorkup.com에서 발표한 HTML 에디터 사용율 결과와 비교해 보면 한국에서의 에디터 사용율이 특정 플랫폼과 에디터에 과도하게 집중되어 있음을 알 수 있다. Wookup.com의 결과를 살펴보면 맥과 윈도우 플랫폼에서 각각 CODA와 Notepad++라는 제품이 자리를 잡고 있으면서도 DreamWeaver와 Aptana와 같은 크로스 플랫폼이 비슷한 수준의 사용자 수를 확보하고 있음을 알 수 있다.

해외나 우리나라나 비슷하게 나타나는 것은 DreamWeaver나 Aptana와 같은 다양한 기능을 탑재한 고급 에디터보다 하드 코딩에 적합한 가벼운 에디터들을 주로 선호한다는 점이다. 또, 우리나라야 맥 사용율이 워낙 낮다 보니 맥 기반의 CODA나 Espresso같은 에디터들이 겨우 1,2%를 차지하는 정도이지만 해외의 경우에는 CODA와 Textmate 같은 에디터들의 사용율이 매우 높게 나타나는 것을 알 수 있다.

에디터 자체가 웹표준을 준수한 웹사이트를 만드는데 절대적인 도구가 될 수는 없기 때문에 특정 제품 하나가 지나치게 점유율이 높다고 해서 크게 문제가 될 것 같지는 않다. 물론, 과거에 나모 웹 에디터나 DreamWeaver의 구 버전처럼 오류 투성이의 마크업을 양산해 내는 에디터들이 시장을 잠식하고 있다면 문제가 될지도 모른다. 하지만 해외나 국내나 대체로 위지익이 아닌 텍스트 기반의 에디터들이 주류를 이루고 있고, 정도의 차이는 있지만 거의 대부분의 최신 에디터들은 마크업과 스타일시트에 대한 유효성 검증을 지원하고 있다.

어쨌든 이번 에디터 사용율 조사는 예측 가능한 결과(Editplus+의 압도적 승리?)를 놓고 얼마나 많은 에디터들이 사용되고 있을까에 대한 궁금증이 더 컸던 조사였던것 같다. 개인적으로도 윈도우에서 Editplus+ 를 가장 많이 사용하고 있고, 그 편리함을 쉽게 버릴 수 없기는 하지만 최근에 Editplus+ 외에 여러 에디터들을 사용해 보면서 생각보다 편리하고 강력한 에디터들이 꽤나 많다는 것을 알았다. 그리고 그러한 에디터들이 조금의 노력만 덧붙여진다면 Editplus+ 에 익숙해진 코딩 패턴을 바꿔줄 수도 있을 것이고, 웹 사이트를 제작하는데 더 나은 환경을 제공해 줄지도 모른다.

Editplus+ 도 계속해서 발전해 나가기를 바라고, 더불어 다른 여러 에디터들도 함께 발전해서 도대체 뭘 써야 할 지 모를 행복한 고민을 하게 해 줬으면 좋겠다.

HTML 에디터 전쟁: 당신은 어떤 에디터를 사용하는가?

2009-10-18T16:50:00.000-07:00

Woorkup.com에서 지난 10월 16일 HTML 에디터 사용자 조사를 실시한 결과를 발표했습니다.

전체적으로 볼 때 Coda와 Dreamweaver, Notepad++ 가 약 20%씩 차지하고 있는 것을 알 수 있었구요. 맥 사용자들은 대체로 Coda를 사용하고, 윈도우 사용자들은 Notepad++를 이용하고 있었다고 합니다. Dreamweaver는 맥과 윈도우 모두에서 두루 나타난것 같습니다.

HTML Editors Distribution

오페라 웹표준 강좌 45장. 자바스크립트 객체

2009-10-12T22:43:00.001-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 45장. 자바스크립트 객체가 번역 되었습니다.

번역된 다른 강좌들:

웹표준 컨퍼런스 CSS Nite 한국 첫 개최!

2009-10-12T22:43:00.000-07:00

CSS Nite in Seoul 실행위원회와 (유)리그래피가 함께 주최하고, 한국 마이크로소프트와 태그앤브레이스가 협찬하고, 하드코딩하는 사람들, CSS Design Korea, Clearboth가 후원을 하는 웹표준 컨퍼런스 CSS Nite in Seoul Vol.1이 오는 11월 21일 토요일 삼성동 한국 마이크로소프트 세미나룸에서 개최됩니다.

CSS Nite는 나고야, 오사카, 아오모리, 후쿠오카, 오키나와, 아키타, 삿포로, 후쿠이, 센다이, 히로시마 등 일본의 여러 도시에서 지금까지 총 113회의 컨퍼런스를 통해 18,191분이 참여한 가장 규모가 큰 웹표준 컨퍼런스입니다.

이번 기회를 통해 CSS Nite는 한국과 일본 양국간의 웹제작들간의 교류와 정보 공유를 위해 자리를 마련했고, 그 시작을 서울에서 하고자 합니다.

이번 첫번째 컨퍼런스를 위해 국내에서도 웹표준 교과서의 저자로 잘 알려져 있는 마시코 다카히로씨께서 멀지 않은 미래에 표준이 될 HTML5와 CSS3에 대한 발표를 해 주시고, CSS Nite 의 주최자였던 타가노 마사히로씨께서 일본 웹환경과 제작 프로세스에 대한 강연을 해 주시기 위해 한국을 방문하시게 되었습니다. 여기에 NHN 웹표준화팀의 팀장님으로 계신 박태준 팀장님께서 오랜 경험과 노하우를 통해 얻은 HTML 개발 프로세스 방법론을 소개해 주실 것입니다.

행사내용과 프로그램

행사내용

구분	내용
일정	2009년 11월 21일 12:30-18:00
장소	삼성동 포스코센터 서관 5층 한국MS
주최	CSS Nite in Seoul 실행위원회, 유한회사 리그래피
협찬	한국 마이크로소프트, 태그앤브레이스
후원	하드코딩하는 사람들, CSS Design Korea, Clearboth
모집인원	150명 (초대 인원 포함)
등록비용	사전 등록：25,000원 / 현장 등록：30,000원
발표자	타가노 마사히로 (주식회사 스위치 대표 이사) 마시코 다카히로 (주식회사 사이바가덴 대표 이사) 박 태준 (주식회사 NHN 웹표준1팀팀장)

프로그램

시간	발표자	내용
12:30 [30min]		입장개시
13:00 [15min]	이 유미	오픈닝,행사 소개
13:15 [45min]	박 태준	웹표준을 기반으로 한 HTML개발 프로세스
14:00 [60min]	타가노 마사히로	일본의 웹표준현실과 제작 프로세스
15:00 [10min]	한국 마이크로소프트	라이트닝 토크1
15:10 [15min]		휴식
15:25 [60min]	마시코 다카히로	미래의 웹표준으로서의 HTML5과CSS3
16:25 [10min]	태그앤브레이스	라이트닝 토크2
16:35 [15min]		휴식
16:50 [60min]	박태준, 박중석, 타가노 마사히로, 마시코 다카히로, 미츠코시 유스케	패널토의와 질의응답
17:50 [10min]		경품 추첨
18:30 [60min]		교류파티(무료)

사전등록

사전등록은 온오프믹스를 통해서 실시하고 있습니다. 아울러 이번 행사는 유료로 진행되고 있습니다. 등록금은 30,000원이며, 사전 등록시 25,000원으로 등록을 하실 수 있습니다. 사전 등록이 조기에 마감되는 경우 현장 등록은 받지 않습니다.

배너 등록하기

CSS Nite in Seoul Vol.1 공식

CSS Nite in Seoul Vol.1 블로그 배너(가로 170px)

CSS Nite in Seoul Vol.1 블로그 배너(가로 200px)

CSS Nite in Seoul Vol.1 (가로 800px)

CSS Nite in Seoul Vol.1 (590x390)

CSS Nite in Seoul Vol.1 (가로 590px)

브라우저가 뭐야?

2009-10-06T18:24:00.000-07:00

컴퓨터를 이용하는 대다수의 사람들은 웹 브라우저에 대해서 제대로 이해하고 있지 못하는 경우가 많다. 윈도우에서는 파란색 지구 아이콘이 곧 인터넷이라고 인지할 뿐이고, 맥에서는 나침반 아이콘을 인터넷이라고 여긴다. 사용자들에겐 지금 이 순간 인터넷을 이용할 수 있는 것이 중요한 사실일 뿐. 그것이 웹 브라우저라는 프로그램이고, 내가 지금 사용하고 있는 것 이외의 다른 것이 또 존재해서 선택에 대한 고민을 해야 한다는 것에 스트레스를 받을지도 모른다.

What Browser? Website

구글은 그런 사용자들을 가르치고 싶었나보다. 그들은 What Browser? 라는 사이트를 만들어 놓고, 웹 브라우저의 역사와 자바스크립트가 얼마나 많이 발전했는지, 지금 사용하고 있는 당신의 브라우저의 성능은 어느정도인지. 당신이 사용하고 있는 브라우저 외에 설치할 수 있는 브라우저는 무엇 무엇이 있는지, 새로운 브라우저에서 홈페이지를 변경하는 것, 기본 브라우저를 변경하는 것 등을 꼼꼼하게 설명하고 있다.

만약 당신이 맥에서 파이어폭스를 사용하고 있다면, WhatBrowser.org는 Try a New Browser를 통해서 오페라, 파이어폭스, 사파리를 새로 설치할 수 있다고 보여줄 것이고, 윈도우에서 인터넷 익스플로어를 사용하고 있다면 오페라, 구글 크롬, 파이어폭스, 인터넷 익스플로어, 사파리를 보여줄 것이다.

그리고 A few useful tweaks에서 각 브라우저별로 다른 홈페이지 설정, 검색엔진 변경, 기본 브라우저 설정에 대한 가이드를 아주 친절하게 보여줄 것이다.

웹킷 기반에서 CSS3 맛보기

2009-10-06T17:57:00.000-07:00

WidgetPad에 웹킷 기반의 웹브라우저에서 텍스트와 관련된 CSS3 속성들을 미리 맛볼 수 있는 위젯을 만들었네요.

CSS3 Generator

'Hello World' 라는 텍스트에 Rounded Corner, Opacity, Box Shadow, Text Shadow, Reflection, Text Stroke, Transform등 7가지 CSS3 속성을 적용해 보고 확인해 볼 수 있습니다.

하단에는 적용된 스타일의 속성과 값이 나타나는데 웹킷전용 속성으로 처리되고 있을을 볼 수 있습니다. W3C의 스펙에 따른 표준 속성들은 아니지만(파이어폭스등 타 브라우저에서도 위와 유사한 전용 속성을 이용해서 구현될 수 있다) 앞으로 사용될 CSS3의 특징을 미리 살펴볼 수 있는 정도로 참고하기에는 괜찮은 것 같습니다.

위 위젯을 구현한 마크업과 스타일시트, 자바스크립트에 대한 코드는 소스보기에서 보실 수 있습니다.

다재다능한 마크업 에디터 markItUp!

2009-10-05T21:18:00.000-07:00

markItUp은 게시판 등에서 주로 활용하는 WYSIWYG 형태의 웹 에디터는 아닙니다. HTML을 비롯해, Markdown, Textile, Wiki Syntax, Markdown, BBcode 등 다양한 형태의 마크업으로 문서를 작성할 수 있도록 기능을 갖춘 솔루션입니다.

markItUp

markItUp은 jQuery를 사용하였고, 겸손한 자바스크립트(unobtrusive javascript)로 구현되어 있습니다. 자바스크립트를 사용할 수 없는 경우에도 기본 텍스트박스 영역이 제공되어 최소한의 기능을 이용할 수 있으며, 스타일스트가 제거된 경우에도 각각의 기능을 그대로 이용할 수 있습니다. 상단에 배치된 아이콘 메뉴들은 각각 접근키를 가지고 있어 단축키를 이용하여 쉽고, 편리하게 마크업을 할 수 있도록 배려되어 있는 것도 특징입니다.

markItUp의 장점은 뭐니뭐니해도 다양한 마크업 셋과 확장 기능에 있습니다. HTML 뿐만 아니라 여러 위키 엔진과 블로그 등 CMS에서 사용되고 있는 Markdown, Textile, Wiki Syntax, Markdown, BBcode 등을 얼마든지 추가하여 사용할 수 있습니다. 워드프레스와 드루팔과 같은 인기 CMS에 맞추어진 플러그인도 함께 제공중이며, MacOSX 스킨과 같은 여러 스킨도 지원하고 있습니다. 이 강력한 마크업 에디터가 오픈 소스라는 점 또한 매우 매력적인 사실입니다.

거의 모든 국내 웹사이트가 WYSIWYG형태의 웹에디터를 기본 에디터로 사용하고 있고, 사용성이 높기 때문에 WYSIWYG를 지원하지 않는 markItUp이 다소 아쉽기는 하지만, 웹에서의 HTML 마크업 에디터나 강력한 위키용 에디터 등을 원하시는 분들께는 아주 멋진 솔루션이지 않나 싶다.

오페라 웹표준 강좌 13장. HTML 요소

2009-10-05T01:54:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 13장 HTML <head> 요소가 번역 되었습니다.

번역된 다른 강좌들:

브라우저의 역사

2009-10-01T00:50:00.000-07:00

Six Revisions에서 웹 브라우저의 역사를 포스팅했군요.

1991년 팀 버너스 리가 개발한 WWW 브라우저(World Wide Web의 WWW와 혼동되어 나중에 Nexus라는 이름으로 바뀜)부터 2008년 구글 크롬까지 년도별로 굵직 굵직한 기록들을 이미지와 함께 설명하고 있습니다.

웹브라우저의

클리어보스에서도 웹퍼블리셔 오리엔테이션을 위해 작성했던 '웹표준 역사'라는 것이 있는데 년도별로 브라우저의 발전과 웹표준 스펙을 함께 정리해 둔 것이었다.

WCAG 2.0 체크리스트

2009-09-30T01:17:00.000-07:00

WebAIM에서 제작한 WCAG 2.0 Checklist를 번역한 문서를 공개합니다.

번역을 마친지는 꽤 되었는데 내용 검수가 충분하지 않다고 판단해서 클리어보스 위키에 게시만 해 놓고 별도의 공지를 하지는 않았습니다. 따라서 번역상의 오류가 있어 내용이 잘 못 전달될 가능성이 있습니다. 또한, WebAIM도 밝히고 있듯이 이 체크리스트는 W3C에서 작성된 WCAG 2.0과 완전하게 동일한 내용을 담고 있지는 않습니다. (실무 반영을 위해 일부 기준을 변경함) 이같은 사정을 숙지하신 후에 참고용으로 활용하시면 될 것 같습니다. 아울러 번역이나 내용상의 오류를 발견하신 분은 본 글의 댓글 영역이나 위키 페이지의 의견란을 통해서 올려주시면 감사하겠습니다.

오페라 웹표준 강좌 44장. 자바스크립트 함수

2009-09-30T01:05:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 44장 자바스크립트 함수가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다.

번역된 다른 강좌들:

맥에서 위젯으로 미투데이 글 올리기

2009-09-24T23:27:00.000-07:00

맥 위젯 중에 웹클립이라는 위젯이 있습니다. 웹클립을 이용하면 웹사이트의 일부를 잘라내서 위젯처럼 사용할 수 있게 되는데요. IE8의 웹조각 기능과 흡사합니다.

웹클립을 이용해서 미투데이 글쓰기 창을 위젯으로 만들어 볼까요?

맥OS의 위젯들

일단 위젯 가운데 Web Clip 위젯을 활성화 시켜 주시고,

사파리 웹브라우저의 Dashboard에서 열기를 실행

사파리를 구동시켜서(웹 클립 위젯은 사파리에서만 됩니다) [파일] 메뉴 아래 'Dashboard에서 열기'를 선택합니다. 물론 이전에 원하는 웹사이트를 열어 두셔야 합니다.

원하는 영역을 선택

'Dashboard에서 열기'를 선택하면 웹페이지 위에 클립할 영역을 선택할 수 있는 가이드가 나타납니다. 이 때 미투데이 글쓰기 창을 지정해 줍니다.

미세 조절을 하고, 추가 버튼 클릭

영역을 선택하면 상하좌우로 세밀한 조정이 가능합니다. 그리고 우측 상단에 [추가] 버튼을 클릭하면 끝입니다.

위젯창에 등록된 미투데이 글쓰기 위젯

자 이제 다시 맥의 위젯들을 불러오면 미투데이 글쓰기 창이 위젯화 되어 나타나게 됩니다. 정말 글이 써질까요? 제대로 전송을 될까요?

정말로 글이 올라간다

네 됩니다! 제대로 글이 저장되었다고 합니다.

사실 이 위젯은 사용자가 선택한 영역만 정확히 떼어 내어 위젯으로 만드는(IE8 웹조각은 그렇게 처리)것은 아닌듯 합니다. 잘 보면 사실은 해당 페이지 전체를 저장하고, 위젯 화면에서는 사용자가 선택한 영역만 보여주는 것 같습니다.

그리고 다음과 같이 위젯의 모양을 여러가지 형태로 바꿀수도 있었습니다.

위젯 스킨 1

위젯 스킨 2

위젯 스킨 3

저는 이렇게 네이버 스포츠 중계창을 위젯으로 만들어 놨는데요. 일부러 네이버에 접속해서 찾아 보지 않아도 간단히 위젯으로 볼 수 있으니 편리한것 같습니다.

네이버 스포츠 중계를 위젯으로 만든 화면

SuperPreview Review

2009-09-24T19:16:00.000-07:00

MS는 Expression Web 3에 비주얼 진단(visual diagnostics) 도구인 SuperPreview를 포함하여 발표했습니다. 하지만 별도로 작동되는 프로그램으로 Expression Web 3 없이도 사용하실 수 있습니다.

오늘은 SuperPreview의 사용기를 간단히 정리해 보고자 합니다.

UI

SuperPreview UI

UI는 다른 Expression Stuio 제품들과 동일합니다. 상단에 웹페이지 위치를 입력하는 로케이션 바를 포함한 메뉴바가 위치해 있고, 중앙에 기준 화면(Base Line)과 비교 화면(Comparison)이 있습니다. 바로 아래에는 기준 화면이 되는 브라우저 아이콘과 비교 화면의 브라우저들 아이콘이 표시되어 있습니다. 하단에는 각각의 브라우저 DOM Tree 정보와 해상도를 설정할 수 있는 드롭다운 메뉴가 제공됩니다. DOM Tree를 통해서 상세한 스타일시트 정보를 확인해 볼 수는 없었습니다.

브라우저 선택

SuperPreview 브라우저 선택

비교 브라우저 목록에서 [+]버튼을 누르면 새로운 브라우저나 이미지를 선택할 수 있습니다.

SuperPreview 브라우저 선택 후 새로고침을 한다

브라우저를 선택하면 새로고침을 하라는 메세지가 나타납니다. 상단에 로케이션바 옆에 새로고침 버튼을 클릭하면 렌더링이 이루어지고, 화면이 나타납니다.

Box Highlighting Mode

Box Highlighting Mode

원하는 영역을 선택하게 되면 박스형태로 표시되며 좌측 하단에 사이즈와 위치 정보가 출력됩니다. 브라우저간 차이가 발생하면 붉은색으로 표시가 됩니다.

Lights-Out Highlighting Mode

Lights-Out Highlighting Mode

Box Highlighting Mode 와 달리 선택 영역만을 밝게 하여 보여줍니다.

Layout

수평 레이아웃

4가지 형태의 레이아웃을 제공한다. 기본 레이아웃은 수직으로 나누어져 있고, 위 그림처럼 수평(Horizontal Split Layout)으로도 나눌 수 있습니다.

오버레이 레이아웃

Overlay 레이아웃은 비교가 되는 두 화면을 하나의 레이아웃으로 겹쳐 보임으로써 차이를 극명하게 보여줍니다. 그리고 나머지 하나는 선택된 브라우저 하나만 보여주는 레이아웃입니다.

이미지 비교

이미지 비교

이미지를 불러와서 비교할 수 있습니다. 꼼꼼한 웹디자이너들이 종종 웹퍼블리셔가 작업한 웹페이지를 캡쳐해서 원본 이미지와 비교하는 것을 볼 수 있는데 더 이상 캡처를 하지 않아도 될 것 같습니다. 웹퍼블리셔에게는 아주 곤혹스러운 상황이겠지만 말이죠. 하지만 반대로 SuperPreview를 통해서 각 브라우저마다 같은 코드가 어떻게 다르게 렌더링 되는지를 효과적으로 보여주고 설명해 줄 수 있는 것이기도 합니다.

정리
SuperPreview를 IETester나 MultiIEs와 같은 어플리케이션에 비해 가볍고, 편리합니다. 가장 많이 사용하고 있는 IETester는 지속적인 패치를 통해 렌더링 정확도가 높아지고 있지만 모든 경우를 보장해 주지 못합니다. 그리고 일부 OS에서 심심치 않게 다운되는 현상도 비일비재합니다. 반면에 SuperPreview는 이같은 문제를 해소시켜줄 대안으로 발표가 되었습니다. 환영할만한 일입니다. 반갑기도 하구요. 하지만 정말 쓸 만한 제품인가? 하는데에는 아직 아쉬움이 많이 남는 제품입니다.

일단 SuperPreview는 비주얼 진단 도구로 실제 웹브라우저처럼 웹페이지를 보여주지 않습니다. 다시 말해 링크나 자바스크립트를 통한 인터랙션을 확인해볼 수 없습니다. 단일 페이지에 대한 렌더링 결과만을 확인해 볼 수 있다고 생각하시면 됩니다. 또한, 자바스크립트로 웹페이지 레이아웃을 구성하는 경우 제대로 렌더링 되지 않는 경우도 발생합니다. Expression Web 3 릴리즈 노트(공식 문서)를 살펴보시면 SuperPreview가 지원하지 못하는 경우를 확인해 보실 수 있습니다. 또 하나 IE 시리즈를 제외하면 현재 지원되는 브라우저는 Firefox 뿐입니다. Safari, Opera와 같은 다른 브라우저들은 다음 버전에서나 지원될 것으로 보입니다.

그리고 SuperPreview를 처음 보고 어도비의 BrowserLab 서비스와 상당히 유사하다는 것을 느꼈는데요. BrowserLab은 웹서비스로 구현되어 있습니다. 드림위버에 플러그인을 설치하면 연동해서 사용하실 수도 있구요. SuperPreview와 BrowserLab이 서로 경쟁해서 둘 다 좋은 제품으로 발전했으면 좋겠네요.

어쨌든 결론적으로 제 생각을 정리해보면 SuperPreview는 괜찮은 컨셉으로 쓸만한 제품이지만 아직은 다른 디버깅 툴을 대체할 만큼 사용성이 높지는 않다는 것입니다. IE8에는 개발자 도구라는 강력한 디버깅 툴이 지원되고 있는데 그것과 연동되어진다면 꽤나 쓸만하지 않을까 기대해 봅니다.

어도비의 BrowserLab

그래도 웹디자이너나 웹기획을 하시는 분들께는 꽤나 유용한 도구가 될 것으로 생각됩니다. 개발자나 웹퍼블리셔에게는 아쉽지만 아직은 IETester를 이용한 확인 작업이 가장 나은 대안인 것 같습니다.

가장 좋은건 IE6이나 IE7이 어서 점유율이 떨어져서 모든 사람들이 표준을 제대로 준수하는 브라우저를 사용하는 세상이 되는 것이겠죠.

참고

모든 기기에서 인터넷 뱅킹을!

2009-09-23T18:51:00.000-07:00

오픈뱅크 2009 운동

모든 기기에서 인터넷 뱅킹을 지원하는 "최고의 은행"을 소비자 스스로 찾기 위한 운동이 시작되었습니다. 오픈뱅크 2009는 인터넷 익스플로어를 사용하지 말자거나 반 ActiveX 운동이 아닙니다. 은행으로 하여금 윈도우 사용자가 아닌, 인터넷 익스플로어 사용자가 아닌 사람들에게도 동일하게 인터넷 뱅킹 서비스를 제공받을 수 있도록 해 달라는 것이며, 그렇게 해 주는 은행을 만들고자 하는 운동입니다.

운동의 시작과 함께 이미 많은 분들이 이름을 남겨주시고 계십니다. 보다 많은 분들께 참여를 독려하고자 이렇게 포스팅을 해 봅니다.

공식 사이트 : http://openbank.or.kr/
참여 페이지 : http://openbank.or.kr/join

두번째 웹퍼블리셔 오리엔테이션 후기

2009-09-21T21:26:00.000-07:00

지난 토요일(09.09.19) 오후 압구정동 ACG 대회의실에서 클리어보스가 주최하고 오페라 소프트웨어와 드래곤플라이, ACG가 후원한 웹퍼블리셔 오리엔테이션 두번째 세미나가 있었습니다.

이번 OT에서는 총 18분이 신청해 주셨고, 10분이 참석을 해 주셨습니다.(생각보다 많은 분들이 당일 취소를 하셨네요) 그리고 운영진 및 자원봉사, 패널 참석자를 포함해서 총 18명이 이날 세미나를 진행했습니다.

두번째 웹퍼블리셔 오리엔테이션

이번 OT에서도 1기때와 마찬가지로 1교시 웹표준 역사 발표와 2교시 웹퍼블리셔로 살아가기라는 주제로 토론을 진행했습니다.

1교시 웹표준 역사는 제가 준비한 발표자료를 통해서 년도별 웹 표준 권고안과 브라우저들의 발전 상황을 요약했고, 2교시 토론에서는 애틱님의 진행으로 저와 루트박스, 유자, 호브레드, 듀트 님 등이 패널로 참여하여 참가자들과 함께 질의 응답 형태의 이야기를 풀어가는 시간을 가졌습니다. 토론의 내용은 클리어보스 위키에 공개된 문서를 통해서 확인해 보실 수 있습니다.

그리고 4시간여의 세미나를 마치고, 근처 호프집에서 패널과 참가자들이 함께 못다한 이야기를 나누며 친해질 수 있는 뒤풀이 자리를 가졌습니다.

사실 이번 세미나는 1기때에 없었던 기념품 후원 등도 있고 해서 기대가 컸었는데 의외로 많은 분들이 당일 또는 전날 취소를 하셔서 절반 정도의 인원만을 모시게 되었었습니다. 세미나를 준비한 사람들 입장에서는 참 안탑갑고 아쉬울 수 밖에 없는 대목입니다. 아무래도 저희가 준비한 내용이 충분하지 않고, 홍보도 적었던 탓이라고 생각합니다. 다음 3기 OT에서는 더 나은 주제와 내용으로 조금 더 열심히 알려서 보다 많은 분들께 참석의 기회와 공유의 기쁨을 가질 수 있도록 노력하겠습니다.

opera.com 한글화에 참여해주세요.

2009-09-21T02:35:00.000-07:00

웹 표준과 관련된 다양한 정보를 얻기 위해서 찾는 곳 중 하나가 오페라 개발자 커뮤니티입니다. 제가 활동하고 있는 클리어보스에서 번역중인 웹표준 강좌 역시 이 곳 오페라 소프트 개발자 커뮤니티에 들어 있는 내용이구요. 그런데 요즘 opera.com에 대한 한글화 작업도 진행중인 것 같습니다. 오페라 코리아 블로그에 'opera.com 한글화 자원봉사를 모집합니다.'라는 글이 올라와 있네요.

오페라 소프트웨어 지역화

나라별로 진행중인 지역화를 보면 한국이 0%인 것을 보실 수 있습니다. 많은 분들이 한글화에 참여해 주셔서 opera.com 뿐 아니라 개발자 커뮤니티 사이트까지도 모두 한글로 읽어볼 수 있을 날을 기대해 봅니다.

opera.com 한글화 작업과 관련한 자세한 내용은 여기에서 확인해 보실 수 있습니다.

덧붙임/ 클리어보스에서 진행중인 오페라소프트 웹표준 강좌의 번역을 함께 해 주실 분도 환영합니다. 이건 제게 문의해 주시면 됩니다.

오페라 웹표준 강좌 51. 적절한 낮춤 대 점진적 향상

2009-09-11T22:38:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 51장 적절한 낮춤 대 점진적 향상이 번역 되었습니다. 졸린눈이님께서 수고해 주셨습니다.

번역된 다른 강좌들:

텍스트큐브닷컴 미투데이 댓글 연동해주세요~

2009-09-09T18:37:00.000-07:00

텍스트큐브닷컴을 이용하면서 미투데이에 글 보내기 기능을 자주 사용하고 있다. 그런데 한가지 아쉬운 점이 있어서 제안해봅니다.

미투데이로의 글 보내기 이후에 미투데이에 걸린 댓글을 텍스트큐브닷컴(블로그)에서도 확인 해 볼 수 있었으면 좋겠습니다. 뭔가 글보내기만으로는 반쪽짜리 기능같아서 아쉽습니다. 텍스트큐브닷컴 개발자님 제발 구현해 주세요~

자바스크립트 프레임워크를 한 자리에

2009-09-09T18:12:00.000-07:00

주요 자바스크립트 프레임워크를 한 화면에서 비교해 볼 수 있는 사이트가 있어 소개해 드립니다.
덴마크의 웹디자이너 Matthias Schutz가 제작한 페이지로 jQuery, MooTools, Prototype 등 주요 자바스크립트 프레임워크의 용량, 속도, UI 툴킷 지원 여부, 라이센스 정책을 한번에 확인해 볼 수 있도록 제공하고 있습니다. 또한, 주요 기능 구현을 위한 코드까지도 비교해 볼 수 있도록 페이지를 구성해 놓고 있어서 자바스크립트 프레임워크를 적용하고자 하시는 분들께 꽤나 도움이 될 것 같습니다.

Javascript Framework Matrix

두번째 웹퍼블리셔 오리엔테이션의 선물은 에디트플러스 라이센스!

2009-09-09T16:33:00.000-07:00

대한민국 웹퍼블리셔들이 가장 사랑하는 에디터! 에디터플러스!

오는 19일 토요일 오후에 클리어보스가 주최하는 두번째 웹퍼블리셔 오리엔테이션에서 참가자 분들께 어떤 선물을 드릴까 고민을 많이 했습니다. 첫번째 오티때처럼 도서와 USB메모리를 드릴까도 했지만 루트박스님의 아이디어를 통해서 에디트플러스 정품 라이센스를 드리기로 결정했답니다.

현재 클리어보스에서 진행중인 웹퍼블리셔가 가장 많이 사용하는 에디터 사용율 조사에서도 당당히 과반수 이상의 투표율을 자랑하는 대국민 에디터 에디트플러스를 당당히 정품 사용자로 사용하실 수 있는 기회를 드리고자 합니다!

상품 공지를 조금 더 일찍 결정해서 공지했더라면 더 많은 분들이 상품에 눈이 멀어(?) 더 많이 참가 신청을 해 주셨을 것 같은데 아쉽네요! 아무쪼록 다음주 토요일로 다가온 두번째 오티가 무사히 마무리 될 수 있도록 남은 기간 행사 준비에 부족함이 없도록 하겠습니다.

더불어 본 행사에 후원을 해주고 있는 오페라 소프트웨어에서도 예쁜 티셔츠를 제공해 주시기로 했습니다. 오페라 소프트웨어의 관심과 지원에 다시 한 번 감사드립니다. (오페라 10 이 최근에 릴리즈되었습니다. 너무나 좋더라구요~ 많이들 사용하세요~)

다음은 클리어보스 주최 두번째 웹퍼블리셔 오리엔테이션을 후원하는 기업들입니다.

오페라 웹표준 강좌 42장, 자바스크립트 멋진 예제들

2009-09-08T18:38:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌 42장 자바스크립트 멋진 예제들이 번역 되었습니다. 검은태양님께서 수고해 주셨습니다.

번역된 다른 강좌들:

오페라 웹표준 강좌 46장. DOM 여행

2009-09-06T05:59:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 46장 DOM 여행가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다.

번역된 다른 강좌들:

오페라 웹표준 강좌 41장. 자바스크립트 시작하기

2009-09-06T05:51:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 41장 자바스크립트 시작하기가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다.

번역된 다른 강좌들:

가장 많이 사용하는 에디터 투표해주세요

2009-09-02T18:37:00.000-07:00

클리어보스에서 UI개발자, 웹퍼블리셔분들이 가장 많이 사용하고 있는 에디터가 무엇인지 알아보는 투표를 진행하고 있습니다.

가장 많이 사용하는 에디터 투표

오페라 웹표준 강좌 48장, 동적 스타일 - 자바스크립트로 CSS 다루기

2009-08-31T00:44:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 48장 동적 스타일 - 자바스크립트로 CSS 다루기가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다. 근래 들어 검은태양님께서 너무 열심히 번역에 참여해 주고 계셔서 한 주에 한 강좌씩 꼬박 꼬바 등록되고 있는것 같습니다. 너무 너무 감사드립니다. 저 역시도 어서 진행중인 부분을 완료해서 올리도록 해야겠습니다.

번역된 다른 강좌들:

아내가 그려준 아바타

2009-08-30T05:47:00.000-07:00

오늘 아내가 인상을 잔득 쓰고 있는 제 사진 하나를 가지고 작업을 하더니 이렇게 멋진 아바타 이미지를 스케치 해 주었습니다.

페이지오프라고 적힌 머리띠를 묶은 모습입니다.

HTML 모드로 변신한 봄눈입니다.

사악하고 간사한 모드의 봄눈입니다.

220볼트 전원을 입에 물고 있는 봄눈입니다. 아내의 의도를 잘 모르겠어요 ㅎㅎ

연필을 물고 있는 지적인 봄눈입니다.

꽃을 물고 있는 봄눈입니다.

춥파춥스를 물고 있는 봄눈입니다. 그러고보니 중학교 때 별명이 춥스였는데... 실제로 춥파춥스를 많이 먹었거든요.

위 버전들의 원본 스케치입니다.

저와 아내가 함께 있는 그림입니다. 아내가 너무 좋습니다. 사랑해~

오페라 웹표준 강좌 49장, 자바스크립트 이벤트 핸들링

2009-08-27T23:22:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 49장 자바스크립트 이벤트 핸들링가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다. 감사드립니다.

번역된 다른 강좌들:

두번째 웹퍼블리셔 오리엔테이션 합니다

2009-08-23T18:20:00.000-07:00

지난 2월 21일 첫번째 웹퍼블리셔 오리엔테이션을 마친 후 6개월이 지난 9월 19일 다시 두번째 자리를 갖게 되었습니다.

웹퍼블리셔 오리엔테이션은 사회에 첫 발을 내 딛는 예비 또는 1년 이내의 신입 웹퍼블리셔 분들과 업계 선배님을 모시고 궁금한 점들과 고민들을 이야기해 보기 위해 마련된 시간입니다. 퍼블리싱 개발 방법론이나 기술을 배워가는 자리가 아님을 알려드립니다.

두번째 웹퍼블리셔 오리엔테이션의 개요는 다음과 같고, 신청은 클리어보스의 별도 페이지에서 받고 있습니다.

일시 : 2009년 9월 19일 토요일
장소 : ACG / 서울시 강남구 논현동 99-7 럭스웨이 빌딩 4층 대회의실
- 강남구청역 3번 출구
- 학동로북36길 이용 학동사거리 방향으로 직진, 도보로 10분 내외 소요

대상 : 총 20명 - 미취업 입문자(10명)와 신입 1년차 이내(10명)
선정기준 :
- 구분별 선착순
- 한 쪽 지원자의 수가 10명이 되지 않을 경우, 다른 한 쪽 지원자수로 채워짐.
- 단, 경력 1년 이상자 등록시 취소될 수 있음.
진행 및 도움 : 에틱, 봄눈, 루트박스, 호브레드, 비티
참가비 : 3,000원 / 뒤풀이 비용 별도
신청 : 8월 24일 ~ 8월 31일
내용

1교시(13:00 ~ 13:30) : 행사 소개 및 인사(30분 / 명함 준비)
2교시(13:30 ~ 14:00) : 웹표준 역사(30분 / 봄눈)
휴 식(14:00 ~ 14:20) : 20분
3교시(14:20 ~ 17:00) : 웹 퍼블리셔로 살아가기 (120분 / 애틱, 비티, 루트박스, 봄눈 - 다과와 함께)
뒤풀이(17:00 ~ ) : 별도 진행(뒤풀이 회비 별도)

두번째 웹퍼블리셔 오리엔테이션 참가 신청하기

Windows7 XP Mode에서 IE6만 바로 실행하는 방법

2009-08-20T21:50:00.000-07:00

Windows7 에서 호환성 문제로 실행되지 않는 프로그램들을 실행시키기 위해서 XP Mode를 사용하는 방법이 있습니다. XP Mode를 다운받고 설치하는 방법은 이미 많이 알려져 있기 때문에 설명을 생략하겠습니다.

XP Mode에서는 설치된 어플리케이션을 Windows7 시작 메뉴를 통해서 바로 실행시킬 수 있도록 만들어져 있습니다. 참 편하더군요. 그런데 처음부터 설치되어 있는 IE6도 바로 실행시키고 싶었는데 XP Mode의 메뉴에서는 특별한 방법을 제공하진 않더군요. 그래서 찾아봤습니다. 구글로.

방법은 간단합니다.

모든 사용자 문서 폴더내에 시작메뉴 > 프로그램 폴더(C:\Documents and Settings\All Users\시작 메뉴\프로그램) 안에 IE6 단축아이콘을 넣어주시면 됩니다.

XP Mode 바탕화면의 IE6를 시작메뉴 > 프로그램 안에 넣는다.

시작메뉴에 등록된 것을 확인해 볼 수 있다.

단축아이콘을 빠른실행 영역에 넣어두면 더욱 편하다.

이렇게 하면 IE8과 IE7(호환성모드) 뿐 아니라 IE6도 제대로 확인해 볼 수 있게 된다.

IE6 때문에 고생하는 웹퍼블리셔들이나 UI개발자분들중 Windows7을 사용하신다면 괜찮은 테스트 환경을 구축할 수 있을 것 같아서 올려봅니다.

오페라 웹표준 강좌 43장, 겸손한 자바스크립트의 원리

2009-08-19T18:57:00.000-07:00

클리어보스에서 번역중인 오페라 웹표준 강좌의 43장 겸손한 자바스크립트의 원리가 번역 되었습니다. 검은태양님께서 수고해 주셨습니다. 감사드립니다.

43. 겸손한 자바스크립트의 원리

번역된 다른 강좌들:

복잡한 도구모음 정리하기

2009-08-19T01:00:00.000-07:00

Firefox를 주 브라우저로 사용하고 있고, Web Developer와 구글 툴바를 설치해서 사용중입니다. 거기에 Juicy Studio Accessibility Toolbar나 WAVE같은 웹접근성 관련 툴바도 설치해서 사용중입니다. 그러다 보니 아래처럼 도구모음 영역이 2줄, 3줄 늘어만 가서 웹페이지를 출력해 주는 실제 뷰 영역이 점점 줄어드는 문제가 있습니다. 모니터 태평양같이 넓다면 모를까 13인치 밖에 되지 않는 작은 노트북 화면에서 이런 환경은 웹 서핑을 답답하게 만들곤 합니다.

여러 툴바를 설치해서 복잡해진 도구모음 영역

Firefox 의 보기 > 도구모음을 선택하면 설치된 툴바를 도구모음 영역에 보이거나 감출 수 있기에 필요한 경우에는 켜고, 필요없는 상황에는 끄는 방법으로 사용을 해 왔는데 '사용자 지정' 기능을 통해서 각 툴바의 기능 중 내가 원하는 것들만 한 줄에 모아둘 수 있지 않을까하는 생각이 들었습니다.

필요한 기능만 한 줄에 정리했다

역시나 가능했습니다! 위 그림처럼 도구모음에 등록된 각각의 아이콘들을 제 의지대로 넣고, 빼고 할 수가 있었습니다. 그래서 저는 단 한 줄 안에 Gmail과 번역, 북마크 모음, Web Developer의 자주 사용하는 6가지 옵션만 선택해놨습니다.

그러고 나니 정말 한결 깔끔해진 도구모음 영역을 볼 수 있었고, 웹 페이지 뷰 영역도 보다 넓어졌습니다. 간단한 팁이긴 하지만 여러 툴바를 설치해서 사용하시는 분들께 도움이 될까 하여 올려봅니다.

오페라 웹표준 강좌 12장, HTML 기초 한글화

2009-08-16T22:55:00.000-07:00

오페라의 웹표준 강좌를 한글로 보기

2009-08-12T16:35:00.000-07:00

클리어보스에서는 오페라 소프트웨어의 웹표준 강좌를 한글화하는 작업을 진행하고 있습니다.
(클리어보스는 누구나 참여할 수 있는 웹표준을 알리는 사람들의 모임입니다.)

오페라 소프트웨어의 웹 표준 강좌

2008년 여름부터 시작된 번역 작업이 빠르게 진행되고 있지는 않지만 한 장, 한 장 매듭을 지어 가다보니 오늘 현재 총 10개의 강좌가 번역되어 있습니다.

번역된 강좌는 다음과 같습니다:

대부분 번역 초안의 모습으로 한글화가 매끄럽지 못한 부분도 있고, 일부 오역이 있을수도 있으나 읽기에는 크게 어렵지 않은 수준입니다. 번역 작업에는 지금까지 16분이 참여해 주셨고, 현재는 저를 포함해 세 분 정도가 번역을 진행하고 있습니다.

아직도 많은 강좌들이 번역되지 못한채 남아 있는 상황이고, 기 번역된 문서들도 매끄러운 한글화를 위해서 교정 및 퇴고가 필요합니다. 이에 번역 작업에 함께 하고 싶으신 분들은 아무때라도 제게 문의를 해 주시면 감사하겠습니다.

클리어보스 개편 안내

2009-08-12T16:23:00.000-07:00

웹표준을 알리는 사람들의 모임(Web Standards Evangelist Forum)인 클리어보스의 웹사이트가 개편을 했습니다.

개편된 클리어보스 웹사이트

이번 개편 작업에서는 제대로 운영이 되지 않았던 팀블로그와 포럼 게시판을 폐쇄하고, 위키 하나로 통합되었습니다. 다시 맨 처음으로 돌아간 셈인데요. 그래도 처음보단 위키의 콘텐츠가 많아져서인지 그런대로 모양새가 나와준 것 같습니다.

현재 위키를 통해서 제공되는 콘텐츠는 크게 4가지로, 클리어보스 소개 및 활동 내용, 오페라 웹표준 강좌 한글화 문서, 웹퍼블리셔 오리엔테이션(세미나) 자료 그리고 팀블로그를 통해서 진해되었었던 몇 가지 캠페인 이벤트를 옮겨 담았습니다.

디자인적으로는 기존 스킨이 전체적으로 밝고, 대비가 적어 글자를 읽기에 다소간 어려움이 있었던 것을 해결해보고자 배경 부분과 콘텐츠 부분의 대비를 강하게 가져가는 디자인 소스를 가져와 Dokuwiki에 적용했습니다.

아울러 작은 부분이지만 실험적으로 HTML5의 HEADER, FOOTER, ARTICLE, SECTION 등 일부 새로운 요소들을 사용하여 적용해 보았습니다. 기회가 되는대로 HTML 5 의 새로운 요소, 속성들을 적용해 보고, CSS 3를 적용해 볼 수 있는 데모 사이트로 만들어볼 생각입니다.

매번 욕심대로 운영이 되지 않아 어쩔 수(?) 없이 개편 작업을 하게 되는 것 같아서 한 편으로 마음이 편하지는 않지만 조금 더 열심히 그리고 꾸준하게 이어나가고 싶은 마음으로 개편 작업을 했습니다.

덧붙임. 어쩌면- 아마도, 조만간 페이지오프도 스킨이 변경될지 모르겠습니다. :)

HTML 5와 CSS 3로 웹 사이트 만들기 소개

2009-08-10T17:40:00.000-07:00

Smashing Magazine에서 Enrique Ramirez 의 글 'Coding A HTML 5 Layout From Scratch'을 통해서 HTML 5 와 CSS 3를 적용한 웹사이트 개발 데모를 소개한 것이 있어 소개해 드립니다.

HTML 5와 CSS 3를 이용해서 만들어진 웹 페이지

데모 디자인을 바탕으로 HTML 5 를 이용해서 마크업을 하고 스타일시트는 CSS 3를 사용하고 있어 이를 공부하고자 하시는 분들에게는 좋은 예제가 될 것 같습니다.

완성된 데모 페이지는 여기에서 보실 수 있습니다.