2009년 2월 27일 금요일

Firebug로 CSS를 빠르고 쉽게하자

Tutorial9에 올라온 Quick & Easy CSS Development with Firebug 글입니다. 번역은 아니고, 원문을 읽고 간단히 요약 정리한 것입니다.

Firebug 설치
  • 모질라 애드온 사이트에서 내려받을 수 있습니다. (Firebug 웹사이트에서도 받을 수 있습니다.)
  • 설치가 완료되면 Firefox 하단에 주황색 벌레 아이콘이 생깁니다. 클릭을 하면 현재 보여지고 있는 웹 페이지의 HTML과 CSS, JavaScript 소스가 보여집니다.

Firebug를 이용해서 CSS 실시간으로 수정하기
Firebug는 인터넷에 개시된 웹 페이지의 CSS를 실시간으로 수정할 수 있죠. 다음은 원문에 포함된 동영상입니다. FIrebug를 이용해서 실시간으로 CSS를 수정하는 모습을 보여주고 있습니다.


그런데 종종 이렇게 수정된 내용이 서버에도 그대로 저장된다고 생각하시는 분들이 계십니다. 그렇지 않구요 개발자가 원본 CSS를 수정해서, 저장한 뒤에 웹 브라우저를 새로고침하는 과정이 복잡하고 반복되다 보면 시간을 많이 소모시키기 때문에 정확한 CSS를 빨리 찾아낼 수 있도록 제공되는 기능이라고 생각하시면 됩니다.

Internet Explorer를 위한 Firebug

Firebug 웹사이트에서는 Internet Explorer 를 위한 버전도 제공하고 있습니다. Firefox 처럼 부가기능으로 설치되는 것이 아니라 자바스크립트를 HTML 문서에 포함시켜 비슷하게 만들어주는 기능을 합니다. 때문에 Firefox와 Opera, Safari에서도 그대로 적용할 수 있습니다. 단지 <head> 안에 다음과 같이 스크립트를 한 줄 추가해 주시면 됩니다.
<script type='text/javascript' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
하지만 그다지 사용을 권해 드리고 싶지는 않네요. IE 7 이상부터는 MS에서 제공하고 있는 IE Developer Toolbar가 있고, Opera 역시 Dragon Fly라는 멋진 디버깅 툴을 자체 지원합니다. IE 버전별로 IE Developer Toolbar를 사용할 수 있는 방법은 나라디자인에 올라온 '여러 버전의 IE에서 IE Developer Toolbar 사용하기'를 참고하시면 됩니다. (찬명님께서 며칠 간 사용해보신 후 다소 버그가 발견되고 있어 패치 이전까지는 권장하지 않는 다는 글을 새롭게 올리셨네요.)

2009년 2월 26일 목요일

IE8 세미나 소식

한국 MS에서 곧 출시될 것으로 보이는 IE8에 대한 개발자 세미나를 열었습니다.

  • 일시 : 2009년 3월 11일 수요일 오후 1:30 - 2009년 3월 11일 수요일 오후 6:00
  • 장소 : 코엑스 컨퍼런스 센터 401호
  • 개요 :
    • 김대우 : IE8에 대해서 개발자가 알아야 할 전반적인 내용들을 설명하고, IE8 적용사례 및 적용가이드에 대한 내용들에 대해서 알아 봅니다.
    • 정찬명 : IE8의 향상된 웹 표준 지원을 UI 개발자들이 실무에 어떻게 활용할 것인지 고민하고 그 결과를 공유하는 세션 입니다. IE6~7에 최적화된 웹 사이트와의 호환성을 어떻게 유지할 것인지도 다룹니다.
    • 강규영 : IE8의 새로운 기능, 타 브라우저와의 호환성, 개발자용 도구, 성능 개선 등 IE8과 관련하여 Ajax 개발자가 알아야 할 주요 이슈들을 소개합니다.
    • 정성태 : IE8에서 브라우저 확장 기능을 구현하기 위해서 알아야 할 변경 사항인 Loosely Coupled IE와 BHO 그리고 이와 관련된 Tool Bar 적용 사례 및 올바른 ActiveX 활용법에 대한 내용을 다룹니다.

그동안 MS가 주취하거나 참여한 세미나, 컨퍼런스가 재미도 없고, 자사 제품 소개 위주로만 진행된 적이 많아서 별로 흥미가 없었는데 이번 세미나 스피커분들의 간단한 프로필과 개인 블로그를 살펴 보니 평일 오후 시간을 제법 즐겁게 보낼 수 있을 것 같다는 생각이 들어 사전등록도 하고, 이렇게 소식도 전해 드립니다.

2009년 2월 22일 일요일

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

지난 토요일(21일) 클리어보스가 주최한 웹퍼블리셔 오리엔테이션 첫 자리가 있었습니다.

이제 갓 입사하신 신입 웹퍼블리셔와 웹퍼블리셔를 준비하고 계신 예비 웹퍼블리셔분들을 모신 이 자리는 웹퍼블리셔라는 직업에 대한 고민과 비전에 대한 이야기를 나누는 자리로 마련되었고, 간단히 웹 표준의 역사를 소개하고, 2시간이 넘는 짧지 않은 대부분의 시간을 선배 웹퍼블리셔분(애틱님)의 경험담과 조언, 참가자들의 질문과 토론들로 채워졌습니다.

삼성동에 위치한 웹에이젼시 디트라이브에서 장소를 협조해 주어서 너무나 예쁜 회의실에서 모처럼 맑아진 하늘 아래 환한 햇살을 받으며 주말 오후를 아깝지 않게 추억할 수 있었던 것 같아 이 자리를 빌어 디트라이브에 감사의 인사를 전합니다. (이후 행사에도 꾸준히 디트라이브가 공식적(?)으로 후원을 해 주었으면 하는 간절한 소망이...)

2009년이 막 시작되던 어느 날엔가 제가 하드코딩하는 사람들(네이버 카페)에 올렸던 글 하나가 화두가 되자 애틱님께서 여러 말씀과 조언을 주셨고, 그런 애틱님께 함께 해 주시기를 부탁드렸던 것이 이렇게 클리어보스라는 이름으로 조촐한 자리를 마련하게 되기까지의 과정이었습니다.

부족한 것도 많았고, 아쉬운 점도 많았습니다. 첫째로 준비해 간 발표 자료가 조금 더 많은 분들께 공감과 이해를 드리기에 부족하지 않았나 싶고, 드리고 싶은 선물도 많았으나 형편상 그러지 못한 것이 또한 아쉬웠습니다. 둘째로는 참가자분들의 적극성이 조금은 아쉬웠습니다. 하지만 역시나 뒤풀이 장소에서는 서먹함이 많이 없어져서인지 본 행사 때보다 더 많은 질문과 이야기들을 나누는 것을 보고, 뒤풀이가 뒤풀이가 아닌 본 행사였지 않았나 싶을 정도였습니다. 셋째로 가장 큰 아쉬움은 모시고자 했던 스무분 모두가 참석해 주시지 못했던 것이었습니다. 한 두분 정도의 열외는 예상을 하고 있었지만 생각보다 많은 여섯분께서 함께 해 주시지 못했었습니다.

다음 자리는 아마도 10월쯤 되는 가을에 준비가 되지 않을까 싶습니다. 1년에 2회 정도로 계획을 세우고 있고, 기수제로 운영하여 이렇게 한 번 모여진 분들간에 친목과 인맥을 맺어 주는데도 지속적으로 힘을 쓰고 싶습니다.

마무리하면서 여러가지로 설익었던 첫 자리였음에도 자리를 찾아주시고, 힘을 보태주신 여러 참가자분들과 행사 내내 자리를 꾸며 주시고, 진행을 도와주신 루트박스님과 애틱님, 비티님께 다시 한번 감사의 말씀을 올립니다.

2009년 2월 18일 수요일

피드버너 등록했습니다.

이 블로그를 본격적으로 운영하기 시작한 것이 2007년 6월 이후였고, 1년하고 7개월 정도의 시간이 지난 것 같습니다. 일기와 리뷰 등으로 이루어졌던 페이지오프가 '웹 표준'이라는 하나의 주제로 좁혀지고, 꾸준하지는 않지만 나름 열심히 글을 써 올려 왔습니다. 때문인지 작년 말부터 올 초에 이르는 짧은 기간동안 방문객 수가 과거에 비해서 꾸준히 올라가는 것을 볼 수 있었습니다. 물론 여러 파워블로그들과는 비교가 되지 않고, '웹 표준'을 다루는 유명 블로거 분들과는 그 차이가 크지만 나름의 발전을 이뤄 나가고 있다고 생각하고 있습니다.

얼마전에는 IT 블로그중 유명한 '차니블로그'가 구독자수 10,000명을 넘겼다는 희소식이 전해 지더군요. 어찌나 부럽던지요. 본업을 뒷전으로 미루고 '블로그질'만 하면 안된다는 생각은 들지만 뭔가 나라는 사람을 도드라져 보이게 해 주는 이 블로그를 냉냉하게 버려둘 수는 없게 되었습니다.

그래서 카테고리도 정비하고, 포스팅의 범위도 넓혀 최근에는 '웹 표준' 관련 해외 소식도 간단히 번역해 올리고 있고, 의식적으로 구독자 수도 늘려보려고 약간의 노력을 기울이고 있습니다. 관련해서 저도 처음으로 피드버너라는 것을 등록했는데요. 구글 리더나 한RSS 등 중구난방으로 읽혀져서 구독자수 파악이 되지 않는 문제를 해결해 준다고 합니다.

새로이 제 블로그를 찾아 주시고, 구독해 주신다면 어렵지 않게 피드버너의 통계로 포함이 될 듯 하나 많지는 않지만 그동안 제 블로그를 구독해 주신 몇 몇 분들의 통계는 잡히지 않을 것이기에 이렇게 따로 공지를 올리면서 한번 더 제 블로그를 구독해 주셨으면 하고 부탁드리고자 합니다. 우측 사이드바에 위치한 RSS구독하기나 아래 링크를 이용해 주세요.

2009년 2월 17일 화요일

성공적인 웹 사이트를 오픈하기 위한 13단계

emoxie에 올라온 글 13 Steps to a Successful Website Launch 에서 웹사이트 오픈을 위한 체크리스트가 소개되어 있어 간단히 소개해 드립니다.

Website Launch Checklist
  1. 맞춤법과 문법 오류를 확인한다.
  2. 마크업과 CSS에 대한 유효성 검사(Validator)를 수행한다.
  3. 모든 폼(forms)을 확인하라. 고객이 요구한 이메일 주소로 바꾸었는지 확인하라.
  4. 당신의 웹사이트가 리다이렉션되는지 .htacess 파일을 확인한다.
  5. 이미지가 절대 경로로 되어 있는지 확인하라.
  6. 개발시 생성한 임시 데이터(Dummy Data)를 확실히 제거하라.
  7. 만약 전자 상거래 웹사이트를 오픈한다면, 개발시 시험 모드와 디버깅 모드를 해제하라.
  8. 고객이 원하는 경우 Google Analytics이나 트래킹 스크립트를 추가하라.
  9. contact@yourdomain.com 과 같은 이메일 주소를 확인하고 설정하라.
  10.  다양한 브라우저에서 제대로 보이는지 확인하라. IE6이 웹사이트를 망가뜨리는지 확인하라.
  11. SVN을 사용하는 경우
    1. 모든 최종 파일을 커밋한다.
    2. 최신의 파일을 모두 업데이트한다.
  12. FTP를 사용하는 경우
    1. 모든 파일에 대한 마지막 백업을 수행한다.
    2. 서버에 모든 최종 파일을 업로드한다.
  13. 3,4,10번 단계는 반복해서 수행하라.

2009년 2월 15일 일요일

첫번째 웹퍼블리셔 오리엔테이션을 갖습니다.

얼마전 '웹표준의 날'이 있었습니다. 100여분 내외의 많은 분들이 참석해 주신 큰 행사였는데요. 아직 그 여운이 채 가시지 않았지만 클리어보스에서 년초에 기획했던 작은 이벤트 하나를 이번주 토요일 오후에 열어 보고자 합니다.

웹표준에 대한 관심이 높아지면서 많은 분들이 '웹퍼블리셔'라는 새로운 직업에 대해 관심을 갖기 시작했습니다. '웹 퍼블리셔 오리엔테이션'은 그런 분들을 위한 자리입니다. 웹 퍼블리셔로 1년 미만의 경력을 가진 신입이나 웹 퍼블리셔를 준비하고 있는 예비 웹퍼블리셔(무경력) 분들을 모십니다.

이 이벤트에서는 웹 표준 기술을 이야기하지는 않을 것입니다. 직업에 대한 이해를 도와주고, 여러분보다 먼저 이 일을 시작했던 분들의 고민을 공유하는 자리가 될 것입니다. 또한 이 자리에 모인 분들께 아주 특별한 인연과 동기들을 만날 수 있도록 도움을 드리고자 합니다.

  - 일시 : 2009년 2월 21일(토) 13:00 ~ 17:00
  - 장소 : 디트라이브 회의실(삼성동)
 
디트라이브 찾아오는

디트라이브(삼성동) 찾아오는 길


  - 대상 : 총 20명 - 미취업 입문자(10명)와 신입 1년차 이내(10명)
  - 신청 : 웹퍼블리셔 오리엔테이션 신청 페이지
  - 선정 : 선착순 (단, 경력 1년 이상자 등록시 취소되며, 되도록 경력이 낮은 분들께 우선권을 드리도록 할 예정입니다.)
  - 참가비 : 3,000원
  - 내용
    1교시 : 행사 소개 및 인사(30분 / 명함 준비)
    2교시 : 브라우저 전쟁을 통해 바라본 웹표준 역사(30분 / 봄눈)
    휴  식 : 20분
    3교시 : 웹 퍼블리셔로 살아가기 (120분 / 에틱, 비티, 루트박스, 봄눈 - 다과와 함께)
  - 문의 : 봄눈(chubzo@gmail.com)

※ 1년 이상의 경력자의 신청은 받지 않습니다.

2009년 2월 11일 수요일

47분 안에 CSS로 레이아웃을 만들지 못하면 테이블을 쓰세요

아주 바보같은 장난(very nerdy joke)임을 미리 밝혀 둡니다. Todd와 Brian은 몇달 전 CSS로 모든 브라우저에 맞는 레이아웃을 만들다가 재밌는 아이디어를 하나 떠올렸다고 합니다. Brian은 곧 47분동안 카운트다운이 되다가 시간이 지나면 'It's time to give up'이라는 메세지와 함께 테이블(Table for Layout)을 사용하라는 메세지를 출력해 줍니다. 이 장난끼 가득한 이벤트의 전체 이야기는 Golden State Communication 에 올라온 Todd의 글을 읽어 보시면 됩니다.

그들이 만든 GIVE UP AND USE TABLES 사이트는 아래와 같이 생겼습니다. 이 이벤트의 간단한 내용이 소개되어 있고, CSS를 이용해서 레이아웃을 배치하는데 걸리는 최대 소요 시간이 47분으로 잡았다고 이야기하고 있습니다.(We've scientifically determined the maximum amount of time that you should need to make a layout work in CSS: it's 47 minutes.) 그래서 카운트다운은 정확히 47분입니다. 웹사이트가 아닌 로컬에서 실행할 수 있는 다운로드 버전도 함께 제공하고 있습니다.

46:59 부터 카운트가 되기 시작합니다.


47분이 경과되면 테이블을 쓰라고 하네요...


다시 한번 말씀드리지만 이것은 만든이들도 언급했듯이 일종의 장난입니다. 개인적으로는 약간은 풍자이기도 하다는 생각을 해봤습니다. CSS가 분명 웹 사이트를 논리적으로 의미있게 만드는 가장 최선의 선택이지만, 현실에서 Table을 이용한 레이아웃 배치보다 드는 시간과 노력이 결코 낫다고는 보기 어려운 경우가 종종 있기 때문입니다.

그들의 주장대로 CSS 레이아웃 배치에 드는 최대 시간이 (과학적으로) 47분(특정 예제가 소개되지 않는 것으로 보아 일단 일반적인 레이아웃 배치의 평균치를 계산한 듯 함)이라고 할 때 한번쯤은 호기심으로 자신을 시험해 볼 수는 있겠습니다만 관련 글에 대한 댓글(의견)이나 Todd 스스로가 고백하듯 Table을 이용한 레이아웃은 결코 바람직하지는 않다는 것을 명심하시길 바랍니다.


※ 제가 영어가 (매우) 짧습니다. 혹시라도 제가 잘 못 번역해서 의미 전달을 잘못 한 것이 있다면 알려주세요.

2009년 2월 9일 월요일

em 크기를 찾아주는 차트

'em 계산을 쉽게 하세요'라는 글을 통해서 계산기 방식으로 em 값을 알아내는 사이트를 알려드렸었는데요. 오늘은 Aloe studios 에서 em(글꼴 단위) 차트를 만들어서 공개한 em 차트를 소개해 드립니다.

현재의 px 사이즈에서 원하는 px 사이즈 값을 찾아가면 화면과 같이 em 값을 쉽게 찾아낼 수 있도록 고안된 차트입니다.


KADO 정보통신 보조기기 체험관 견학

세번째 웹 표준의 날 공식 행사를 시작하기 한시간 전 KADO 1층에 마련된 '정보통신 보조기기 체험관'을 견학하는 시간이 있었다. 세번째 웹 웹표준의 날 행사 풍경에 이어 두번째 풍경을 소개해 드립니다.

KADO 현준호 부팀장님의 설명을 듣고 있는 사람들

청각 언어장애인을 위한 실시간 전화 서비스

토요일 오후에도 여러 직원이 나와서 근무를 하고 있다.

어떤 방식으로 할까?

청각 언어장애인을 위한 실시간 전화 서비스는 음성 전화를 수화로 전환하여 청각 언어장애인에게 전달하는 중계 서비스입니다. 한국정보문화진흥원 통신중계서비스 웹페이지를 통해서 더 자세한 정보를 찾아 보실 수 있습니다.

KADO 전시실 안내를 위한 점자 안내도

전시실 전경, 다양한 장애 환경을 위한 제품들이 전시되어 있다.

웹표준 전도사이신 신현석님께 여러가지 질문을 하고 있는 사람들

저시력자를 위한 화면확대 프로그램

직접 체험을 해보는 있는 손님

헤드포인터와 클리어 뷰 헤드 포인터

손으로 키보드 타이핑이 어려운 이들이 사용할 수 있도록 고안된 입력보조도구이다.

책장넘기기 및 타자 입력 보조도구를 살펴보고 있다.

(가운데) 손가락 움직임이 힘든 장애인이 책장 넘기기, 컴퓨터 자판입력하기, 전화기 버튼 누르기 등의 활동에서 손사용을 보조하는 입력보조도구로 사용된다.

움직임을 통해 명령을 전달하는

열심히 움직여 보고 있는 서정민군. 마음대로 되지 않나 보다.

브이패드

현준호 부팀장님과 신현석씨가 함께 스마트뷰 익스탠드를 살펴보고 있다.

스마트뷰 익스탠드는 19인치 모니터를 통해 글자, 그림 등을 확대해서 볼 수 있는 장애인용 탁상형 독서 확대기다.

한글키보드미투와 키가드, 조이스틱형마우스, 조이스틱롤러마우스, 헤드마우스

(좌측부터) 한글키보드 미투와 키가드는 키보드 사용 초보자를 위해 자판 배열을 가나다 순으로 맞춘 키보드와 키가드이며, 조이스틱형마우스는 상지 미세 근육이 발달하지 않은 장애인이 손목을 지지해 주는 받침대를 이용하여 사용 가능한 조이스틱 모양의 마우스. 조이스틱롤러마우스는 조이스틱과 3개의 버튼을 사용하는 마우스, 헤드마우스는 머리에 착용하여 사용하는 마우스다.

확대키보드 빅키, 트랙볼 마우스, 각종 스위치

(가운데) 확대키보드 빅키는 손의 사용이 부자유스러운 지체 장애인들이 키보드를 사용하기 용이하도록 키보드를 4배 정도 확대한 키보드이며, (우측) 트랙볼 마우스는 손바닥 등으로 큰 볼을 움직여서 사용하는 마우스. 좌우로 배치된 각종 스위치는 켜기/끄기(실행/중지) 기능의 입력보조를 위한 스위치들이다.

포켓고토크,코토크9+,키즈보이스,오케이톡톡,JOY-10

(좌측부터) 포켓고토크 고토크9+는 의사표현을 원할하게 하지 못하는 장애인의 의사소통을 보완하고 대체하는 의사소통 보조기기이며 키즈보이스는 의사소통 장애인의 원활한 의사소통을 돕고 언어발달과 언어습득 훈련, 발성발어 촉진, 발음훈련을 위한 보안대체의사 소통기기. 오케이톡톡은 언어훈련 및 언어치료를 위한 보안,대체 의사소통기기로써 기본적으로 저장된 데이터 외에 제공된 소프트웨어 컴퓨터에 설치하면 직접 녹음한 소리와 이미지도 처리. JOY-10은 귀의 구조를 싸고 있는 뼈를 통해 소리를 전달하는 골전도 방식을 통한 골도무선음향청취기.

수화로 의사전달을 쉽게 할 수 있는 영상전화기들

비쥬폰은 수화 통화 및 인터넷을 활용하여 무료통화가 가능한 영상전화기이다.

영상전화 비쥬폰

한국농아인협회 지역 및 지부 영상전화기 번호가 소개되어 있다.

영상전화 브이패드

브이패드는 인터넷 기반의 영상,음성,문자를 통합하는 청각 및 언어장애인의 통신 단말기다.

컴퓨터 화상 장치

조우스2,분리형키보드

조우스2는 입 도는 턱, 볼 등 머리의 움직임을 통해 커서를 이동하고 호흡을 통해 클릭 기능을 사용할 수 있는 특수마우스이며, (맥심)분리형키보드는 오른손, 왼손 사용 영역이 분리되어 사용자의 상태에 따라 적합하게 사용할 수 있는 분리형 키보드. (전시장 PC에는 실행되어 있지 않았으나 함께 소개되고 있는) 다음음절예측 입력S/W 바로키는 마우스, 스위치 등을 통해 사용하는 모니터용 키보드 소프트웨어이다.

킹키보드,헤드마우스 익스트림, 3발 머리마우스, 손바닥마우스

킹키보드는 키가드가 부착된 확대 키보드이며, (모니터 앞 카메라처럼 생긴 것과 까만색 장치)헤드마우스 익스트림3발 머리마우스는 반사체의 움직임에 따라 컴퓨터의 커서를 움직일 수 있는 특수 마우스. 손바닥마우스는 손에 쥐고 손가락을 이용하여 사용 가능항 마우스다.

마우스 스틱, 마우스 스틱용 킵드, 트랙볼 손가락 마우스

(좌측부터) 마우스 스틱마우스 스틱용 키보드는 함께 사용되는 도구로 마우스 스틱을 사용하여 타이핑을 쉽게 할 수 있도록 제작된 키보드이며, 트랙볼 손가락 마우스는 팔 움직임이 불편한 분이 손가락을 이용하여 작동시키는 마우스이다.

좌측부터 아이보드, 한손사용자용 키보드, 라꾸라꾸 마우스, 마운트형 미니키보드

아이보드는 음절 예측이 가능해 일반 키보드보다 좀 더 빠르고 편하게 입력을 가능하게 해주며, 한손 사용자용 키보드는 한 손만을 사용하여 타이핑을 할 수 있는 키보드이며, 라꾸라꾸 마우스는 방향 및 좌우 클릭 등의 기능버튼을 통해 사용하는 마우스. 마운트형 미니키보드는 키보드마운트를 이용하여 키보드의 위치 및 각도를 사용자에 맞게 조절하여 사용가능한 키보드.

신현석씨가 마우스 스틱 키보드를 살펴보고 있다.

양손을 사용할 수 없는 장애인이 마우스 스틱, 헤드 포인터 등을 사용하여 입이나 발로 타이핑을 할 수 있도록 도와주는 보조기기이다.

핸디아이-프로, 화상키보드 클리키, 이지트랙볼

(좌측부터) 핸디아이-프로는 얼굴 등 특정부위의 움직임을 인식해서 사용하는 마우스, 화상키보드 클리키는 마우스, 스위치 등을 통해 사용하는 모니터용 키보드 소프트웨어, 이지트랙볼은 손바닥 등으로 큰 볼을 움직여서 사용하는 마우스다.

반디, 포켓뷰어, 센스뷰 포터블, 센스뷰 듀오

(좌측부터) 반디, 포켓뷰어, 센스뷰 포터블, 센스뷰 듀오로 문서, 사진 등 각종 인쇄물 등을 확대하여 볼 수 있는 휴대용 독서확대기.

보이스아이 메이트의 바코드 판독 장치

보이스아이 메이트의 음성 출력 장치

보이스아이 메이트는 2차원 바코드인 '보이스아이'가 삽입된 인쇄물의 내용을 음성으로 들려주는 인쇄물 음성변환 출력기다.

마치 MP3 플레이와 같이 생겼다.

DF-VOICE TTS

시각장애인이 디지털 콘텐츠 자료 및 학습 독서환경을 제공함으로써 언제 어디서나 정보습득이 가능하도록 개발된 제품으로 TTS엔진을 추가하여 일반 텍스트 문서를 음성으로 재생하는 시각장애인용 PDA

독서확대기 센스뷰

독서확대기 머린LCD

점자정보단말기 한소네2

스크린리더를 살펴보고 있습니다.

각종 정보통신 보조기기를 소개하고 있는 안내책자


KADO는 당산역에서 버스로 10여분 거리에 위치한 곳으로 그다지 지리적 접근성이 좋은 곳은 아니다. 그리고 정보통신 보조기기 체험관 역시 토요일이나 일요일은 공개되지 않고 있어서 주중 오후에 일반인들이 찾기가 쉽지 않은 곳이다. 세번째 웹표준의 날을 맞아 특별히 KADO를 찾아주신 분들에게는 아주 좋은 체험과 경험이 되지 않았을까 싶다.

사진이 촬영된 제품을 위주로 간단히 제품소개를 해 봤는데 KADO가 운영하고 있는 '정보통신 보조기기' 웹사이트를 방문하면 더욱 많은 제품과 상세한 소개를 제공받을 수 있다.

PS/ 체험관 안내와 소개를 맡아 주신 KADO의 현준호 부팀장님께 감사드립니다.


NULI의 두번째 변신, NHN 웹표준화팀 웹표준 가이드라인 변했다

NHN의 웹 표준화팀이 운영하고 있는 NULI가 지난 4일 새단장을 했습니다. NULI는 여러 블로그와 사이트, 세미나 등을 통해서 UI개발과 웹표준 관련 가이드라인 사이트로 많이 알려져 있는데요. 2009년 네이버 개편과 각종 신규 서비스 오픈으로 정신이 없었을 것으로 생각되는데 이렇게 멋진 모습으로 리뉴얼을 하다니 놀랍네요.

NHN 웹표준화팀 웹표준

XE기반으로 새롭게 개편된 NULI


일단 공식적인 개편 공지에 따르면 이번 리뉴얼은 'NHN 웹표준화팀의 고도화된 마크업 기술을 널리 제공하기 위함'이라고 합니다. 지금까지도 훌륭한 콘텐츠들로 국내 웹표준 저변 확대에 기여를 해 주었는데 앞으로 더욱 더 활발히 운영될 것이라는 짐작을 가능케 하네요. (왠지 박 팀장님이 직원분들을 엄청 괴롭히실 것 같네요^^;)

특히 이번 개편에는 네이버의 오픈소스 프로젝트인 XE를 이용하고, 공개 글꼴인 나눔글꼴을 사용한 점이 눈에 띕니다. 아울러 제대로 웹 표준을 준수하고, 의미있는 마크업과 CSS 를 구현한 사이트가 부족한데 NULI가 이에 부흥하는 데모 사이트의 자격까지 갖추고 있어 매우 의미있는 개편이 되지 않았나 생각됩니다.

보다 자세한 개편 안내는 '널리가 개편되었습니다'를 참조해 주시면 될 것 같습니다.

PS/ 박 팀장님 이하 NHN 웹표준화팀 모든 분들의 노력과 정성에 감사의 마음을 전합니다.

러시아제 CSS Layout 생성기

최근 CSS Layout 생성기가 여러개 소개되고 있네요. 그중에 러시아에서 만들어서 '무료'로 사용을 허락하고 있는(사이트에 'FREE'가 너무나 인상적이라...) 생성기 하나를 소개해 드립니다.

러시아에서 만든 CSS Layout Generator


영어가 아닌 러시아어라 처음에는 도대체 뭘 눌러야 해? 라고 생각했지만 어차피 선택하는 것이 몇가지 없어서 몇 번 바꿔가며 누르다 보니 대충 다 파악이 되었습니다.

구글 번역기와 몇번의 수작업으로 파악한 번역을 위 이미지에 함께 적어 두었으니 참고하시길 바랍니다.

바닥글(Footer)을 브라우저 하단에 고정하는 레이아웃도 쉽게 만들 수 있어서 편리하네요. 생성된 레이아웃은 샘플 HTML 문서와 CSS 문서를 압축한 zip 파일로 내려 받아서 '공짜'로 쓸 수 있습니다.

2009년 2월 8일 일요일

세번째 웹표준의 날 행사 풍경

지난 토요일(7일) CSS Design KoreaClearboth가 주최하고, 한국정보문화진흥원(KADO)가 후원하는 '세번째 웹 표준의 날(CDK 공지)' 행사가 있었습니다.

행사를 이끈 홍윤표님과 자원봉사자, 발표자분들 그리고 함께 해주신 100여명의 웹표준 지지자 모든 분들의 노력과 관심으로 사고 없이 잘 마칠 수 있었던 행사가 아니었나 싶습니다.

세번째 웹 표준의 날 행사와 관련한 첫번째 포스팅으로 이 날의 풍경을 소개해 드립니다.

우리들의 호프 듀트님이십니다

신현석님께서 자원봉사자들로부터 명찰을 받고 계십니다.

웹 표준 뭐라고 생각하세요? 라는 질문에 대한 댓글 이벤트를 한곳에 모아 투표를 했습니다.

일찍부터 행사장에 나와 자리를 지켜준 자원봉사자들

행사 시작 전 한산한 분위기입니다.

프리젠테이션 도우미를 자청(?)한 듀트님의 맥북입니다.

슬슬 손님들이 들기 시작했습니다.

이름을 확인하고 있네요.

발표자들도 슬슬 준비를 합니다.

한 두 자리씩 채워지기 시작합니다.

발표자들도 덩달아 분주해 지기 시작합니다.

낯이 익은 분들도 계시네요^^

듀트님의 오프닝 멘트와 함께 세번째 웹 표준의 날 행사가 시작되었습니다.

금새 이만큼 찼습니다.

첫번째 세션은 NHN의 정찬명님께서 '웹표준을 넘어서'라는 주제로 발표를 해 주셨습니다.

찬명님의 발표를 경청하고 있습니다.

쿨럭; 저에요;;;;; (패스)

의자가 부족해서 ㅠㅠ 발표자들은 이렇게 쭈구리고 앉았습니다.

부족한 제 발표를 경청해주고 계신 분들. 아직 PPT 첫장이었을 뿐이니까....

저는 웹표준, 기술의 진정성이라는 주제로 발표를 했습니다.

세번째 세션은 잡코리아의 장성민님께서 '장차법 시대의 웹표준'이라는 주제로 발표를 해 주셨습니다.

가운데 서정민(Skell83)군이 눈에 띄네요. 집이 부산 저기 어디인데 자주 올라오는군요-_-

한쪽에서는 발표자들이 뭔가를 하고 있습니다. 뭘까요?

장성민님께서 돈 얘기를 하고 계시네요?

우리의 히어로 윤좌진님께서 몸소 던킨도너츠를 손님들께 돌리고 있습니다. 물론! 좌진님이 쏘신건 아니구요. KADO에서 후원해 주셨습니다. 감사합니다!

먹는 시간이 더 화기애로운데요....

다섯시간이 넘는 행사중에 이탈자가 많지 않았는데 역시 배를 채워드려야...

쉬는 시간에는 두장씩 받은 스티커로 투표도 합니다.

찬명님 금새 한 자리 차지하셨네요. 식사중에도 뭘 그렇게 열심히 하세요?

앗... 찬명님... 미투를 하고 계셨군요 ㅠㅠ

행사 중반을 넘어 이젠 조현진님께서 '개발자를 살려주세요!' 캠페인의 전모를 파헤쳐 주셨습니다.

오리지널과 표절의 차이(?)

저 캠페인 하시다가 욕 많이 들으셨다네요 ㅠㅠ

자원봉사자 분들도 슬쩍 끼어서 도강(?)하고 있습니다~ 공부를 위한 저 열정!

듀트님께 딱 걸렸네요;

헉.. 저 장난끼 어쩔겁니까;;

성민장군님도 뭔가를 하고 계시네요...(역시 미투?)

발표자가 바뀔 때마다 뻘쭘하게 소개를 대신해 주고 계시는 듀트님

나도 갖고 싶다. 맥북! (이날 발표자중 유일하게 맥북이 없었던 봄눈입니다ㅠㅠ)

KADO의 한정기 과장님께서도 나오셔서 '웹 접근성 품질마크 소개'를 발표해 주셨습니다.

KADO의 문준기 대리님께서는 '웹 접근성 자동평가 도구 KADO WAH'를 소개해 주셨습니다.

대리님 눈매가 부리부리하신게 무서웠습니다;

스크린리더도 소개를 해주셨습니다. 사진으로는 안 들리겠죠;

마지막 세션인 '선배에게 질문하세요'시간입니다. NHN의 윤좌진님!

오페라 소프트웨어의 신현석님~ 선물을 많이 가지고 오셨드랬지요^^

NHN의 정찬명님이시구요~ 나라디자인이라는 블로그로 더(?) 유명하신것 같습니다.

다음주에 새신랑 되시는 케익소프트의 조훈님이세요^^ 결혼 축하드립니다.

당당히 '백수'임을 밝히신 조현진님^^ 하지만 직장 다닐때보다 더 바쁘시답니다~

그리고.. 쿨럭; 패스~

행사가 마무리되고, 마지막 남은 선물을 추첨을 통해서 드리는 자리입니다.

선물을 받고 감격하신 여자분...


이상으로 세번째 웹 표준의 날 행사 풍경을 담아보았습니다. 사진 정리하는 것도 꽤나 힘이 드네요; 헉헉;

두번째로 웹 접근성 기기들을 촬영한 것들이 있는데 그 사진들도 곧 공개하도록 하겠습니다.