페이지오프: 10월 2009

2009년 10월 25일 일요일

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

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

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

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

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

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

2009년 10월 21일 수요일

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

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

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

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

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

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

2009년 10월 18일 일요일

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

클리어보스에서 지난 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 에디터 전쟁: 당신은 어떤 에디터를 사용하는가?

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

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

HTML Editors Distribution

2009년 10월 12일 월요일

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

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

번역된 다른 강좌들:

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

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월 6일 화요일

브라우저가 뭐야?

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

What Browser? Website

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

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

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

웹킷 기반에서 CSS3 맛보기

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

CSS3 Generator

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

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

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

2009년 10월 5일 월요일

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

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 <head> 요소

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