페이지오프

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> 요소가 번역 되었습니다.