저희 팀은 해외 엄선된 워드프레스 및 웹디자인과 관련된 원서를 번역해 출판하고 있습니다. 웹액츄얼리 북스팀과 함께 국내에 웹디자인 관련 멋진 책을 낼 최고의 출판편집 인재를 찾습니다.

[출판 분야]

[업무 내용]

[우대 사항]

[모집 기간]

2012년 4월16일(월) ~ 5월 29일(화)까지

[고용 형태]

회사와 본인간 3개월 탐사기간 후 정직원 채용 결정

[근무 여건]

[급여]

면접 후 상세결정

[제출 서류]

[전형 방법]

[채용 문의]

E-mail: books@webactually.com
TEL: 82 2 542 0411, 0414

웹액츄얼리코리아(주)는 오프라인 서적 출판뿐만 아니라 글로벌 웹디자인 트렌드에 맞춰 최신 정보도 올리며 워드프레스(WordPress)를 이용, 개인과 기업을 위한 블로그형 웹사이트(브랜드페이지®) 제작도 함께 하고 있습니다.

2010년 발행한 첫 번째 책 ‘스매싱북‘(스매싱매거진 저)을 통해 국내 웹디자인 업계에 살짝 관심을 받았습니다. 국내에는 아직 잘 알려져 있지 않지만 ‘스매싱매거진‘은 글로벌 웹디자인계에서 알차고 유익한 정보를 올리는 인터넷 잡지로 명성을 얻고 있는 곳입니다.

2011년 5월 웹액츄얼리 북스팀이 출간한 두번째 책 ‘웹디자이너를 위한 HTML5‘(제레미 키스 저)가 있습니다. 이 책은 ‘어 북 어파트(A Book Apart)‘ 출판사에서 발행한 시리즈 중 첫번째 책입니다. 어북어파트의 발행인은 글로벌 웹디자인 발전에 많은 기여를 해온 제프리 젤드만씨입니다. 젤드만씨는 W3C의 창립 발기인이기도 합니다.

2011년 12월에 세번째로 출간한 ‘워드프레스 제대로 파기‘(크리스 코이어, 제프 스타 공저)는 국내에서는 최초로 나온 워드프레스 관련 책이기도 합니다. 전세계 뜨거운 인기에 비해 국내에서는 아직 이렇다할 정보가 없던 때에 나온 책이라 워드프레스를 궁금해하던 많은 웹종사자에게서 관심을 받았습니다.

웹액츄얼리 북스팀은 앞으로도 스매싱매거진 및 어북어파트를 비롯한 여러 회사와의 파트너십을 통해 좋은 책들을 엄선해 출판할 계획입니다.

2012 봄/여름 시즌에 웹액츄얼리에서 나올 책은 다음과 같습니다.

[웹액츄얼리 북스팀]

안녕하세요?? 이 글을 보고 계신 웹개발자 여러분!!

웹액츄얼리팀은 워드프레스(WordPress)를 이용해 개인과 기업에게
‘브랜드페이지‘라는 이름으로 웹사이트를 제작해드리고 있습니다.

혹시 워드프레스에 대해 들어보셨나요?
(아신다면 계속 읽어주시고 모르신다면 ‘여기‘를 클릭!)

웹액츄얼리팀에서 워드프레스 개발자(WordPress Developer)를 찾습니다.
워드프레스를 사랑하고 웹디자인에 뜨거운 열정이 있는 개발자를 희망합니다.

[업무 내용]

[우대 사항]

[모집 기간]

2012년 4월16일(월) ~ 27일(금)까지

[고용 형태]

회사와 본인간 3개월 탐사기간 후, 정직원 채용 결정

[근무 여건]

[급여]

면접 후 상세결정

[제출 서류]

[전형 방법]

[채용 문의]

E-mail: books@webactually.com
TEL: 82 2 542 0411, 0414

몇일 전 해피 코그(Happy Cog) 웹사이트에 올라온 블로그 하나를 번역해 올립니다.
크리스 캐시달러(Chris Cashdollar)가 쓴 ‘브랜드 에이전시 여러분께, (Dear Branding Agencies,)’ 라는 글입니다. 이 내용이 열심히 공부하고 있는 웹액츄얼리팀에게는 시기상조일 수도 있지만, 읽어보면 전세계 웹디자인계의 환경과 상황이 얼마나 비슷한지를 알 수 있습니다. 해피 코그의 허락을 받고 번역해서 올립니다.
- Thank you! Jeffrey and Happy Cog team!
[편집자주]

브랜드 에이전시 여러분께,

여러분께서는 ‘큰 그림’을 구축하셨습니다. 고객들은 여러분이 세운 새로운 브랜딩 방향을 마음에 들어합니다. 여러분이 보여준 미래에 대해 감을 잡았을 수도 있습니다. 이제 광고주를 위해서 본격적으로 일을 준비한 여러분께서는 실제로 신상 브랜드에 생명을 불어넣는 데 사용되는 수많은 다양한 프로젝트를 가지고 계실 겁니다.

온갖 모양과 크기의 아이덴티티가 살아있는 패키지와 브로셔, 연간보고서, 전단광고, 래핑버스(대형버스 외관을 이미지로 래핑한 광고 매체, 편집자 주), 그리고 길거리 광고판… 아 그렇죠. 웹사이트도 있네요.

브랜드 에이전시 여러분! 이제 저희와 첫인사를 나눠볼까요?

안녕하세요. 만나서 정말 반갑습니다! 우리는 웹디자인 에이전시입니다. 고객들은 브랜딩 방향을 웹으로 잡기 위해 우리를 고용합니다. 우리와 여러분은 우리의 고객을 가운데쯤에 두고서 일을 하고 있다고 말할 수 있겠네요. 그렇습니다. 우리는 제안 요청서에 있는 웹사이트라는 부분 만큼은 여러분이 전문가가 아니라는 것을 알고 있습니다. 그렇다고 해서 우리와 여러분이 고객을 염두에 두고 서로 협력할 수 없다는 뜻이 아닙니다. 우리는 여러분이 우리가 여기 있는 이유를 알아 주었으면 합니다. 그리고 우리가 진짜로 잘 할 수 있는 것이 뭔지도 궁금해하시길 바랍니다. 잘 모르시겠다고요? 계속 읽어보세요.

단순히 새로운 웹사이트를 런칭하는 것을 넘어서 우리 고객이 성공할 수 있도록 하는 방법에는 어떤 것이 있을까요?

온라인에서의 경험이 로고와 사진으로만 이루어지는 것은 아닙니다. 온라인 경험이란 한 조직에 대해 살아 숨쉬듯 생생하게 내보이는 표현입니다. 사이트를 유지하는 것은 실제 사람들입니다. 웹에서의 브랜드 경험이 생생하고 적절하게 작동하도록 하는 것도 실제 사람들입니다. 여러 작가가 함께 새로운 콘텐츠에 생기를 불어넣는 일도 합니다.

사내 그래픽 디자이너들은 마케팅 팀과 손잡고 사이트 상에서의 새로운 제안과 거래, 홍보활동을 적시에 처리합니다. 이동이 이루어지는 파트도 많습니다. 그리고 각각의 파트는 내부의 승인 절차가 있어야 합니다. 우리는 이것을 잘 알기에 이를 위해 계획을 세웁니다. 우리는 고객의 말을 경청하고 그들의 내부 절차를 숙지하여 고객을 파악합니다. 그들이 계속해서 유지할 수 있는 사이트를 만들기 위해서죠.

새 웹사이트의 유지 보수를 위한 우리의 조언은 우리 고객이 유지 보수를 위해 접근할 수 있는 자원에 부합해야 합니다. 런칭 이후에 고객이 사이트를 유지 보수할 수 없다면 그 컨셉은 시작부터 잘못된 것입니다.

고객의 사진 예산이 빠듯한가요? 혹은 전문 사진작가 인적 자원이 부족한가요?

항상 최고 수준의 사진을 쓸 수 있으려면 현금이 궤짝으로 필요할 겁니다. 모든 조직이 이런 궤짝을 보유하고 있지는 않습니다. 필요한 일이 생기면 우리는 마이크로스톡(microstock)에서 어떻게든 구하기 위해 설득력 있는 방법을 모색합니다. 혹은 사진에 의존하는 디자인을 완전히 배제할 수 있는 방법을 모색합니다. 고객사 내의 포토샵 기술을 쓰는 건 어떨까요? 일년이 지나고 주요 마케팅 메시지가 바뀌고 동시에 많은 새로운 상황이 벌어졌을 때, 우리 디자이너가 런칭 당시 선택한 나름 완벽한 이미지가 없더라도 사이트가 여전히 건재할 수 있을까요? 사이트의 그래픽 디자인을 추진하는 ‘시스템’을 적절하게 계획해서 갖춰놓으면 내부 팀의 스트레스를 부분적으로라도 덜 수 있어야 할 것입니다.

우리 고객에게 디자인 의도에 대해 교육할 기회를 찾는 것은 실제 교육을 집행하는 것만큼이나 중요합니다. 필요하다면 우리는 포토샵 자료 원본이나 사진 사용에 관한 가이드라인을 제공합니다. 프로젝트에 대한 우리의 관여가 끝난 한참 뒤에도 고객이 더욱 현명한 선택을 할 수 있도록 돕기 위해서죠.

온라인에서 사용할 서체를 고르는 일은 어떻습니까?

최근 들어 웹폰트 사용이 폭발적으로 증가했지만 질적인 면에서는 여전히 간극이 있습니다. 해당 폰트를 웹에서 쓸 수 있다고 해서 충분히 준비되었다거나 테스트를 거쳤음을 의미하는 것은 아닙니다.

무슨 말이냐고요? 웹파트너와 최근에 수행한 한 프로젝트에서 우리는 고객사에게 주의할 것을 당부 드린 적이 있습니다. 담당 브랜딩 업체가 서체 선정 과정을 다시 논의해야 한다고 조언한 것이죠. 프린트와 아이덴티티 작업을 생각했을 때는 이 특정 서체에는 전혀 문제가 없었습니다. 그런데 해당 서체에는 폰트 글꼴(@font-face) 라이센싱 협약이 따라오더라는 것입니다. 실제로 해당 폰트를 적용하게 되면 이 글꼴이 사실 출시될 단계가 아니라는 것이 명백하게 드러납니다. 브라우저로 옮겼을 때 엑스하이트(x-height)는 훨씬 작아서 철자를 알아차리기가 힘듭니다.

윈도우는 또 어떻고요. 인터넷 익스플로러(IE)에서 해당 폰트는 정말이지 터무니없이 못생겼거든요. 팁을 드립니다: ‘폰트 힌팅(font hinting)’이 뭔지 아직 모르신다면 자주 찾는 폰트회사로부터 좀 더 정보를 받으시길 바랍니다. 그리고 그 사람들은 웹을 위한 글꼴을 어떻게 준비하고 있는지 물어보세요. 적어도 서체 구매 전에 여러 번의 테스트를 거치셔야 합니다. 저희는 여러분께서 서체 선정을 면밀히 검토하실 때 기꺼이 도와드리겠습니다.

제대로 굴러가는 것이 아름다운 것입니다.

‘규칙을 깨기 위해서는 먼저 규칙을 잘 알아야 한다.’는 말은 아주 적절히 표현된 그래픽 디자인계의 격언입니다. 우리는 이것이 브랜드에도 적용된다고 생각합니다.

2010년 우리가 미국 홀로코스트 기념 박물관(United States Holocaust Memorial Museum; USHMM) 사이트의 디자인 개편작업에 참여했을 때의 경험을 통해 직접 배운 것입니다.

사이트의 그래픽 디자인을 시작함에 앞서 브랜드의 수석 디자이너인 펜타그램(Pentagram)의 폴라 셔(Paula Scher)씨는 USHMM과 해피 코그(Happy Cog) 디자이너들을 위한 워크샵을 열었습니다. 일을 제대로 해내겠다는 열망으로 가득 찬 우리는 브랜드를 어떻게 하면 최고로 ‘웹화(web-ize)’ 할 수 있을지 배우기를 갈망하고 있었습니다.

폴라 셔의 대답은 놀라웠습니다. 의도는 존중하지만 독단적인 자신만의 견해는 고집하지 말라는 것이었죠. 펜타그램의 가이드라인을 절대 지켜야만 한다고 말하는 대신 그녀는 우리에게 진화하는 브랜드의 요구따라 적합한 결정을 내리라고 말하는 것이었습니다. 우리 디자이너들 (그러니까 매일매일 브랜드와 함께 살아가야만 하는 사람들)이 진짜 전문가라는 의미입니다. 소유권은 그것을 처음 만든 사람에게만 속한 것이 아닙니다. ‘브랜드를 죽이느냐 살리느냐’는 브랜드에 있어 실제적인 경험이 가장 많은 우리 디자이너들에 의해 결정됩니다. 그들이 최고의 결정을 내릴 수 있도록 자율권을 주어야 합니다.

최고의 영원한 친구

솔직히 말씀 드리겠습니다. 우리는 우리가 이바지할 수 있는 많은 기회가 있다고 생각하고 있습니다. 우리는 여러분의 작업을 혼란스럽게 하려고 있는 것이 아닙니다. 우리는 브랜드 진화에 있어 ‘어떻게’와 ‘왜’라는 측면에 대해 배우고 싶습니다.

우리와 공유해주세요. 우리에게 여러분이 연구하고 학습한 식견을 전해 주세요. 우리를 동등한 지위의 파트너로 대해 주세요. 우리도 여러분을 똑같이 존중해 드릴 것입니다. 신뢰라는 것이 얻기는 힘들지만 잃기는 쉽습니다. 그러니 우리 서로 알아가도록 합시다.

결론적으로, 우리의 가치관에 대해 다음과 같이 말할 수 있습니다. 우리는 고객의 브랜드에 생명을 불어넣어 웹에 적절하게 만드는 일을 합니다. 그러니 불안해하지 마세요. 좋은 인연이 시작될 것입니다.

그럼 이만.
(Hugs and Pixels)

크리스 캐시달러Chris Cashdollar
@ccashdollar
크리에이티브 디렉터 @happycog

번역 : 임재원
이 글을 읽고 공감이 가시면 ‘그냥 퍼나르지 마시고’ 위에 있는 트위터나 페이스북 ‘좋아요’ 버튼을 한번 클릭해주세요. 저희가 번역자에게 정식으로 부탁한 글입니다.

※ 내용중에 오번역, 오탈자를 발견하신 경우에는 알려주세요.

※ 웹액츄얼리 북스팀에서 웹디자인 관련 영문번역이나 윤문을 해주실 분을 찾습니다. 관심있으신 분은 메일 보내주세요. books@webactually.com

[편집자주]

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

디자인 – “사람들이 원하는 것은 자기 애완견 사진을 메일로 보내고 싶을 뿐이다.”

개발자를 위한 디자인 입문서

디자인은 한 회사의 운명을 완전히 바꿔 놓을 수도 있지만, 그것이 무엇인지 보편적으로 수용할 수 있는 정의는 아직 없다. 이 말이 무슨 뜻이냐 하면, 당신의 상사가 팀원들을 모두 모아 놓고 “앞으로 우리 회사는 디자인 중심의 문화를 지향하게 될 것입니다”라고 하는 말이 공언에 불과하게 될 수 있다는 뜻이다.

하지만 당신은 그 말에 귀를 기울이고 있다. 단지 듣기만 하는 것이 아니라, 그 말 이면에 있는 절실함마저 느끼고 있다. 들어보니까 무엇인가를 디자인하기 위한 선택은 매우 중요한 일인 것 같고, 그 이야기를 하는 사람도 중요한 인물이고 해서, 당신은 심하게 고개를 끄덕이고 있다. 하지만 마음 속으로는 “나는 당신이 무슨 소리를 지껄이는지 전혀 모르겠는데 아마 당신도 마찬가지일 거야”라고 생각할 것이다.

디자인에 초점을 맞추는 것이 마법처럼 한 회사를 변화시킬 수 있다는 데는 이론의 여지가 없다. 이를 위해 디자인 팀과 개발 팀이 회식이라도 자주 해야겠지만, 디자이너와 개발자 사이에는 근본적인 긴장이 존재하므로 이 긴장을 이해하는 것이야말로 디자인을 생각하는 좋은 출발점이 될 것이다.

디자이너와 개발자 – 긴장관계

디자이너와 개발자의 뿌리 깊은 긴장 관계를 제대로 이해하기 위해서는 소프트웨어가 시장의 주류가 된 시점으로 거슬러 올라가야 한다. 개인적인 생각이지만 그것은 아마도 인터넷이 막 등장했을 무렵일 것이다. 사실 소프트웨어는 넷스케이프(Netscape)가 등장하기 오래 전부터 엄청난 부가가치를 창출하고 있었다. 하지만 누구든 어디든 자기 애완견 사진을 메일로 보낼 수 있게 된 바로 그 순간, 진정한 의미의 소프트웨어 세상이 되었다고 말할 수 있다.

‘누구나’(그들의 애완견도 포함하여)의 시대가 도래하자 초기 소프트웨어 개발팀에게 과제가 주어졌다. 그전까지 그들은 누구나가 아닌 얼리어답터와 함께 얼리어답터 특유의 요구에 맞추어 작업했었다. 얼리어답터들은 다음과 같은 생각으로 수많은 크랩(crap, 엉터리)을 기꺼이 참아 주었다. “얼리어답터는 최신 제품, 최고 제품을 제일 먼저 다룰 수 있지만 그 제품은 한순간에 익스플로전(explosion, 프로그램의 작동이 멈추는 것; 편집자 주)될 수도 있다.” 작동하던 프로그램이 순간 멈춰도 얼리어답터들은 괜찮다고 생각한다. 왜냐하면 그들은 얼리어답터가 된다는 것 자체를 멋있다고 생각하기 때문이다.

하지만 ‘누구나’의 시대가 도래했을 때, 그 모든 ‘누구나’는 익스플로전을 원치 않았다. 소비자들은 제품이 정상적으로 작동되기를 원했다. 여기에서 “정상적으로 작동한다”라는 말을 개발자들은 “(프로그램이) 덜 멈추기를 바란다”라는 말로 들었는지 모르지만, 이것은 ‘누구나’가 원하는 바는 아니다. 소비자들이 원하는 것은 가능한 한 가장 간단한 방법으로 자기 애완견 사진을 보내는 것이다. 그들은 자바스크립트, 보안, 프레임, 플러그인 같은 것은 신경도 쓰지 않는다. 단지 그놈의 ‘강아지’ 사진을 보낼 때 어플리케이션(application, 응용 프로그램)이 멈추지 않기를 바랄 뿐이다.

“덜 익스플로전 되기를 바란다”는 개발자들의 생각과 “클릭 한 번으로 정확하게 애완견 사진을 보내고 싶다”는 사용자들의 생각 사이에서 디자인은 실질적인 연결다리 역할을 한다. 그런 점에서 좋은 디자인은 개발자들의 노력을 선보이는 동시에 그것을 사용자들에게 보이지 않게 숨기는 것과 같다.

여러 디자이너들과 함께 작업하는 동안 디자인의 역할에 대해 생각해 보았다.
내 개인적인 생각은 다음과 같다.

대부분의 사용자들이 무엇을 원하는지 이해한다.
그 중에 가장 중요한 것에 우선순위를 두고 집중한다.
이러한 지식을 이용해 사용자의 기대를 뛰어넘는다.

90년대 중반 무렵의 전통적인 개발자들은 이러한 역할을 제대로 하지 못했다. 우리는 비트의 설계자가 되도록 훈련받았으며, 우리가 비트를 설계할 수 있다는 것은 곧 쓸모 있는 비트를 만들 수 있다고 믿었다. 하지만 우리가 잘하는 것은 우리 자신에게 좋은 제품을 설계하는 것뿐이다. 그것은 결코 모든 이들을 위한 것이 아니다.

개발자들은 마치 스스로 프로그램 개발 과정을 잘 알고 있기 때문에 그것의 문제점을 중요하게 생각하지 않는 것처럼, 어플리케이션이 순간 멈추는 것을 아무렇지 않게 생각한다. 어떤 프로그램에 오류가 나면 그냥 어플리케이션을 다시 시작하면 된다고 생각하는 것이다. 그러나 대부분의 사용자들은 오류가 난 어플리케이션을 그런 식으로 보지 않는다. 그들은 뭔가 오류가 나면 깜짝 놀란다. 그리고 이렇게 생각한다. “혹시 심각한 고장이 난 것은 아닐까”

디자이너와 개발자를 위한 메모

수없이 많은 디자이너 무리에게는 미안한 말이지만 이 입문서는 주로 소프트웨어 개발자 주변에 사는 디자이너와 그들의 관행에 초점을 맞추고 있다. 이 책은 개발자들을 위해 개발자가 쓴 책이다. 나는 오랜 세월 동안 디자인계에 몸담고 있었지만 전문 디자이너로 훈련된 사람이 아니며 디자인의 역사와 기능에 대한 설명 또한 단순하고 부정확하며 불완전하게 하는데다가 개발자로서 편견까지 가지고 있어 디자이너들이 이 글을 보면 화가 날 수도 있을 것이다.

우리 개발자들이 하는 말의 의도가 아무리 좋더라도 디자인의 필수 항목을 제대로 경험한 적이 없기 때문에 그것에 대해서는 무지하다. 또 어떻게든 설명할 수 있는 일이라면 그 일을 할 수도 있을 것이라고 믿는데, 그것이 얼마나 어리석은 생각인지도 잘 알고 있다. 하지만 어떤 분야에서든 열의를 갖고 일을 하는 전문가들은 이렇게 늘 생각하는 것 같다.

개발자들은 무지를 불편해 하지만 그보다 더 심각한 문제는 우리 전문 영역 밖에 있는 이들에게 도움을 요청하는 일에 익숙하지 않다는 것이다. 이 입문서는 우리 디자이너와 개발자 사이에 단단한 다리를 놓는 첫 번째 단계가 될 것이다. 그러므로 기분 나쁘게 생각하지 말자. 이 입문서는 가장 권위 있는 디자인 가이드가 아니라 개발자들이 디자인에 대해 생각해 볼 수 있는 전환점이 될 것이다. 우리가 생각하는 바에 대해 독자가 어쩌다 무엇이라도 배우게 된다면 더욱 다행스러운 일이라고 생각한다.

다음의 세가지 축약어(Acronyms)가 문제점의 발단

“우리에게는 디자이너가 필요하다”라는 말은 아마 당신이 신입 소프트웨어 개발자로서 디자인에 대해 처음 들어본 말일 것이다. 그때 당신은 의아해 했을 것이다. ”음, 나는 아직 일을 시작하지도 않았는데 왜 그들이 필요하다는 걸까” 그에 대한 대답은 결코 간단하지 않고 이 글의 범위 밖에 있지만 다음의 세 가지 주요 축약어부터 설명하고자 한다.

다른 직업과 마찬가지로 디자인도 온갖 줄여서 쓴 단어들로 가득하다. 하지만 여기서는 당신의 상사가 디자인이 중요하다고 강조한 바로 그 시점에 자주 언급되었을 만한 세 가지 축약어에 집중할 것이다.

#1 GD(Graphic Design, 그래픽 디자인)

그래픽 디자이너들은 세상을 이렇게 본다.
(그래픽 디자이너들은 아래 그림처럼 ‘픽셀’ 단위로 바라본다는 의미임 : 편집자주)

안타깝게도 그래픽 디자이너를 설명하는 데 가장 흔히 쓰이는 말은 혼란스럽게도 바로 ‘디자이너’이다. 그 이유는 두 가지다. 첫째, 그는 개발 부문 외에 있는 기술을 가지고 이 제품을 완성하도록 고용된 최초의 인력이다. 둘째, 그는 ‘아름다움’을 책임지고 있다. 작업 책임자가 제품의 최초 프로토타입을 보고 이렇게 말할 것이다. “이건 개발자가 대충 만들어 놓은 것 같은데…” (당신은 고개를 끄덕인다) 그리고 “이걸 고쳐 놓을 디자이너가 필요해!” (당신의 눈길은 공허해진다)

당신: 뭘 고쳐요?
책임자: 글쎄… 뭐랄까… 좀 더 아름다워야 하지 않을까.

아직도 이 블로그에서 빠져나가지 않은 디자이너가 있다면, 아마 지금 의자 위에 올라가 스크린 앞에서 소리를 지르고 있을 것이다: “난 그런 사람 알아!”

그렇다, 나도 그런 사람을 알고 있다. 그는 좋은 의도를 가지고 있겠지만 멍청이다.

그래픽 디자이너의 장기는 시각적인 것에 있다. 포토샵이나 일러스트레이터 같은 어플리케이션을 통해 그래픽 디자이너는 추상적인 생각에 시각적인 형태를 부여한다. 그렇다. 그들이 하는 작업은 아름답다. 하지만 단지 아름답기만 한 것은 아니다. 그것은 말을 한다. 무엇인가에 대한 의견을 가지고 있어서 그것을 보는 사람이라면 누구라도 그 의견을 알 수 있다. 그렇다. 디자이너는 당신의 어플리케이션이나 웹 사이트에 어떤 명확하고 믿을 만한 전문성을 부여한다. 그렇지만 어떤 것을 잘 그려 놓았다고 해서 꼭 그 제품을 더 사용하기 쉽게 만들어 주는 것은 아니다.

문제는 작업 책임자가 그래픽 디자이너의 사무실로 들어가서 이렇게 말할 때 시작된다. “당신은 디자이너잖아. 이 제품에서 개발자 냄새를 지우게 도와줄 수 있나?” 이제, 당신처럼 이 그래픽 디자이너도 뭔가 더 하고 싶어한다. 더 많은 책임을 지려고 한다. 그리하여 그 제품이 어떻게 작동하는지, 사용자가 누구인지도 모르면서 그들은 이렇게 생각하며 그 일을 하겠다고 나선다. ‘그럼, 난 디자이너잖아. 그렇지?’

그렇게 해서 디자이너들이 작업을 맡게 된다. 그들은 포토샵으로 눈에 보기 좋은 프로토타입을 만든다. 이 그래픽 디자이너는 대부분의 개발자들이 할 수 없는 일을 했고 중요한 디자인 작업을 진행했지만 엄청나게 새로운 디자인을 한 것은 아니다. 당신의 제품은 단순히 아름다운 얼굴을 가지게 되었을 뿐이다. 제품이 어떻게 보이느냐가 중요한 만큼 어떻게 작동하는가도 똑같이 중요하니까 말이다.

이 입문서의 각 파트 끝에는 내 디자인 철학을 형성하는 데 도움을 준 디자인 관련 서적을 세 권씩 소개할 것이다. 디자인의 본질에 대해 궁금하면 참고 문헌을 보길 바란다.

#2-IxD(Interaction design, 인터렉션 디자인)

IxD는 세상을 이렇게 본다.

인터렉션 디자이너는 놀라운 일을 한다. 그들은 형태로부터 기능을 추출한다. 가장 좋아하는 어플리케이션을 정기적으로 둘러볼 때 당신이 어떻게 하는지 생각해 보라. 당신은 익숙한 경로를 따라갈 것이다. 우리는 그것을 작업 흐름(workflow)이라고 부른다. 작업 흐름은 일련의 마우스 클릭과 드래그로 구성되며 당신의 전광석화 같은 키보드 움직임을 동반한다. 이것이 당신과 어플리케이션의 접점이다.

인터렉션 디자이너의 장기는 작업 흐름을 돌보고 작업을 진행시키는 것에 있다. 인터렉션 디자이너는 와이어프레임과 작업 흐름을 능숙하게 이용하여 사용자가 그 어플리케이션을 통달할 수 있게 되는 과정을 단계별로 정의하고 세분한다.

위 그림처럼 기능을 단축해서 설명하면 설명의 의도를 이해하지 못하는 이들에게는 혼란스러울 것이다. 이것이 어플리케이션이 어떻게 보일까에 대한 것일까? 그렇지 않다. 이것은 인터렉션에 대한 것이다. 이것은 그 어플리케이션이 어떻게 보이는가가 아닌 어떻게 작업하는가를 설명하고자 하는 사용자 인터페이스를 대략적으로 나타낸 것이다. 그렇다면 어플리케이션이 어떻게 보일까? 저 텍스트에 그림자 효과를 줄 수 있을까? 나는 그림자 효과와 푸른 색을 좋아하고 또 텍스트를 입체감있게 표현하고 싶은데… 그런 이야기를 하려면 이제 그만하고 가보는 것이 좋겠다.

기능을 형태에서 분리한다는 것도 생각의 전환을 요구하는 것이지만 기능과 형태 중 어떤 한 쪽 없이는 다른 한 쪽을 생각할 수 없다고 믿는 사람들도 상당히 많이 존재한다. 내 생각에 정답은 그 중간쯤에 있는 것 같다. 인터렉션에 대해서 전략적으로 생각하기 위해 픽셀 단위의 완벽한 구성이 필요하다고 생각지는 않지만 프로토타입 작업을 할 때는 샘플 인터렉션 및 애니메이션 작업을 거치는 것이 훨씬 더 풍부한 논의를 할 수 있게 도와 준다고 믿는다.

간략하게 끄적이는 식으로 제품이 어떻게 작동하는지 설명할 수도 있지만 그럴 경우 디자인의 여러 가지 개성적인 요소를 놓치게 된다. 뿐만 아니라 디자인에 대한 완벽하고 훌륭한 대화가 자칫 그림자 효과에 대한 쓸모 없는 토론으로 변질되는 수가 있다. 실제로 색상, 글꼴, 간격 등의 요소는 제품의 분위기에 기여하는 중요한 요소이다. 제품의 분위기는 그 제품이 어떻게 작동하는가와 똑같이 아주 중요하다.

IxD의 연장선상에 있는 두 가지 약어가 있는데 이것들은 꼭 한 번쯤 살펴볼 가치가 있다.

HCI 분야에서 일하고 있는 사람들을 접했던 내 경험에 의하면 그들은 뛰어난 연구자들이다. 만일 당신이 당신의 어플리케이션에서 사용자들이 시도할 수 있는 모든 가능한 작업 흐름과 그 작업 흐름을 완료하는 데 걸리는 시간 그리고 이 작업 흐름이 당신의 사용자들에게 미치는 정량화된 감정적 상처 목록을 모두 알고 싶다면 HCI 전문가를 찾아서 그에게 18개월을 주면 아마 <한 박자 쉬고> 놀라운 결과를 얻게 될 것이다.

이제 참고 문헌을 소개할 차례다. 이 책들은 누구나 접할 수 있는 것이기 때문에 골랐다. 이 책들을 읽는 것이 완벽한 디자인 교육을 보장하지는 않지만 디자인의 여러 부분에 대해 훌륭하고 견고한 취향을 갖게 해 줄 것이다.

#3 UxD(User eXperience Design, 사용자 경험 디자인)

UxD를 설명하기 위해 여기에 세 가지 그림을 제시하였다.

사용자. 경험. 디자인. 이 중에 당신은 어디에 신경을 쓰는가? 물론, 당신은 이 모든 것에 신경을 쓸 것이다. 시각적 디자인은 물론이고 인터렉션 디자인에도 신경을 쓰겠지만 당신이 가장 신경을 쓰는 것은 아마도 사용자 경험일 것이다.

내 경험상 UxD라는 용어는 학문적인 개념이 아니다. 이 용어는 내가 알고 있는 것을 남들도 알고 있다는 것을 근거(즉, 사용자 경험에 대한 공유를 뜻하는 말 – 편집자주)로 세월이 흐르면서 저절로 도입된 것이다. 디자이너라는 용어는 사용하기에 너무 일반적이고 그래픽 디자이너와 인터렉션 디자이너는 너무 구체적이다. 사용자 경험 디자이너는 과거에 약어로 사용되다가 어느 순간 전체에 대해 신경을 쓰는 것이 더 유리하다고 마음먹은 듯하다.

참으로 잘 된 일이다.

다양한 디자인 분야가 있고 각각의 분야는 그에 맞게 사용되는 때와 장소가 있다. 마찬가지로 자신에게 UxD라는 이름을 붙이거나 그렇게 생각하는 사람을 찾는 이유는 작업을 설정하고 전체 경험을 책임질 의지가 있는 사람이 필요하기 때문이다.

도서 목록의 마지막에는 디자인 고전도 포함되어 있다. 그렇다. 만화에 대한 책도 있다.

디자이너와 개발자여. 더 자주 함께 파티하라!

다양한 디자인 분야에서 사용성이 목록에서 빠진 게 눈에 띈다. 문제는 아무리 근사한 약어를 가지고 있더라도 나는 사용성을 포함시키지 않았을 것이다.

스티브 잡스가 애플로 복귀하기 전에는 일방향 거울(one-way mirror, 나는 상대방을 볼 수 있는데 상대방은 나를 볼 수 없게 만든 장치-편집자주)과 비디오 카메라가 있는 멋진 방을 갖춘 사용성 팀이 있었다. 이 조직은 괜찮은 중앙 집권형 조직이었다. 나는 이들이 상당한 업적을 이루었다고 확신하지만 잡스가 복귀하면서 문을 닫고 디자인 팀을 날려버렸다. 그리고 각 제품 팀이 예전 사용성 팀의 기능을 물려받았다.

나는 이 구조조정이 일어난 후에 들어왔으므로 진짜 이유는 잘 모르지만 내가 아는 것은 내가 한 번도 사용성 실험실을 사용해 본 적이 없다는 것과 사용성 팀이 없어진 후인 지난 10년간 애플이 가장 사용성 있는 제품을 창조했다는 것이다. 내 생각에 사용성 디자인 기능을 개발 팀 전체에 확산시키기로 한 선택은 분명한 메시지를 전달하고자 한 것으로 볼 수 있다. 개발자와 디자이너는… 더 자주 함께 파티를 해야 할 필요가 있다는 것이다.

개발자와 디자이너들이 서로의 일에 계속해서 간섭하지 않는 상황에서 제품을 책임지는 팀을 만든다는 것을 상상할 수 없다. 그렇다. 그들은 뇌의 반대쪽에서 기인하는 주장을 하며 다투기도 한다. 가끔은 예술과 과학 사이의 전투가 되기도 한다. 그러나 개발자와 디자이너가 원하는 것은 정확히 똑같다. 그들은 뭔가 중요한 것을 성공적으로 만들었다는 것을 인식할 때 느끼는 강한 만족감을 원한다.

디자인 중심의 문화란 그 디자인 문화에 책임이 있는 사람들이 서로를 마주 대하지 않는다면 그냥 내던져진 공허한 문장에 불과하다. 여러 용어와 약어들은 어떤 사람이 무엇을 하는지 이해할 수 있는 출발점을 제공한다. 그러나 당신이 시간을 내서 그들이 사랑하는 일을 어떻게 이루어 내는지 이해하려고 노력하는 데서 나오는 존중이 진짜 중요하다.

번역 : 심승희, 윤서연
윤문 : 김형주
이 글을 읽고 공감이 가시면 ‘그냥 퍼나르지 마시고’ 위에 있는 트위터나 페이스북 ‘좋아요’ 버튼을 한번 클릭해주세요. 저희가 번역자, 윤문자에게 정식으로 부탁한 글입니다.

※ 내용중에 오번역, 오탈자를 발견하신 경우에는 알려주시면 감사하겠습니다.

※ 웹액츄얼리 북스팀에서 웹디자인 관련 영문번역이나 윤문을 해주실 분을 찾습니다. 관심있으신 분은 저희에게 메일을 보내주시기 바랍니다. books@webactually.com

[편집자주]

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

플러그인 다운로드 받기

1. 플러그인 설치

워드프레스 뮤를 세팅한 후, 대시보드의 Network Admin  메뉴에서 플러그인을 설치합니다. 플러그인 설치 방법은 원하는대로 할 수 있습니다. 위의 플러그인 다운로드 사이트를 통해 다운 받아서 FTP를 이용하여 ‘plugins’ 폴더에 직접 업로드해도 되고, 어드민 메뉴에 직접 업로드할 수도 있습니다.

어드민 메뉴에서 직접 업로드 하기

2. 플러그인 WordPress MU Domain Mapping 기본 세팅

1) WordPress MU Domain Mapping 플러그인을 설치하면 플러그인 내부에 ‘sunrise.php’ 파일이 있을 것입니다. 이 파일을 복사한 다음 /wp-content/ 폴더 안에 붙여 넣습니다.

2)wp-config.php 파일에 코드 추가

define( 'SUNRISE', 'on' );

3. WordPress MU Domain Mapping 플러그인 설정

다음은 ‘Network Admin’의 Settings(설정)>Domain Mapping 메뉴에서 기본적인 설정을 해줘야 합니다. 아래 내용을 차근차근 따라해 보세요.

1) 현재 사이트의 Server IP Address 입력

2) 도메인 옵션 설정

4. 도메인 추가 및 뮤 사이트와 연결

Network Admin의 Settings(설정)>Domains 메뉴에서 뮤 사이트의 도메인들을 추가하고 관리할 수 있습니다.

1) Site ID: 뮤 사이트의 고유 아이디. Sites>All Sites 메뉴에서 생성된 사이트에 마우스 오버를 하면 뮤 사이트의 ID를 알 수 있습니다.

2) Domain: 연결할 도메인

3) Primary: 체크하면 연결하고자 하는 도메인이 디폴트가 되어 사이트가 보입니다. 체크를 해제하면 단순 리다이렉팅으로 연결됩니다.

5. 도메인 및 서버 설정

위의 모든 사항을 적용했다면 도메인과 서버를 설정해야 합니다. 적용하고자 하는 도메인을 현재 서버로 연결하고, 현재 서버에서는 httpd.conf 파일을 수정하여 도메인을 현재 사이트로 연결해 줍니다. 이 작업은 반드시 거쳐야 하는 과정입니다. 이 과정을 빼먹거나 작업이 제대로 이루어지지 않으면, 디폴트 포워딩 화면이 보이거나 의도하지 않은 최상위 서버의 화면을 보여주기도 합니다.

6. 단독 도메인이 설정된 뮤 사이트

이렇게 단독 도메인을 얻은 뮤 사이트가 완성되었습니다. 여러 개의 뮤 사이트를 운영한다면 뮤 사이트 이름과 도메인을 통일성있게 구성해 보세요. 단독 도메인을 가진 뮤 사이트가 더욱 빛을 발하게 될 것입니다.

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

워드프레스 뮤(WordPress MU)란?

WordPress Multisite의 약자로, 간단하게 말하면 한번의 워드프레스 설치로 여러개의 다른 사이트를 운영할 수 있게 하는 기능이다. (다중 블로그 기능) 워드프레스는 3.0버전까지 싱글 사이트 플랫폼이었다. 여러 개의 사이트를 세팅하고 운영하길 원하는 사용자는 워드프레스 뮤 http://mu.wordpress.org 를 이용했다.

위의 사이트에 가면 이미 뮤는 워드프레스와 별개 기능이 아니어서 새로운 버전을 다운받아서 사용하라는 메세지가 나온다. (지금 현재 3.0 버전 이상에서는 워드프레스 뮤기능이 워드프레스 코어에 포함되어있다. 그러므로 이전처럼 따로 워드프레스 뮤 플러그인 파일들을 따로 다운 받아서 설치할 필요가 없다)

워드프레스 뮤를 사용하면 한지붕 아래 여러 사용자 사이트를 설치할 수 있다. 워드프레스 뮤는 워드프레스처럼 한번도 확장되거나 폭넓게 지원된 적이 없기 때문에 워드프레스 코어로 병합된다는 것은 여러 개의 워드프레스 사이트를 관리하는 사용자에게는 엄청난 뉴스였다.

- 『워드프레스 제대로 파기』 411페이지

웹액츄얼리에서 워드프레스 뮤로 작업한 포트폴리오

1. 워드프레스 설치

기존 워드프레스와 같은 방식으로 설치.
워드프레스 설치는 매우 간단한 내용이므로 설명 생략한다.

2. 워드프레스 뮤 세팅

wp-config.php 파일을 열고, 소스 삽입.

define('WP_ALLOW_MULTISITE', true);

3. 관리자 패널에서 “Network Setup”

소스 삽입 후 관리자 패널로 가면, 왼쪽 메뉴 중 “Tools”에 “Network Setup”이라는 메뉴가 생성된다. 이 메뉴에서 몇 가지 설정을 해줘야 한다.

첫 번째로 할 일은 하위 사이트(하위 블로그)들을 “Sub-domain” 방식으로 생성할 것인지, “Sub-directoy” 방식으로 생성할 것인지를 선택해야 한다. 사이트 생성 방식은 일단 선택하면 변경이 불가능하니 사이트 성격에 맞게 신중하게 고려하도록 한다.

어떤 방식을 사용하든 두 가지 모두 사용가능 하지만, 몇 가지 다른 점들이 있다.

1) Sub-domain 방식
사이트 별로 주소 앞에 구분을 해주는 방식이다. 예를 들어 최상위 사이트가 webactually.com 일 때, site1.webactually.com과 site2.webactually.com 처럼 구분을 두어 사이트를 구분할 수 있다.

대개는 이 방법을 선호하는 경우가 많지만 주의해야 할 사항이 있다. 보통 도메인 제공 업체에서 최대 3~5개 까지의 서브 도메인 설정만 무료로 제공한다. 하지만 도메인이 3~5개가 넘는 경우는 서브 도메인 당 비용(많이 비싸지는 않다. 약 5,000원~10,000원 정도)이 추가된다.

사이트를 Sub-domain 방식으로 세팅할 때에는 이러한 비용을 감안해 다중 블로그가 몇 개나 추가가 될 것인지 파악한 후 선택하는 것이 좋다.

2) Sub-directory 방식
사이트 주소 뒤에 디렉토리처럼 구분하는 방식이다. 예를 들어 최상위 사이트가 webactually.com 이라면, webactually.com/site1, webactually.com/site2 이런 식으로 사이트 주소 뒤에 ‘/’와 함께 붙여서 사이트를 구분한다. 이 방식은 Sub-domain과 달리, 비용과 상관없이 무한대로 자유롭게 생성할 수 있다.

4. 설정사항 저장

사이트 생성방식을 Sub-domain이나 Sub-directory 중에서 선택하면 다음 단계로 넘어가 몇 가지 설정을 더 해야한다.

1) blogs.dir 폴더 생성
wp-content 폴더 바로 아래 blogs.dir 폴더를 생성한 후, 퍼미션을 777로 바꿔준다. 이 폴더에는 나중에 블로그 별 미디어 콘텐츠가 올라간다.

2) wp-config.php 파일에 소스 삽입
워드프레스 관리자 패널에서 제공하는 소스를 wp-config.php 파일에 삽입한다.

define( 'MULTISITE', true );
define( 'SUBDOMAIN_INSTALL', false );
$base = '/';
define( 'DOMAIN_CURRENT_SITE', 'templateactually.com' );
define( 'PATH_CURRENT_SITE', '/' );
define( 'SITE_ID_CURRENT_SITE', 1 );
define( 'BLOG_ID_CURRENT_SITE', 1 );

3) .htaccess 파일 생성 or 수정.
.htaccess 파일은 워드프레스를 설치할 때 자동으로 생성되기도 하지만, 그렇지 않은 경우도 있어서 반드시 확인 후 생성하거나 수정해야 한다. 만약 .htaccess 파일을 제대로 수정하지 않으면 403에러가 발생할 수 있다.

RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]

# uploaded files
RewriteRule ^([_0-9a-zA-Z-]+/)?files/(.+) wp-includes/ms-files.php?file=$2 [L]

# add a trailing slash to /wp-admin
RewriteRule ^([_0-9a-zA-Z-]+/)?wp-admin$ $1wp-admin/ [R=301,L]

RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
RewriteRule  ^[_0-9a-zA-Z-]+/(wp-(content|admin|includes).*) $1 [L]
RewriteRule  ^[_0-9a-zA-Z-]+/(.*\.php)$ $1 [L]
RewriteRule . index.php [L]

5. “Network Admin” 관리자 패널

모든 설정사항을 저장한 후 워드프레스 어드민에 다시 로그인하면  ”Network Admin” 이라는 메뉴가 생성된다.

6. 서브 사이트 생성하기

“Network Admin” 어드민 화면의 왼쪽 메뉴에서 ”Sites > Add New” 메뉴를 이용해 새로운 서브 사이트를 생성한다.

1) Site Address
서브 사이트의 유니크한 이름을 입력한다. 사이트 이름은 나중에 수정할 수 있다.

2) Site Title
서브 사이트를 대표하는 타이틀을 입력한다.

3) Admin Email
서브 사이트를 관리할 관리자의 이메일 주소를 입력한다.
꼭 최고 관리자의 이메일 주소가 아니어도 된다. 최상위 사이트에 존재하는 아무 회원의 이메일로도 가능하다. 이 곳에 등록된 회원은 이 서브 사이트의 관리자 권한을 자동으로 갖는다.

7. 서브 사이트 관리

“Network Admin” 어드민 화면의 왼쪽 메뉴 중 ”Sites > All Sites” 메뉴를 이용하면, 현재 생성된 서브 사이트들의 기본 정보 및 서브 사이트에 가입되어 있는 사용자 등을 확인할 수 있다.

Tip: 기본적으로 서브사이트에 사용자로 등록이 되려면 최상위 사이트에 사용자로 이미 등록되어 있어야 한다. 그래야 각 서브 사이트별로 사용자를 추가할 수 있다.

8. 설정 완료된 서브 사이트

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

《워드프레스 제대로 파기(원제 DIGGING INTO WORDPRESS)》를 국내 독자에게 소개하기까지 정말 우여곡절이 많았다. 해외에서조차 원서가 정식으로 발간되기 전이었고 PDF 버전으로만 나온 터라 국내에서 정식 도서로 출판하는 것은 저자나 우리에게나 적지 않은 부담이었다. 하지만 전세계적으로 인정받는 좋은 정보를 국내 독자에게 소개하고 싶은 마음이 앞서 과감히 작업을 진행했고, 1년 여 준비한 책이 드디어 빛을 보게되었다.

《워드프레스 제대로 파기》는 국내에 워드프레스와 관련된 볼 만한 매뉴얼이나 활용서 하나 없어서 그 동안 웹액츄얼리에 수없이 문의 메일을 보내고 워드프레스에 궁금증을 가졌던 사람들을 위한 책이다. ‘워드프레스’라는 말에 이끌려 이 책을 들고 있는 독자라면 이미 워드프레스의 장점과 무한한 가능성에 매료되어 있을 것이다. 그리고 이 책이 좀 더 제대로 지식을 쌓고 활용하고 싶은 목마름을 달래줄 단비가 되어 줄 것이라고 생각한다.

전세계적으로 워드프레스를 활용한 블로그나 웹사이트가 해마다 가파른 속도로 늘고 있다. 한 설문조사에 따르면 현재 웹사이트의 약 20%가 워드프레스를 CMS로 사용하고 있다고 한다. 워드프레스의 짧은 역사를 감안하면 가히 폭발적인 추세다.

워드프레스를 이용한 대형 유명 글로벌 사이트도 무수히 많다. 뉴욕타임즈, CNN 방송, 텔레그래프 통신사, <PEOPLE>지, 플레이스테이션 게임사이트 등을 방문하면 그 차별성을 직접 확인해볼 수 있다.

최근 몇 년 사이 국내에서도 많은 기업이나 개인이 워드프레스를 기반으로 한 웹사이트 제작에 관심을 가지고 활용하는 사례가 늘고 있다는 반가운 소식이 전해지고 있다. 워드프레스의 장점인 웹사이트 제작의 확장성과 뛰어난 콘텐츠 유지 관리 능력에 주목하기 시작해 삼성과 LG, CJ를 포함한 대기업들도 워드프레스를 이용한 웹사이트로 속속 대체하고 있다.

왜 워드프레스인가? 그 이유야 셀 수 없이 많지만 몇가지로 요약하자면, 워드프레스는 웹사이트의 콘텐츠를 쉽게 만들고 관리할 수 있다. 워드프레스를 대체할 훌륭한 툴은 찾아보면 얼마든지 있다고 반문하는 사람도 있을 것이다. 그에 대한 대답은 간단하다. 워드프레스에는 끝없는 가능성과 잠재력이 있다! 무엇을, 어떤식으로 상상하든 워드프레스는 그것을 스마트하고 올바르게 작업할 수 있도록 안내할 것이다.

《워드프레스 제대로 파기》는 워드프레스의 메뉴나 기능, 또는 코드 설명을 장황하게 늘어놓은 기술 요약서가 아니다. 물고기를 잡아주는 것이 아니라 물고기잡는 법을 알려주는 것! 이것이 이 책의 궁극적인 목표다.

세계를 통틀어 이 책의 저자인 제프 스타(Jeff Starr)와 크리스 코이어(Chris Coyier) 만큼 워드프레스를 뼛속 깊이 이해하고 제대로 활용할 수 있는 팁과 노하우를 알려주는 개발자는 흔치 않다. 그것도 유쾌하고 명쾌한 방법으로 말이다.

저자들은 그 동안 수많은 워드프레스를 구축하면서 쌓아온 노하우를 이용해 워드프레스 기반 사이트를 운영하면서 마주칠 수 있는 코드를 다루는 변주 기법을 알려준다. 사용자를 매료시킬 수 있는 아름다운 웹사이트를 연주하는 것은 이제 이 변주 기법을 익히는 독자의 손끝에 달려 있다. 이 책에 나온 풍부한 예제와 저자들의 말을 기억하면서 끊임없이 연습해 보자. 책을 읽는 독자에게는 워드프레스 제작 스킬을 제공하고 사용자에게는 더 나은 사용성을 경험하게 해줄 것이다.

마지막으로 두 저자가 운영하는 블로그(digwp.com)를 방문하면 지금도 끊임없이 업데이트되고 진화되고 있는 워드프레스에 관한 최신 정보를 얻을 수 있다. 워드프레스 관련 핵심 정보를 소개한 웹액츄얼리(www.webactually.com)의 알찬 정보 또한 놓치지 않기를 바란다.

웹액츄얼리팀

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

주요 변경 사항

1. 웰컴 화면

워드프레스 3.3버전을 설치하면 새롭게 업데이트된 웰컴 화면을 만날 수 있다. 웰컴 화면은 세 개의 탭인 What’s New, Credits, Freedoms 로 구분되어 있다.

2. Feature pointers

이제부터 워드프레스에 최신 기능이 추가되면 Feature pointers가 알려준다.

3. 개선된 도움말 기능

도움이 필요한 상황이 되면 3번째 칼럼에 있는 영역에 도움말 제목이 노출된다. 이를 클릭하면 자세한 정보를 볼 수 있다. 꼭 클릭해 보자. 생각보다 매우 유용할 것이다. 또한, 3.3버전에서는 새로운 API 로 도움말 화면을 개선시켜 사용자 상황에 맞는 적절한 도움말을 보여준다.

4. 드래그 앤 드롭 미디어 업로더 (구 버전 IE제외)

여러 개의 파일을 쉽게, 한꺼번에 업로드 할 수 있다. 어드민 화면> 미디어> 파일 올리기 메뉴를 클릭하면 미디어 내비게이션을 볼 수 있다. 업로드할 파일들을 선택하고 ‘Drop files here’ 영역에 마우스로 드래그만 하면 쉽게 업로드 할 수 있다. 물론 이전처럼 ‘파일 선택’ 버튼을 클릭해 여러 파일을 업로드하는 것도 가능하다.

5. 플라이아웃(Flyout) 대시보드 메뉴

클릭 한 번에 원하는 화면으로 갈 수 있는 플라이아웃 메뉴를 제공한다. 이전 버전에서는 원하는 화면에 도달하려면 두 번의 클릭이 필요했다. 3.3버전에서는 플라이아웃으로 인해 클릭 한 번이면 해결된다.

6. 새로운 툴바 등장

어드민 바와 어드민 헤더 기능을 결합시킨 새로운 툴바가 등장했다. 이 툴바는 워드프레스 어드민의 프런트 엔드와 백 엔드 화면에서 항상 볼 수 있다. 좀더 진하고 날렵한 디자인의 새로운 툴바는 워드프레스 렉시콘을 좌측에 보여준다.

상단 이미지: 3.3버전의 새로운 툴바 / 하단 이미지: 3.2버전의 툴바

7. 아이패드를 비롯한 태블릿을 지원하는 반응형 웹디자인 화면

워드프레스 대시보드는 완벽한 반응형 디자인을 지원하진 않지만, 아이패드와 다양한 태블릿 사이즈 화면에 최척화되어 있다.

8. 개선된 동시 수정 기능

포스트 한 개에 여러 사용자가 동시에 수정하고 있을 때, 경고 메시지가 뜨며 수정이 멈출 때까지 포스트 내용을 수정할 수 없는 잠금 기능이 제공된다.

9. 향상된 고유주소

포스트 이름으로 된 고유주소를 쉽고 간단하게 선택하거나 직접 작성할 수 있다. 날짜, 이름, 숫자를 사용한 간단한 고유주소를 추천해줄 뿐만 아니라 사용자가 직접 입력할 수도 있게 해준다. 이젠 성능에 대한 패널티없이 고유주소를 사용할 수 있게 되었다.

10. 빠른 편집 메뉴에 포스트 형식 추가

이전 버전에서는 포스트 형식을 빠른 편집 메뉴에서 수정할 수 없었다. 새로운 버전에서는 포스트 형식을 수정할 수 있게 되어 포스트 수정이 전보다 빨라졌다

11. 그 외 추가된 기능들

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

미국 지디넷은 지난 10일 IT미디어 기가옴의 ‘로드맵2011서밋’에 참석한 매트 물렌웨그 워드프레스닷컴 창립자 발언을 인용해 이같이 보도했다.

당시 스스로를 ‘오픈소스 히피’라고 묘사한 물렌웨그 창립자는 “(기업들이) 윤리적, 철학적으로 소프트웨어만이 아닌 모든 것이 오픈소스화해야 한다”고 주장했다.

매트 물렌웨그 워드프레스 창립자

이어 “오픈소스 진영에서 상업적 측면도 챙길 수 있는 직원 수천명짜리 대기업 사례를 찾기가 쉽지 않다”면서도 “지난 8년반, 오픈소스 진영에서 옳은 일을 해온 지난 8년반 동안 워드프레스 사업을 일으켜 왔다”고 말했다.

워드프레스닷컴은 오픈소스 기반의 인기 콘텐츠 관리 시스템(CMS) ‘워드프레스’를 개발, 제공하고 이를 기반한 블로그서비스도 제공하는 기업이다. 6천500만개 이상의 웹사이트가 워드프레스 기반이며, 그 절반이 이 회사의 호스팅서비스로 돌아간다.

물렌웨그는 “내 목표중 하나는 ‘콘텐츠 발행을 민주화’함으로써 여기에 워드프레스 커뮤니티가 근본적으로 바른 일을 했음을 보이는 것”이라며 언젠가 현실화되길 바란다고 덧붙였다.

미국 지디넷 블로거 레이첼 킹은 워드프레스가 이미 엔터프라이즈 세계에도 단지 콘텐츠 발행 부문에 작용한 것 이외에 더 흥미로운 영향들을 더 많이 끼쳤다고 평햇다.

물렌웨그는 “내게 가장 흥미로운 트렌드는 엔터프라이즈 소프트웨어가 언제나 형편없긴 했으나 이제 사람들이 그것에 대해 더 많이 불평중이라는 점”이라고 말했다.

예를 들어 직원들이 어떤 작업을 할 때 워드프레스같은 오픈소스 툴로 하면 10초만에 끝낼 수 있는데, 오랫동안 방치돼온 기업용CMS에서는 10분씩 걸리는 비효율을 왜 감수해야 하냐고 물어온다는 것이다.

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명

이런 불만은 웹사이트를 갖고 싶긴 하지만 주말과 저녁을 웹사이트 작업에 골머리를 앓으며 보내고 싶지 않은, 소규모 사업 운영자들이나 친구들로부터 많이 들을 수 있을 것입니다.

웹사이트를 운영하는 방법부터 찾아본 사람들은 이런 불만을 얘기합니다. 심지어 어디서부터 시작해야 할지 몰라 아직도 고민하는 사람들도 많습니다. 하지만 희망은 있습니다.

워드프레스로 구출받자

워드프레스는 가장 인기있는 블로그 툴 중 하나입니다. 하지만 여기서 많은 사람들이 모르는 점이 있습니다. 워드프레스는 단순한 블로그를 넘어서서 강력한 콘텐츠 운영 시스템(CMS)으로 사용할 수 있다는 것입니다. 워드프레스를 사용하면 블로그와 웹사이트를 모두 제작할 수 있습니다.

이 글은 왜 워드프레스가 소규모 웹사이트에게 좋은 선택인지 살펴보고, 소규모 비즈니스를 위한 워드프레스 설치 및 설정 방법 그리고 사용 방법에 대해 알아볼 것입니다.

웹 콘텐츠 운영 시스템(Web Content Management Systems)

콘텐츠 운영 시스템은 웹 페이지 생성과 업데이트 관리를 도와주는 툴입니다.

저는 1998년 Interwoven이라고 불리는 실리콘 밸리의 초창기 멤버였습니다. Interwoven은 Ford Motor, FedEx, Cisco와 같은 대기업과 더불어 수천 개의 대·소형 기업에 웹 콘텐츠 운영 솔루션을 제공하는 회사였습니다.

저는 그곳에서 Fortune 100부터 그보다 작은 기업들에 이르기까지, 수백개의 회사와 협업하며 웹 사이트 아키텍쳐를 개발했습니다. 그동안 웹 콘텐츠 운영에 대해 많은 것을 배울 수 있었습니다.

그 당시 웹은 폭발적으로 성장하고 있었고, 콘텐츠 양과 종류가 늘어나면서 이를 운영하기 위한 어마어마한 요구가 있었습니다. 그때 우리가 판매한 소프트웨어만 해도 수천만 달러어치에 달합니다.

워드프레스를 웹사이트로 사용하기

오늘날 워드프레스는 놀라울만큼 강력한 무료 콘텐츠 운영 시스템으로 활용되고 있습니다. 워드프레스는 간편한 웹사이트 운영 방법을 찾고 있는 중소 비즈니스에게 맞는 강점을 많이 지니고 있습니다.

워드프레스의 디자인은 블로그를 위한 플랫폼으로 제작됐지만, 꼭 블로그 툴로 사용하지 않아도 됩니다. ‘블로그’를 사용하던 안하던 약간 손을 보면 워드프레스를 통해 자신의 웹사이트를 운영하도록 사용할 수 있습니다. 워드프레스가 블로그 플랫폼으로 디자인되었단 사실은 몇가지 강력한 장점을 동시에 제공해줍니다.

워드프레스는 콘텐츠 생성과 수정을 손쉽게 최적화할 수 있습니다. 구글과 같은 검색 엔진 순위에 오르려면 신선하고 독창적인 콘텐츠가 필요합니다. 웹사이트를 새로운 기사 또는 뉴스레터로 업데이트할 때는 당신을 방해할 수 없는 시스템이 필요합니다. 그렇다면 워드프레스는 왜 좋은 선택일까요?

소규모 비즈니스 웹사이트에 워드프레스를 사용하는 5가지 이유

워드프레스 제대로파기크리스 코이어 CHRIS COYIER 제프 스타 JEFF STARR 저국내 최초 워드프레스 활용 가이드 출간!

책 구매하기책 미리보기책 상세설명