최근 케나다 아이폰 전화 플렌의 개선을 촉구하는 서명운동으로 스티브잡스에게 반대서명을 보낸일이 있었지만 아무튼 개개인의 서명과 함께 목소리를 높이는 좋은 시도 같습니다. 저는 미국인지라 어떻게 동참할수 있는건지는 모르겠지만 아무튼, 좋은 결과 있기를 바래봅니다.

한창 와우를 즐길때에도 와우 이야기를 올리지 않은 이곳에 왠 또다른 블리자드의 게임, 디아블로 이야기인가 라는 생각도 들지만 디아블로3 의 공식홈페이지에 올라온 게임플레이 시연 동영상을 보니 이야기를 안꺼낼수 없겠더군요.

각종 사이트들에 짧게짧게 영상들이 올라왔지만 공식홈페이지의 꽤 긴 영상을 보고 나시면 감동이 몰려오실겁니다.

지난번 우연히 디아블로3 생각에 여기저기 찾아봤지만 몇달전 diablo3.com의 도메인을 블리자드가 구입했다는 소식밖에는 건질 것이 없었는데 설마했던 순간 터져나오는 이 기쁜 소식이 믿겨지지가 않을 정도입니다. 아직 많은 부분이 공개되지 않았지만 예전 디아블로의 느낌을 잘 살렸다는것, 속도감과 리얼리즘이 잘 표현된 것에 대해 대환영입니다. 스토리도 그 어느때보다도 방대하고 탄탄하다고 하니 상당한 기대감을 불러 일으키는군요. 요즘은 게임에서 멀티플레이가 상당한 중요성을 갖는만큼 베넷으로의 플레이에 대한 더 자세한 정보가 나왔으면 했지만 아무튼 이번 공개만으로도 만족하고 있습니다.

3에 대한 전율을 이기지 못하고 예전의 감동을 느껴볼까 해서 곧바로 이베이에서 디아블로2를 $5에 주문했습니다.

디아블로3 출시전에 디아블로1 부터 2, 확장팩 까지의 스토리를 읽고 싶으시면 이하의 사이트들을 방문하시면 될듯 합니다. 물론 검색엔진에서 검색하셔서 직접 찾아 보셔도 되겠죠.

• hell-gate.com
• 디아블로겔러리

디아블로2의 권장 시스탬 조건을 보니 놀라울 뿐입니다.
물론… 이제 디아블로3를 위해서 아이맥을 장만해야겠죠?

Single-Player PC System Requirements:
Windows® 2000*, 95, 98, or NT 4.0 Service Pack 5
Pentium® 233 or equivalent
32 MB RAM
650 MB available hard drive space
4X CD-ROM drive
DirectX™ compatible video card

Multiplayer PC System Requirements and Options:
64 MB RAM
Open Battle.net game Creators and TCP/IP game Hosts: 128MB RAM recommended (256MB RAM in games with over 4 players)
950 MB available hard drive space
28.8 Kbps or faster modem
Up to 8 Players over TCP/IP Network or Battle.net® (Requires low-latency Internet connection with support for 32-bit applications)

Optional PC 3D Acceleration:
Supports Glide™ and Direct 3D™ compatible video cards with at least 8MB of video RAM. Direct 3D™ requires 64 MB of system RAM

벡터 패턴으로 지난 디자인 리뉴얼때 디자인이 그게 뭐냐 라는 비판을 많이 받았지만 그는 꿋꿋히 디자인을 고수했고 이번 리뉴얼은 그의 디자인이 그당시 미래를 예측한 디자인 트랜드였다는 것을 잘 보여주고 있습니다.

물론 국내에도 비슷한 패턴을 즐기시는 분이 계시죠. Jay. ^^
그러고보니 제이님께서 선구자!?

최근 맘에 들었던 디자인이 케나다 웹디자이너 Jeff Sarmiento 의 새 집입니다. 약간의 빈티지 느낌이 나면서 색상조절이 잘된 사이트 같죠.
anti-aliasing 이 잘먹힌 영어폰트를 보면 부러운건 어쩔수 없나 봅니다.

하지만 이루어지지 않았습니다.

정말 한국 IE/플래쉬 협회에서 막은것일지도 모르겠다는 생각이 들지만서도 아무튼 불여우 모바일, 오페라 모바일등이 풀브라우징의 대세에 맞추어 한국 모바일에도 살금살금 들어오고 있다고 하니 기대하고 지켜볼 부분인거 같군요

/

PS. 시간이 참 빨리 흐릅니다. 2008년의 반이 지나갔다니요… 도망가는 시간을 잡아본다고 부랴부랴 다 끝내지도 못한 사이트를 출품해서 웹표준대회도 참가도 해보고(심사위원님들께서 실망하셨을 겁니다 죄송합니다.ㅠㅠ 마감시간이..) 미친듯이 일에도 전념해보고 주말에는 열심히 여가도 즐겨보고 했습니다만, 돌아보면 시간은 기다려주지 않았더군요. 제가 그나마 조금 컨트롤 할수 있는건 앞으로 다가올 시간들. 어차피 지가나가는 시간 또 열심히 보내봐야겠습니다 ^^

요즘 웹표준이 부각되면서 사내에서 표준 세미나도 하시고 어렵게 어렵게 표준에 대해 노력을 힘쓰시는 분들에게 멋진 박수를 보내드리고 싶습니다. 쉽지 않은일 같지만 지금까지 변화되어 온걸 보면 그다지 먼 미래 같지는 않습니다. 화이팅을 외치면서, 이번에 웹표준 대회가 열린다고 해서 오랜만에 포스팅을 올립니다.

누군가가 시켜서 만드는 웹, 누구를 위해 만드는 것인지 알 수 없었던 웹은 이제 우리 자신과 보다 많은 사람들을 위해 개선되어 나가야 합니다. 더 많은 사람들이 더 좋은 방법을 이용하여 웹 사이트를 제작하고 사용할 수 있어야 하고, 시대가 이런 점을 이미 요구하기 시작했습니다. 이제는 가르치고 배우는 과정을 넘어 더 많은 사람이 보다 손 쉽게 이용할 수 있는 웹 표준으로 나아가야 할 것입니다. ‘규칙과 창조의 만남’이라는 슬로건처럼 웹 표준이라는 규칙을 지킴으로써 사이트가 얼마나 창조적으로 유연하게, 얼마나 더 편리해질 수 있는지를 많은 사람들이 알 수 있게 될 것입니다.

CSS Design Korea에서 주최하고, Hosting.kr, 에이콘출판사, 디지털미디어리서치가 후원하는 이번 대회는 2008년 5 월 1일부터 약 한달간 진행되며 2008년 6월 예정인 세번째 웹 표준의 날에 그 대미를 볼 수 있게 됩니다. 우리가 원하는, 모두를 위한 웹을 만들어가려는 이번 행사에 많은 분들의 참여를 기대합니다.

이번 웹표준 경진대회는 웹표준을 널리 알리고 웹표준의 멋진 프로젝트들이 여기저기 튀어나올수 있는 기회라고 생각됩니다. 많은 참여가 있으면 좋겠고 아마도 많은 학생들이 참여하지 않을까 하는 짐작을 해봅니다. 실무에서 뛰시는 분들은 시간내기가 쉽지 않겠죠? (를 뛰어넘어 밤새 제작하시는 분들이 머리속에 상상이 됩니다만…)

질문은 언제나처럼 CSS Design Korea 에 그리고 더 자세한 정보는 웹표준 경진대회 공식 사이트를 참고하시면 되겠습니다. 화이팅!

요즘 지구가 많이 아프긴 아프구나라는걸 자주 느낍니다. 겨울이 온듯 만듯 사라지고 눈도 온건지 안온건지.. 특히 요즘 TV를 통해 중국 올림픽에 매연이 너무 심해서 게임을 진행하기 힘들지 않겠느냐는 우려를 자주 보기에 그냥 지나갈 일은 아니구나 라는 생각이 듭니다. 예전에는 별 생각 없었는데 요즘따라 더욱 그러네요. 친환경을 위해서래도 하이브리드 자동차를 사야 하나 고민도 되고 말입니다.

이번 4월 22일은 바로 이러한 고민들을 직접 행동으로 옮기거나 친환경의 중요성을 알리는 “지구의 날”입니다. 친환경적인 사회적 분위기를 조성하고자 또한 말로만이 아닌 법적으로, 행동으로 옮기자는 목소리를 담는 날입니다. 홈페이지를 통해 각자가 참여할수 있는 여러가지 단체나 기관들이 소개되어 있고 전구를 바꾸는 작은 일들 또한 자세히 나와있습니다. 또한 이번 2008년 지구의 날에 진행되는 많은 행사들이 소개되어 있네요.

구글도 적극 참여하여 “이번 지구의 날에는 무엇을 하시겠습니까?” 라는 페이지로 전 세계적으로 목소리를 모으는 일로 동참하고 있습니다. 살펴보니 아직 한국에는 목소리가 없군요 단순히 내가 그날이라도 전기를 꺼놓겠다던지 운전을 하지 않고 걷거나 대중교통을 이용하겠다던지, 세탁기를 돌리기 보다는 손빨래를 해보겠다던지 등등의 지구살리기 운동에 조금이나마 도움이 되는 일을 하겠다고 다짐하는 글을 넣으시면 됩니다. 방법은 오른쪽의 “Submit Your Message”를 클릭하셔서 이름, 이메일, 우편번호, 국가, 메세지, 유튜브로 제작한 메세지(옵션) 을 적어 넣으시면 되겠습니다.

전 그날 하루만이래도 모든 집의 불을 끄고 노트북 빼고는 컴퓨터들, TV, 오디오, 프린터 각종 가전제품은 다 꺼놓을 생각입니다. 손빨래는 좀 고민을 해 봐야겠고, 환경에 좋지 않다는 샴푸 대신 비누로 머리도 감고 분리수거도 해보고 말이죠.

지금까지 못하신 분들 혹은 모르셨던 분들 (저를 포함하여 ㅠㅠ) 오늘부터라도 조금씩 아끼며 지구를 살려갑시다. 지구야 힘내라!

P.S. 대구에서 멋진 이벤트가 있군요. 지구의날의 행사중 하나인 차없는 거리인데 멋진 이벤트라고 생각되네요.

4월 20일(일) 0시부터 24시까지 중앙네거리에서 반월당네거리까지 차량의 출입을 통제해 차없는 거리로 만들 예정이라고 합니다.

이 외에도 “자전거 대행진” 행사도 있고 다양한 이벤트들이 있으니 참여해보시기 바랍니다.

이 글은 인간이 최선의 선택을 하였지만 과연 정말 더 나아진 것인가 라는 생각과 인생의 본질이 얼마나 잊혀져 가고 있는지를 알려주는 좋은 메세지입니다. 이에 9/11 이나 총기사건후에 많이 인용되어 사용되었고 좋은글인 만큼 인터넷에 혹시나 번역글이 있나 찾아보았지만 George Carlin 의 글을 제대로 전달하고 있는 번역이 없는듯 하여 제가 직접 해버렸습니다. 그냥 잠시 생각하는 시간이 되었으면 해서 나눕니다. 요즘 누군가를 “판단”하는데에 급급한 제 자신을 보며 “사랑”의 시각을 가져야 하겠다는 생각이 들고 있거든요…

문법이나 어색한 표현은 알려주시면 수정토록 하겠습니다.

A Message by George Carlin

우리가 살고 있는 이 시대의 패러독스이다.
빌딩들은 높아졌지만 참을성은 짧아졌고 길은 더 넓어졌으나 시야는 더욱 좁아졌다. 소비하는 것은 늘었으나 소유한것은 줄어들었으며 구입하는 것은 많아졌으나 즐기는 것은 줄어들었다. 집은 더욱 커졌지만 가정은 줄어들었고 더욱 편리해진 반면 시간은 더욱 짧아졌다.

우리는 학위는 높아졌지만 지성은 떨어졌으며 지식은 많아졌지만 판단력은 줄어들었고 전문가들이 늘어났지만 문제들도 늘어났으며 의학은 발달했지만 건강은 줄어들었다.

우리는 과하게 술을 마시며, 과도히 담배를 피우고, 과도하게 소비하지만 과소하게 웃는다. 너무 과속을 하며, 너무나 심하게 화를 내고, 너무 늦게 자며, 너무 피곤하며, 너무 적게 읽으며, 너무나도 TV를 많이 보지만 너무나도 적게 기도한다.

우리의 소유는 늘어났지만 우리의 가치는 떨어졌다. 말은 많이 하지만 사랑은 드물며 남을 쉽게 미워한다.

우리는 먹고 사는 법은 배웠지만 인생을 사는 법은 배우지 못했다. 인생의 명은 늘어났으나 삶의 가치가 늘어나지는 않았다. 달까지도 왕복하였으나 길건너의 이웃에게는 가지 못하고 있다. 우주를 정복해 가면서도 정작 우리 안의 우주, 내면은 정복하지 못하고 있다. 더 큰일을 해가고 있으나 더 나은일을 하고 있지는 않다.

우리는 공기는 정화했지만 영혼은 오염시켰다. 분자를 정복했다고 하지만 차별은 여전하다. 글 쓰는것은 늘어났지만 배우는 것은 줄어들었다. 계획하는 것은 늘어났으나 이루는 것은 줄어들었다. 서두르는 것은 배웠으나 기다리는 것은 배우지 못했다. 더 많은 정보를 저장한다고 더 많은 컴퓨터를 만들어 복제는 늘어가지만 정작 대화와 소통은 점점 줄어들고 있다.

이 시대는
페스트푸드와 느린 다이제스트,
큰 체격과 작은 인성,
높아진 이윤과 낮아진 관계의 시대이며

맞벌이 부부가 늘어났지만 이혼은 늘어났으며
집은 더 멋져가지만 가정은 깨지고 있는 날들이고

고속 여행과 일회용 기저귀, 버려진 도덕성, 하룻밤 관계, 비만된 육체와 흥분케 하기도 하고 진정케도 그리고 죽음까지 가능한 약들의 날들이며

쇼윈도우엔 넘쳐나지만 정작 제고는 없는 시간들이다.

또한 당신에게 이 글을 전달케 하는 테크놀로지가 가능한 그런 시간이며 이 글을 나눌수도 혹은 delete 키를 눌러버릴수 있는 그런 시간이다.

기억하기 바란다. 사랑하는 이들과 시간을 보내라. 그들이 영원히 당신의 주위에 있지 않을 것이기 때문이다.
당신을 위대하게 바라보는 이에게 선한말 하는 것을 잊지마라. 그 작은 존재가 자라나서 당신곁을 떠날 것이기 때문이다.
당신 옆에 있는 이에게 따뜻한 포옹을 전하는 것을 잊지마라. 당신이 유일하게 마음을 담아 줄수 있는 보물이지만 동전한푼 들지 않기 때문이다.
당신의 동반자와 사랑하는 이들에게 “사랑해”라고 말하는 것을 잊지말되 진실되게 하라. 마음속 깊은 곳에서 우러나오는 입맞춤과 포옹은 상처를 치유할것이다.
그곳에 다시는 오지 않을 그 사람과 손을 잡고 그 시간을 소중히 간직하라.
사랑하는 시간을 갖으며 대화하는 시간을 갖으라! 그리고 당신속에 소중히 간직하고 있는 생각들을 나누는 시간을 갖으라.

그리고 언제나 기억하라.
삶의 가치는 우리가 숨을 쉰 숫자가 아닌 숨을 멎게할 정도의 값진 순간들로 결정된다는 것을 말이다.

Dr. Bob Moorehead. 번역 by 일몰.

The Paradox of Our Age:

The paradox of our time in history is that we have taller buildings but shorter tempers, wider Freeways, but narrower viewpoints. We spend more, but have less, we buy more, but enjoy less. We have bigger houses and smaller families, more conveniences, but less time. We have more degrees but less sense, more knowledge, but less judgment, more experts, yet more problems, more medicine, but less wellness.

We drink too much, smoke too much, spend too recklessly, laugh too little, drive too fast, get too angry, stay up too late, get up too tired, read too little, watch TV too much, and pray too seldom.

We have multiplied our possessions, but reduced our values. We talk too much, love too seldom, and hate too often.

We’ve learned how to make a living, but not a life. We’ve added years to life not life to years. We’ve been all the way to the moon and back, but have trouble crossing the street to meet a new neighbor. We conquered outer space but not inner space. We’ve done larger things, but not better things.
We’ve cleaned up the air, but polluted the soul. We’ve conquered the atom, but not our prejudice. We write more, but learn less. We plan more, but accomplish less. We’ve learned to rush, but not to wait. We build more computers to hold more information, to produce more copies than ever, but we communicate less and less.

These are the times of fast foods and slow digestion, big men and small character, steep profits and shallow relationships. These are the days of two incomes but more divorce, fancier houses, but broken homes. These are days of quick trips, disposable diapers, throwaway morality, one night stands, overweight bodies, and pills that do everything from cheer, to quiet, to kill. It is a time when there is much in the showroom window and nothing in the stockroom. A time when technology can bring this letter to you, and a time when you can choose either to share this insight, or to just hit delete…

Remember; spend some time with your loved ones, because they are not going to be around forever.
Remember, say a kind word to someone who looks up to you in awe, because that little person soon will grow up and leave your side.
Remember, to give a warm hug to the one next to you, because that is the only treasure you can give with your heart and it doesn’t cost a cent.
Remember, to say, “I love you” to your partner and your loved ones, but most of all mean it. A kiss and an embrace will mend hurt when it comes from deep inside of you.
Remember to hold hands and cherish the moment for someday that person will not be there again.
Give time to love, give time to speak! And give time to share the precious thoughts in your mind.
AND ALWAYS REMEMBER:
Life is not measured by the number of breaths we take, but by the moments that take our breath away.

Dr. Bob Moorehead

이 시대의 패러독스..

바자회 준비를 도우면서 좋은것이 있다면 정리중 맘에 드는 것들이 있을때 먼저 살수 있다는것! 맘에드는 책들이 몇권 있길래 입양해왔습니다. Google Story, CODE, Mere Christianity, 그리고 Cliches. 다들 시간날때마다 읽을수 있는 평균사이즈의 책들이고 관심있어 하는 분야의 책들이라 빠르게 입양 절차없이 찜해버렸습니다.

특히 CODE는 상당한 호응을 받았었던데 2006년에 CODE 2.0 에디션이 나왔더라구요. 이번꺼 읽고 맘에들면 다음 버전을 사보려 합니다. Mere Christianity 는 C.S. Lewis 가 쓴 책이라 무작정 입양했고 가장 맘에 드는 Cliches (클리쉐s) 는 미국에서 사용되는 속뜻이 담겨져 있는 문구들을 설명하고 어디서 비롯되었나 설명해주는 아주 유용한 책입니다. 가끔 맘에 드는것들은 소개해볼수 있을꺼 같습니다.

P.S.
앞으로 결혼식들이 많습니다. 4월은 이번주 빼고 다 있고 5월도 그렇고 말이죠. 즐겁고 부담되는 행복한 결혼달들 입니다. 다들 행복하기만을!

P.P.S.
요즘 기름값이 무지하게 오르고 있습니다. 어디 나가기 무섭습니다. 후..

P.P.P.S.
이제 장자법 장차법이 시행됩니다.

올해도 돌아왔습니다. 2008년 4월 9일, 사이트의 스타일시트를 꺼놓는 CSS Naked Day가 돌아왔습니다. 작년 CSS Naked Day의 제목을 CSS 옷벗기기로 정해놓았더니 아니나 다를까 ‘옷벗기기’ 단어로 상당한 트래픽의 상승이 있었습니다. 해서 올해는 더 자극적인 제목을 정하려다… 참았습니다.

CSS Naked Day는 표준이 의도하고 있는 문서와 스타일의 분리를 선전하는 의미에서 시작된 “하룻동안 스타일을 꺼 놓는 날” 입니다. 문서와 스타일이 이렇게 분리될수도 있다는걸 보여주기도 하고 스타일 없이도 문서적인 의미로도 페이지가 작동할수 있다는것을 보여주게 됩니다. 물론 “전 테이블로 레이아웃이 짜여져 있지 않아요” 라고 외칠수도 있는 의미를 담고 있습니다.

그 뿐만이 아니라 스타일을 꺼 놓으므로서 배경 이미지가 로딩되는 요청과 트래픽이 줄면서 서버의 전기 소요가 줄게되고 전기를 절약함으로 지구 온난화를 방지하는데 도움을 준다는 의미심장한 Green 의 의미도 억지지만 적용할수 있습니다.;;; 그리고 말씀드린데로 특정 키워드를 통한 트래픽 상승효과도 본의 아니게 (혹은 의도대로) 얻을수 있습니다.

참여방법

단순히 이번 4월 9일에 스타일시트를 꺼놓으셔도 되지만 기왕이면 CSS Naked 사이트에서 하단에 폼을 적으시고 등록을 하신후 동참의 기분을 내시면 좋겠습니다. 한국에서 참여하는 분들을 위한 특정 사이트가 없으므로 참여하는 타 블로거들에게 서로서로 트랙백을 나누는 네트워크 방법을 사용하는 수 밖에 없겠습니다.

또한 그저 스타일만 없어지면 방문자들이 놀랄수도 있으니 상단에 왜 스타일이 입혀지지 않았는지 설명하는 문구를 삽입하거나 미리 블로그에 공지하셔서 사전에 혼란을 방지 하는 것도 좋습니다.

저 올해 확실히 벗습니다. 같이 _ _ 보아요.

덧: 현재 약 100명정도가 참여의사를 밝혔는데 (물론 꾸준히 엄청난 속도로 늘어나겠습니다만) 여섯분이 한국분들이십니다. 6%군요! 과연 마의 10%를 넘을수 있을까요

대체 텍스트의 ALT 는 이미지가 보여지지 않을시에 이미지를 대신하여 보여지는 문구 입니다. 툴팁의 목적으로 사용하는 것은 바른 방법이 아닙니다. Title은 필수 요소는 아니지만 base, basefont, head, html, meta, param, script, and title를 제외하고는 어느 곳에나 쓰여지며 삽입되는 부분에 대한 설명을 담당합니다. longdesc는 alt 가 길어지는 경우 제대로된 설명을 담은 외부문서 주소를 지정해 줍니다. 많은 브라우저들에서 지원되지 않는 longdesc 에 대한 토론은 CDK 에서 마음껏 나누실수 있습니다.

alt vs title

많은 경우 문제는 alt와 title 의 차이에 대한 선을 긋지 못함으로 비롯됩니다. 오래전에 북마크 해 두었던 alt와 title 에 대한 토론을 읽어 보셔도 아시겠지만 (결과가 나지 않아 아쉽더군요) 상당히 헛갈릴수 있는 어찌보면 자연스럽게도 보일수 있는 문제 입니다.

ALT 는 이미지가 출력이 인위적이든 아니든 출력이 되지 않았을 경우 이미지와 동일한 의미를 전달 하는 문서의 한 부분으로써 사용되는 것이며 title은 어떠한 이미지인지 설명을 담당 합니다. “동일한 의미”를 전하는 것과 “설명”의 차이는 무엇일까요. 말보다는 예가 빠르고 쉽겠습니다. 올해 여름 패션을 이야기하는 문서에 한 예로 흰 와이셔츠를 입은 남성의 사진을 첨부하는 상황에서 이렇게 이미지의 alt 와 title 이 구별될수 있습니다.

올해 패션은 깔끔하고 단조로운 스타일이 대세를 이룰것으로 보입니다. 더이상의 설명보다 이하의 사진을 보며 계속 나누겠습니다.
img src=”summerModel.jpg” title=”정면으로 찍은 남성 모델 사진” alt=”이 모델은 흰 와이셔츠와 진한 남색의 청바지를 입고 있습니다.”
흰 와이셔츠는 깔끔하면서도 시원한 느낌을 전달하며 청바지는 …

title은 이미지에 대한 설명을 하고 있고 alt는 이미지를 대체하는 즉 동일한 의미를 표현하고 있습니다. 하지만 아시다시피 대부분의 경우 img src=”summerModel.jpg” alt=”남성 모델 사진” 으로 끝이 나게됩니다. title과 alt가 뒤바뀐 것이죠.

위처럼 문서의 일부로써 사용되는 이미지가 있는가 하면 그다지 의미전달이 불필요한 이미지가 삽입된 경우도 있습니다. 예를들어 사파리 브라우저 이야기를 하기 위하여 사파리 로고를 문서위에 지정해 놓은 경우인데 이러한 꾸밈을 위한 이미지에 alt가 필수 요소이므로 “사파리 로고” 라는 문구를 넣기 보다는 alt=”" 처럼 대체 텍스트를 오히려 비워 놓는것이 맞습니다. 문서를 정보로써 이해 하는데에 불필요할 뿐더러 브라우저 이외의 유저 에이전트가 접근시에도 무의미하게 “사파리 로고” 라고 읽혀지며 낭비하기 때문입니다. 저도 아무 생각없이 지정하는 실수인데 같이 고쳐가면 좋겠습니다.

더욱 분명한 선을 긋기 위하여 Ian Hicks (acid2, acid3 저자) 의 상당히 오래된 글인 “Mini FAQ About the Alternate Text of Images”를 번역하여 첨부하였습니다. 한국에서 특정 태그나 속성들의 정의나 토론들을 참고 삼을때 또한 소개할때 국내에 번역되거나 직접 쓰여진 글들이 적으므로 영어 사이트를 링크하는 경우가 대부분 처럼 보입니다. 해서 앞으로 기회가 될 때마다 레퍼런스로 삼을수 있는 참고가 가능한 글들은 저자의 허락 아래 번역하려 합니다.

원문: MINI FAQ ABOUT THE ALTERNATE TEXT OF IMAGES

글을 읽기 전에 이하의 노트를 참고 하시면 글을 이해하는데 더욱 편하실꺼라 생각됩니다.

• 텍스트 = 문구, 글로 보시면 됩니다. 문구나 글 이라고 표현하지 않은 이유는 이미 한국 웹 개발자들 디자이너들 사이에 “대체 텍스트” 라고 알려져 있기에 굳이 글자 그대로 번역하지 않은 것입니다.
• 인라인 이라는 개념은 텍스트와 동일한 문단안에 글 처럼 삽입되는 것입니다. 같은 줄에 위치한다는 개념으로 in line 으로 이해하시면 됩니다. 반대는 그만의 영역을 같는 블락 이겠습니다.
• 제작자 - Author 를 제작자로 넣었습니다. 저자 가 더 나은 접근입니다만 한국말로 저자는 글을 쓰는 사람으로만 인식이 되어 있기 때문에 문맥상 혼돈 되는 부분이 있을듯 하여 굳이 제작자 라고 해석하였습니다. author 는 저자, html 을 쓴 사람, 문서를 제작 하는 사람 등등의 의미를 함축하고 있습니다.

이미지의 대체 텍스트 ALT 에 대한 FAQ

개요

Alt 속성은 대체 텍스트로 이미지가 보여지지 않을때 보여진다. 유저 에이전트는 이미지를 지원하지 않거나 특정 이미지 타입을 지원하지 않을때 혹은 이미지 출력을 꺼 놓았을때 이 대체 텍스트를 보여주어야 한다.

대체 텍스트는 단순히 “alternate” 대체 하는 것이다. 다른말로 하면 이미지의 의미를 문자로 표현하여 대체 하는 것이다. 이미지가 전달 하려는 것을 그대로 전달 하는 것이다.

제작자는 페이지의 형식을 위한 이미지들을 위해 무의미한 텍스트를 넣는 실수를 하면 안된다. 예를들어 붉은 공 모양의 이미지가 헤딩이나 문단을 꾸미기 위해 첨가 되었는데 alt=”빨간 공” 이라는 대체 텍스트는 올바르지 않은 사용이다. 이러한 상황이라면 그저 빈 텍스트가 어울린다 (alt=”"). 제작자들은 이전에 페이지 형식을 위한 이미지 사용을 피하기를 권한다. 스타일시트가 사용되어야 하겠다.

제작자들은 무의미한 대체 텍스트 삽입 또한 주의하기 바란다. (더미 텍스트 라고들 한다.) 유저들을 불편하게 할 뿐 아니라 글을 읽어주는 유저에이전트나 점자 에이전트를 느리게 할 뿐이다.

전형적인 주장들

만약 이미지가 빠졌다면 프레임(이미지 틀)이 제외되고 이미지와 똑같은 정보를 제공하는 인라인 텍스트로 대체 되야 한다고 생각한다. 그 텍스트가 바로 대체 텍스트로 alt 속성이 담고 있는 텍스트이다.

많은 사람들이 이미지가 보이지 않을때 이미지의 원래 틀(영역, 사이즈)은 유지되어야 한다고 주장한다. 이 글을 통하여 왜 그것이 불필요한지 설명할것이다.

주장 #1

“이미지의 생명은 영역이다”

이미지의 생명은 영역이 아니다. 오히려 그것의 의미이다. 이미지의 그래픽적인 표현의 요소는 (보통) 절대 필요한 것이 아니다. (예외를 예로 들자면 환영이나 착각을 목적으로 한 이미지가 있겠다. 그런 경우엔 이미지의 그래픽 요소가 절대 중요하겠다.(하지만 그 외에는 대부분 절대적이 아니다))

주장 #2

“내 생각엔 원초적으로 html 의 버그라고 본다. HTML 을 사용하여 제작하는 저자들에게 특정 이미지가 텍스트를 대체 하기 위해 사용한 것인지 아니면 텍스트의 부가물로 사용한 것인지를 구별 하라는 것은 말이 안된다.”

모든 이미지들은 글을 replace 대체(교체) 한 것이다. 아니 오히려 텍스트와 이미지 둘 다 “의미”를 대체 한 것이라고 볼수 있다. 다시 말하면 둘 중 한가지가 언제든지 다른 한가지를 대신하여 “의미” 전달의 도구로 사용될수 있다는 것이다. 하지만 가끔은 둘중 한가지가 다른 것 보다 특정 의미를 전달하는데에 더 나을 수 있다.

주장 #3

“삽화(다이아그램)로써 어떤 이미지들은 보는 것이 천마디 말보다 나은 이미지들이 있다. 예를들어 이러한 alt 를 담고 있는 이미지 이다. alt=”인디아나폴리스 학교의 Communicator 4.x 의 프록시 세팅을 보여주는 스크린샷” ”

일단 그것은 절대 올바른 대체 텍스트가 아니다. title 속성으로는 좋을지 모르나 대체 텍스트로는 부적절 하다. 적절한 대체 텍스트로는 이런식일 것이다.

alt=”Proxy 세팅 다이어로그 박스는 ‘proxy.i.edu’ 를 ‘host’ 필드에 담고 있고 모든 프로토콜에 3128 ‘port’ 를 담고 있다”

그리고 이하의 페이지에 이러한 부분이 첨가 되어있어야 할 것이다.

**위의 스크린샷은 인디에나폴리스 켐퍼스의 Commnicator 4.x 프록시 세팅을 담고 있다.**
이미지는 인디에나폴리스 켐퍼스의 Communicator 4.x 어플리케이션의 프록시 세팅을 묘사하고 있다. 다이어로그 박스는 HTTP, FTP, GOPHER, HTTPS 의 4열의 수정가능한 박스들을 담고 있다. 각 열은 host 와 port 가 맨 위에 위치한 두개의 수정 가능한 박스들을 담고 있다.

각 ‘host’ 필드는 ‘proxy.i.edu’ 를, 그리고 ‘port’ 필드는 3128 을 담고 있다.

이 페이지는 (설명이 기므로) <IMG> 태그에 “longdesc” 속성을 사용하여 연결되어 있어야 한다. 고로 이미지 태그는 이렇게 생겼을 것이다.

<IMG src=”screenshot1.png”
alt=”Proxy 세팅 다이어로그 박스는 ‘proxy.i.edu’ 를 ‘host’ 필드에 담고 있고 모든 프로토콜에 3128 ‘port’ 를 담고 있다”
title=”위의 스크린샷은 인디에나폴리스 켐퍼스의 Commnicator 4.x 프록시 세팅을 담고 있다.”
longdesc=”screenshot1.desc.html”
/>

대체 텍스트 alt 가 이미지를 대신하였고, title은 간단한 description(caption, 묘사) 를 하고 있으며 longdesc 는 이미지의 긴 설명을 담당하고 있다.

다시말하지만 alt 대체 텍스트는 이미지를 DESCRIPTION 묘사하는 것이 아니다. 오히려 이미지의 의미 MEANING 전달의 대체적 대변인이 되는 것이다.

다른 예:
<p>
<img src=”house.png” height=”110″ width=”320″
alt=”이 집은 초록색 창문이 있는 흰색 집이다.”
title=”서쪽에서 바라보는 집”
/>
이 집은 XXXXX 중간에 위치하고 있다.
</p>

이고 이하는 아니다.

<p>
<img src=”house.png” height=”110″ width=”320″
alt=”초록색 창문의 흰 집.”
title=”서쪽에서 바라보는 집”
/>
이 집은 XXXXX 중간에 위치하고 있다.
</p>

이것은 참 중요한 구별이며 웹이 아직도 WYSIWYG(보이는 그대로가 결과물인것) 이라고 생각하는 제작자들에게는 설명하기 어려운 부분이다.

올바른 첫번째 html 예제 부분을 보며 이미지가 꺼져있다면 어떻게 렌더링 되고 싶은지 상상해 보라. 아마도 이하와 같을 것이다.

이 집은 초록색 창문이 있는 흰색 집이다. 이 집은 xxxx 중간에 위치하고 있다.

그리고 이하와 같지는 않을것이다.

+——————————————-+
| 이 집은 초록색 창문이 있는 흰색 집이다. |
+——————————————-+ 이 집은 xxxx 중간에 위치하고 있다.

문단의 한 부분처럼 렌더된것은 “대체 텍스트 인라인 렌러딩” 이라고 하고 틀 안에 들어간 것은 “placeholder box 틀 안의 렌더링된 대체 텍스트” 라고 부른다.

주장 #4

“생각컨데 위의 이미지는 방향을 나타내고 있는데 유저의 이해를 위하여 각각(텍스트와 이미지)의 역할이 있으며 어느 한 부분도 때어 놓을수 없는거 같다.”

아니다. 이미지가 없다면 바른 인라인 대체 텍스트가 이미지의 title보다 그렇다 아니할지라도 빈 박스 보다 낫다. 그리고 빈 박스는 못생겼다.

주장 #5

“만약 이 예제에서 이미지가 읽히는데 실패하면서 사이즈가 지정된 이미지 대신 대체 텍스트가 출력되었다면 시멘틱 아이덴디티를 지키면서 유저들에게 페이지가 제대로 표현될만큼 로딩되지 않았다는 팁을 줄수 있다고 본다. 만약 대체 텍스트가 인라인으로 문단안에 위치하여 보이게 되면 (페이지가 제대로 로딩된 것인지 아닌지) 유저들에게 혼란을 줄수 있는거 같다.”

유저들은 제작자가 실수를 한것인지 아닌지에 관심을 두는 것이 아니다. 유저들은 정보를 원한다. 이미지가 제공되지 않았다면 페이지가 상황에 맞추어 적응해야 한다. 그리고 그것이 바로 대체텍스트 alt 가 하는 일이다.

주장 #6

“spacer GIF (레이아웃을 위해 사용되는 텅빈 gif) 를 사용하는 페이지가 있다. 하지만 웹마스터의 에러로 인해 존재하지 않는 파일이름으로 지정되어 이미지가 출력되지 않고 파일이름이 출력되며 그것이 레이아웃을 깨고 있다.”

그럼 제대로된 spacer GIF 파일이름으로 바꾸면 되지 않는가. 페이지에 문제가 있다면 당연히 수정되어야 한다. 그리고 레이아웃을 위한 것들은 CSS 가 사용되어야 하겠다.

주장 #7

“하지만 왜 파일명이 출력되는가? “alt” 텍스트가 없다면 파일이름이 아니라 아무것도 출력하지 않아야 하는거 아닌가?”

HTML 스펙 에 따르면 파일 이름을 써야 한다.

주장 #8

“대체 텍스트를 넣었다고 가정하고 (title이나 name 혹은 파일이름이 없다면) 사이즈가 정해진 박스안에 대체 텍스트를 보여준다면 1)언제나 대체텍스트는 보여지고 (텍스트가 다 보여지도록 툴팁을 더하고) 2)특정 상황을 염려하지 않아도 되고 3)페이지 레이아웃을 깨지 않아도 된다.”

이건 기초를 놓친 것이다. HTML 은 “페이지 레이아웃”을 위한것이 아니다. 만약 제작자가 원하는대로 표현되지 않았다면 어쩔수 없다. 그게 표현된것이다. 예를들어 폰트가 바꼈다거나 유저 스타일시트가 적용됬다거나 제작자의 색상들이 disable 되었다거나 브라우저가 그래픽을 지원하지 않는 경우, 페이지가 방화벽을 지나가며 필터되었거나 혹은 기타 다른 가능성들이 있다는 것이다.

만약 꾸밈을 위한 그래픽 요소라면 무시해 버릴수 있다 (alt=”" 를 해버려야 하는 상황이다) 하지만 decorative 꾸밈을 위한 이미지를 올바른 방향으로 이끌어 줘야하겠다. 만약 꾸밈을 위한 이미지가 아니고 정보적인 요소를 담고 있다면 텍스트와 동일한 폼의 대체 텍스트를 담고 있어야 하며 그것이 우리가 보여주어야 하는 것이다. (혹은 종합적 버전인 filename 이나 title).

위에서 언급했지만 페이지의 중요 요소는 레이아웃이 아니라 컨텐츠다. 만약 이미지를 disable 했는데 페이지가 레이아웃을 위한 이미지들에 의지하고 있었다면 어쩔수 없다. 괜찮다. 레이아웃보다 나머지 텍스트에 집중하면 된다.

주장 #9

“ALT 는 접근성의 이슈이다. 목표는 중요 포멧(여기서는 이미지)이 보이지 않는 컨텐츠에도 접근토록 하는 것이다.”

꼭 그렇지 만은 않다. 목표는 “의도한” 컨텐츠에도 접근토록 하는 것이다.

주장 #10

“대체 텍스트가 이미지의 의미적 대체 방법이라는 강조는 인터페이스의 툴로써 상당수 사용되는 이미지들을 빼놓고 있다. (anchor link 나 이미지맵)”

그러한 사용들을 배재하려는 것이 아니다. 버튼에 “Submit”(확인)이라고 적힌 이미지가 갖는 “의미”가 무엇이라고 생각하는가? 의미는 확인(제출) 이다. 고로 대체 텍스트는 Submit 인 것이다. 반복되는 “submit” 임을 감안하고 보통 쓰이는 이미지처럼 alt를 갖는 것이다.
(일몰: 이에대해서는 약간 애매한 주장이 나올수 있습니다. 한국에서는 제출이라는 단어를 포함한 버튼이 없죠. 보통 ‘확인’ 이라는 단어를 쓰니 의미적인 반대 의견을 낼수 있지만 아무튼 나중에 다루기로 합니다.)

주장 #11

“나는 꾸밈 이미지의 대체 텍스트가 “컨텐츠 안의 이미지 목적을 위한 기능적 텍스트모드 대체” 라는 기본원칙을 표현한다는 쪽으로 기울고 있다.”
(주석: 대체 텍스트는 단순히 텍스트 모드를 위한 기능적 대체 방법 이지 않는가 라는 의문)

동의하지 않는다. 꾸미는 이미지의 목적으로써 기능적 텍스트 모드 대체는 ASCII 의 부속물이겠지만 그것은 alt 텍스트라고 하기엔 부적절하다. 대체 텍스트는 텍스트 미디어 뿐만이 아니라 Speech 말하는 미디어 에도 사용된다. 그러므로 여기서 텍스트 대체 방법은 텍스트 모드의 대체 방법이 아닌 것이다.

결론

이미지를 갖고 있는 페이지를 Lynx 가 어찌 하는지 본적이 있는가? 제작자가 제대로 대체 텍스트를 사용하였다면 유저들은 Lynx 라 하더래도 모든 정보를 얻는다. 물론 이미지가 보일때 보다 약간 효율이 떨어질수도 있다. 하지만 유저들에게 “아 죄송합니다. 이미지를 보셔야만 저의 정보가 제값을 합니다.” 라고 아무도 말해주지 않았다.