상식이통하는웹사이트가성공한다

9월 독서경영 도서

쳅터별 요약

1장 사용자를 고민에 빠뜨리지 말자 (김형용)

알아보기 쉬운 웹페이지를 제1의 유저빌러티 법칙으로 보고 있다. 웹페이지는 딱 봤을 때, 이쯤에 이게 있겠지 싶은 곳에 그 메뉴가 그 동작을 예측할 수 있게끔 준비되어 있어야 한다. 이는 다음의 것들 모두에 해당된다.

페이지상 위치
사용된 용어
버튼이냐 링크냐
페이지의 의도

그 이유는

한번 클릭으로 떠나 버릴 수 있는 인터넷시장
사람들은 웹페이지를 그리 오래 보지 않는 다는 것 --> 한번 훑어보는 것만으로도 원하는 일을 다 할 수 있어야 함.

2장 실제로 어떻게 웹을 사용하고 있나 (신윤희)

사용자는 웹페이지를 절대 읽지 않는다.
- --> 눈으로 훑어보면서 빠른 시간내에 지나간다.
사용자는 최선을 택하지 않고 만족을 택한다.
- --> 훑어보다 어느정도 만족하면 그만 다음으로 넘어간다.
사용자는 전체를 꼼꼼히 살피기 보다는 대충 대충 넘어간다.
- --> 원하는 항목만 골라 본다.

3장 광고 디자인으로부터 배운다 (박병준)

앞 장에서 봤듯이, 사용자들은 사이트 내용을 대충 훑어보고 가기 때문에, 광고 효과처럼 짧은 시간 내에 강한 인상을 줄 수 있게 디자인 하는 것이 중요

명확히 눈에 띄는 계층 구조로 만들어라
익숙한 관례적 형식을 따르라
페이지를 명확히 구분된 영역들로 나눠라
클릭 가능한 항목인지 분명히 표시하라
혼란스러울 요인을 없애라

Simple

4장 동물입니까? 식물입니까? 무생물입니까? (신수미)

'스무고개'라는 낱말 게임에서 "동물입니까, 식물입니까, 무생물입니까?"라는 질문을 한다면 정답이 무엇이든간에 깊이 생각할 필요 없이 바로 대답할 수 있다. 웹에서는 항상 선택을 해야할 상황에 직면하게 된다. 사용자가 원하는 것을 찾기까지 몇번을 클릭해야 하는가? 보다도 중요한 것이 "클릭할 때마다 얼마나 고민을 해야 하는가"이다. 확신이 서지않아 머뭇거리는 일들이 아니라면 수없이 클릭을 하더라도 크게 개의치 않으므로 고민하지 않고 선택할 수 있도록 설계하는 것이 사이트 사용을 쉽게 해주는 중요 요건 중 하나이다.

5장 불필요한 단어는 삭제하라 (강병철)

각 페이지에 나오는 단어를 반으로 줄이세요.
그리고 나머지 단어도 다시 반으로 줄이세요.
                      -크룩의 유저빌러티 제3법칙

그러나 개조식 페이지는?

6장 페이지 이름과 경로 표시(이태호)

Search for something

by browsing
by Searching ( recently increase, so the navigation goes more crutial)
- 웹은 실제 물리적인 부분보다 훨씬더 직관적이다. 따라서 길을 잃기가 더 쉽니다.
- 웹 네비게이션은 사이트의 파악보다는 현재위치에 더 촛점을 맞추어야 한다.
Navigation 의 가치
- 사이트를 돌아다니는 버팀목이 되어줌.
- 위치등을 알려줌
- 사이트 사용법을 알려주기도 함.
- 신뢰를 가져다줌.

관례 (으례 쓰이는 것들)

고정 Navigation (홈페이지와 입력양식페이지는 제외)
Site ID(해당사이트의 로고등.. 홈페이지와 같이 쓰이는 추세)
section
utilities
Home( home에 대한 명시적인 링크)
검색
페이지 이름(가장 큰글씨로)

경로표시 ( 실제 사례: 아마존(http://www.amazon.com)

최상단, 작은 폰트, 현재위치를 보여줌, 마지막은 볼드로 처리, 페이지이름으로 쓰이지 않아야함.
명확
깔끔,
Easy to catch
물리적 공간의 느낌

7장 홈페이지는 디자이너의 전유물이 아니다 (이규열)

나무를 보지 말고 숲을 보라!!

이사이트는 어떤 사이트일까?
이사이트는 무엇을 할수 있을까?
다른 사이트를 제쳐두고 이 사이트를 애용할 이유가 있을까?
이사이트에는 어떤 것들이 있을까?

홈페이지 전체를 잘 구성해서 간접적으로 '숲'을 볼 수 있도록 해서 대체로 사람들이 사이트에서 큰 특징들을 잡아내고 스스로 고민없이 이것저것해볼수 있게 끔 해주어야 한다. 왜냐면 사용자들은 웹페이즐 꼼꼼히 살펴볼 시간도 없을 뿐더러 습관적으로 그렇게 하지 않는다.

사용자는 웹페이지를 절대 '읽지'않는다 단지 훑어볼뿐 전체를 살피기보다는 대충대충 넘어간다. 그렇기에 직관적이고 쉽게 알아볼 있고 전체적인 흐름을 이해할 수 있는 페이지가 되어야 한다. 숲을 잘 볼 수 있게끔 군더더기는 없애고 적절한 태그라인과 시작포인트로 사용자가 고민없이 사용할 수 있도록 해야한다.

8장 디자이너가 개발자를 만났을 때(이기용)

프로그래머와 웹디자이너의 회의 이것을 여기서는 종교논쟁이라고 하고 있다. 즉 끝없는 논쟁의 연속이라는 의미다. 대부분의 사람들은 보통의 웹 사용자가 자신과 비슷하리라 생각하지만 이것은 전혀 틀린 생각이다. 사람들은 자신이 처한 상황이나 위치에 맞게 웹을 사용하고 있다. 그래서 개발자 또는 웹디자이너들의 회의에서 "보통의 웹사용자"라고 일컫는 사람은 어디에도 없다. 따라서 특정 웹개발 과제에 대해 회의를 하는 것 보다는 베타버전을 만들고 테스트를 거쳐 수정해 나가는 것이 가장 바람직하다고 이책에서는 결론 내리고 있다.

사실 나도 이런 착각에 빠져 있었던 것 같다. 대부분의 회의 때 내가 편해야 다른 사람도 편할 것이라는 생각에 개발자나 웹디자이너들에게 일방적인 요청을 했던 것이 사실이다. 이 부분에 대해서 앞으로는 베타버전을 빠른게 만들고 이후 수정하여 사람들의 요청사항을 반영하는 순서를 일을 진행할 예정이다.

9장 하루 1만원으로 유저빌러티 안심보험에 가입하자 (임천안)

웹개발을 하여 사이트를 런칭하는 최종 목적이 무엇인가? 이에 대한 답변은 최종사용자(웹초보자)에게서 찾을 수 있을 것이다. 하지만 초반에 생각되었던 일들이 전문가들의 개발을 통해 전문가들의 생각과 시각에 맞혀져 사이트가 개발되어지는 것을 피할 수는 없는 것 또한 현실이다. 이에 대한 해결책으로 사이트 개발시 개발진행단계에 최종사용자의 시각을 최대한 반영하기 위한 방법으로 주기적인 유저빌리티 테스트를 진행함으로써 런칭 후의 막대한 시간과 비용의 투자로부터 상당부분 자유로워 질 수 있는 토대를 마련할 수 있다.

10장 품행이 방정해야 제대로 된 유저빌러티다 (조관희)

특정 목적을 갖고 있는 공급자가 제공하는 프로그램이나 웹사이트 등은 사용자들에게 정보를 제공하고 문제를 해결하며 대화하는 공간등의 역할을 하는 하나의 작은 사회로 볼 수 있다. 사회생활을 하다보면 지저분한 사람, 이기적인 사람, 거짓말 하는 사람 등 믿음이 가지 않는 많은 요소들이 있을 것이다. 마찬가지로 공급자가 제공하는 웹사이트도 고객들에게 믿음을 줄 수 있는 웹이 되어야하며 이는 많은 요소들 하나하나가 신뢰성있게 구성되어야 한다. 고객에게 지나친 정보를 요구, 불필요한 많은 광고, 복잡한 인터페이스, 필요한 정보를 얻지 못하는 최신의 정보의 부재등 고객의 눈쌀을 찌뿌리게 할 수 있는 요소들을 파악하고 해결하는 부분 또한 고객의 입장에서 발전시켜 나가야 할것이다.
많은 부분이 있겠지만 이책에서 신뢰를 쌓는 것들에 대해 간단하게 나열하면
* 명확하고 쉬운 인터페이스
* 사용자의 입장에서 필요한 정보를 솔직하게 제공
* 편리성
* 문제해결을 위한 내용등을 한곳에 집중
* 최신의 내용을 지속적으로 업데이트 (FAQ등)
* 웹의 오류를 최대한 빠른 시일내에 복구
등 나열한 내용 이외에도 많은 요소들이 있을것이다. 최근 웹을 구성하고 제작하고 업데이트를 하고 있는 우리사 모든 성원이 다시한번 생각해 봐야 할 내용들이다. 요즘 스스로가 자신의 입장에서 고객들에게 강요를 하는 웹을 만들고 사용하고 홍보하고 있는지 ... '신뢰를 쌓기는 어렵고 오래 걸리나 신뢰가 깨지는 것은 한순간이다.'

11장 엑세서빌러티, CSS, 그리고 함께 사는 세상 ( 박준형)

엑세서빌러티라고 하면 사전적인 의미로는 '접근성'을 뜻하지만 내용상으로는 모호한 풀이라고 할 수 있다. 윈도우의 보조 프로그램 안의 '내게 필요한 옵션'에 보면 돋보기, 화상키보드 등이 있는데, 돋보기 기능은 시력이 좋지 못한 사람들이 좀 더 쉽게 윈도우를 사용할 수 있도록 만든 것이다. 여기서 '내게 필요한 옵션'이 윈도우 영문판에서는 '엑세서빌러티'라고 정의되어 있다. 즉, 장애를 가진 사람들이 일반인들과 동일하게 사용할 수 있도록 지원해주는 기능들을 총체적으로 '엑세서빌러티'라고 말할 수 있다. 웹도 마찬가지로 일반사람들은 쉽게 볼 수 있지만, 시력이 좋지 않은 사람들은 웹 문서의 글자를 크게 해서 볼 수 있도록 디자인하는 단계를 지칭할 수 있다. 하지만 대다수의 일반인들이 느끼기에는 불편하지 않은 점을 괜히 몇명의 장애인을 위해서 여러가지 어려운 기능을 부가적으로 개발해야 된다는 불평이 나올 수 있는데, 이러한 불평들을 잠재울 수 있는, 즉 좀 더 쉽게 '엑세서빌러티'를 지원할 수 있는 도구가 우리회사 디자인팀이 구현하고 있는 CSS라고 할 수 있다. CSS를 이용하면 컨텐츠의 위치를 쉽게 조작할 수 있고, 변경이 용이하며, 브라우저가 다르더라도 외양을 유지할 수 있고, 텍스트의 크기를 쉽게 변경할 수 있는 장점이 있다. 이러한 엑세서빌러티에 대한 요구는 타인을 배려하고자 하는 마음에서 시작되었고, 궁극적으로는 모든 사람들이 동등하게 좋은 삶을 누리고자 하는 가치관에 기반한 것이다. 우리회사 또한 생물정보컨설팅에 대한 엑세서빌러티를 위해서는 무엇이 필요한지 생각하며 하나씩 곱씹어 나갈 필요가 있을 것 같다.

12장 저희 사장님이 이런 지시를 내리셨는데, 어떻게 해야 하나요? (정은미)

웹디자인 진행시 유념해야할 세가지 사항은
첫째, 채택된 디자인 구현시 어떤 위험을 감수해야 하는지 인식하고
둘째, 그 디자인을 채택할만한 이유가 있는지 명확히 설명할줄 알아야 하며
셋째, 테스트를 거쳐 사용자를 만족 시켜야 한다고 말하고 있다.

토론

Web usability, web accessibility 에 대해 언급하고 있다. 또한, 개발자와 디자이너사이에서 보다 더 나은 협력방안을 소개하고 있다. 그리고, 사용성 테스트에 대한 중요성도 소개되어 있다.

좋은 User interface 란 어떤 것인가에 대해 전부는 아니지만, 몇몇 중요한 점들을 알아 볼 수 있었다. 당사 제품의 UI들은 어떤 방향이어야 하는가. 개발자도 달랑 그 기능만을 구현하는 것이 아닌, 어떻게 해야 사용이 편리할까를 고민해야 하며, 디자이너도, 단순한 이쁨 보다는 실용성에 기반한 명료함, 일관성을 유지해야 할 것이다.

마지막으로, 웹사이트에서 가장 중요한 점 가운데 하나였던 "신뢰". 바르고 정직한 정책이야 말로, User interface 만큼이나 중요한 점일 듯 싶다. 전 직원 모두가 회람해서 읽어볼만하다.

-- HyungyongKim 2007-01-30 11:07:39

새롭게 구매가 되었다고 하니 어서 읽어야 될 것 같다. 예전부터 우리회사 책장에 꽂혀있던 책이라 읽어보았던 기억이 난다. 가장 기억에 남고 지금 우리 회사에 필요하다고 생각했던 부분은 웹디자인은 직관적이어야 한다는 것이다. 즉 이 버튼을 클릭하면 어떤 정보가 나올 것이라는 것이 예측되어야 한다는 것이다. 아울러 사용자가 클릭할 버튼을 직관적으로 알 수 있어야 한다는 것이다. 이 버튼은 어떤 기능을 할려고 만든건지 고민을 하게되면 안된다는 것이다.

처음 읽을 때 다 읽지 못했던 기억이 난다. 책이 두껍고 또 비슷한 내용이 반복적으로 되풀이되다 보니 재미없던 책으로 기억한다. 각 파트별로 맡은 부분을 읽고 우리회사에 적용할 수 있는 부분을 나눌수 있는 기회가 되었으면 한다. -- 이기용 2008-08-08 10:59:04

사용하기 편리한 웹사이트를 만든다는것은 지극히 당연하고, 자연스러운 것이다. 특히나 웹을 사용할 뿐만 아니라 개발자로서 약간의 의무감 같은것도 느끼게 된다. 책에서 다루는 내용은 식상한 내용일 수도 있다. 어떻게 보면, 사이트제작시 참고해야하는 가이드라인정도로 비춰질 수 있다. 하지만, 사용자가 웹을 상대할때에는 보이는 화면에서 모든것을 해결해야 한다. 코드를 만든사람라면 링크를 클릭했을때 어디로 갈지 알겠지만, 사용자입장에서(특히나 처음 사용한다면)는 사무실문을 열었는데, 갑자기 산꼭대기에 와있는 경험을 할 수도 있다. 이런점을 감안한다면, 이책에서 제시하는 기본적인 골자는 매우 중요하다고 할 수 있다. 기본적이며, 정말 상식적인 내용이다. 그렇지만, 우리는 종종 이런룰이 깨지는 경우를 많이 경험하지 않는가? 이런부분을 상기시키고 사용자를 배려하는 웹사이트제작을 위해서라면, 이책을 한번쯤 읽고 곰곰히 생각해볼 필요가 있다고 생각한다. -- TaihoLee 2008-09-08 13:36:27

웹사이트 사용자로서 나 스스로도 의식하지 못했던 너무나도 당연스런 얘기들을 하나하나 꼬집어주는 참 교과서 같은 책이다. 무언가를 찾으려 웹사이트를 찾아 헤메다 어느 순간 애초에 무엇을 찾으려 했는지 그 목적을 잊은 적도 많고, 어디에 무엇이 있는지 순간 당황스러웠던 페이지도 많았으며, 원하는 답을 기분좋게 얻은 페이지는 즐겨찾기에 바로 링크했던 적도 많다. 그래서 책에서 강조했듯이 다수를 대상으로하는 웹페이지니 만큼 상식을 지켜가며 개발을 해야하는 것이 굉장히 중요할듯하다. 문제는 어디까지가 상식선인지를 깨닫는것인데 많은 경험은 기발한 아이디어로 인한 변화와 상식선을 적절히 융화 시켜줄 중요한 수단이라 생각들었다. -- YounheeShin 2008-09-08 15:14:13

책을 다 읽지는 못했지만 책의 행방이 묘연한 현재 상황에서 140페이지 정도까지 읽은 상태로 잠깐 써본다.(수배해서 다 읽는대로 update하겠음) 읽으면서 개인적인 생각으로는 단순한 UI이 이야기가 아닌 전 시스템에 대한 이야기 같았다. 여기서는 사용자의 편의성(Usability)을 강조해서 이야기 했지만 시스템에 따라 약간의 조건이 다를 수도 있다. 만약 편의성보다는 기능성을 강조한다면 UI는 또 다르게 변해야 할 듯 하다. 이렇게 조건에 따라 약간에 차이가 생길 수 있지만 시스템은 전체적으로 유기적으로 움직여야 한다는 것. 단순히 위치조정정도야 어떻게 해도 (사용자의 편의나 기타 조건에 따라) 괜찮겠지만 단순한 위치조정이 아닌 것들은 전체적인 사이트의 concept을 고려해야 하고 각 기능들은 충돌나지 않아야 한다. 이를 위해서는 기획부터 이를 고려해야 할 듯 하다. UI가 사용자의 편의성을 위해 만들어야 하는 것은 이책에서 잘 알았다. 하지만 기획에서부터 프로그래밍까지 일괄적이고 명확해야 사용자의 편의성은 확보되지 않을까? -- 전철욱

이 책을 가장 잘 설명한 어구는 표지에 있는 Don't Make Me Think!이다. 개발자나 기획자는 개발중인 사이트에 고민도 많이하고 사전지식도 많이 습득한 상태이며, 무엇 보다도 그 사이트에 대한 애증(?)을 가지고 있다. 그래서 우리 모두(개발자/기획자) 잘 잊어버린다. 다른 사람들이 얼마나 게으른가 그리고 얼마나 이 사이트에 대해서는 무식한가에 대해서! 웹을 이용하는 사람 대부분은 검색이나 자료탐색을 하기 위해서 방문한다. 즉, 방문한 웹의 충성스런 사용자도 아니며 원한는 자료를 제외하고는 별 관심이 없다. 그래서, 그들에게 생각하게 만들거나 머뭇거리게 만들면 다시 방문하지 않는다는 것! 이 책은 이런 함정에 빠지지 않고 어떻게 성공적이 웹을 구현하는 가에 대한 충고를 하고 있다. 그러나 주종관계를 무색케하는 갑과 을의 관계, 동시다발적인 프로젝트 수행, 예정에 없던 요구사항, 전시(display)행정을 위한 웹 구현 등 국내 현실에 적용하기 위해서는 나름의 선택과 집중이 필요하다. 또한 회사 구성원 모두 책을 읽고(reading) 이해(understanding)를 했지만, 정말 회사의 지식으로 되기 위해서는 어떻게 습득(learning)할 것인가에 대한 고민이 필요하다. -- 강병철 2008-09-08 14:05:19

오늘 디자인팀, 지식관리팀과 함께 점심식사를 하면서 이 책에 대한 이야기를 나누었다. 개발자 입장에서는 책에서 제안하는 가이드를 내키지 않는 것들이 있다고 한다. 짧은 시간이라 깊게는 이야기 할 수 없었지만 우리가 개발하는 사이트와 책에서 예시하는 사이트의 특성이 달라서 그럴 수 있고, 또는 개발방법론적인 시각차가 있어서 그럴 수 있다. 좀 더 일찍 이런 이야기가 나왔다면 견해차가 있는 이슈들을 도출하고 좀더 깊이 있는 토론이 될 수 있었을 것 같다. 그리고 이런 제안도 해봤다. 현재 회사에서 개발한 사이트 "우리회사 LabKM", "VSD" 등을 이 책에서 말하는 관점에서 점수를 매겨보고 자평을 해보는 표를 만들어보면 어떨까? 귀찮은 일인지... 또는 내키지 않는 잣대로 점수를 매기는 것에 대한 거부감인지... 좋은 반응은 나오지 않았다. 하지만 실무적으로 적용해봐야 어떤 잣대를 취사선택할지 객관적인 자료를 만들 수 있지 않을까? -- 강병철 2008-09-10 14:44:14

디자인은 어떤 목적을 달성하기 위해 계획하고 합리적으로 구성하여 유기적 통일을 얻기 위한 창조활동이다. 디자인은 관념적인 것이 아니라 실체이기 때문에 어떤 종류의 디자인이든 대상을 떠나서는 이루어질수 없다. 웹디자인에서도 마찬가지로 고객을 설득하고 만족스러운 결과물을 얻기 위해서는 충분히 타겟을 분석하고 프로젝트의 목적과 수행계획을 진행하는 웹기획 단계를 필수적으로 거쳐야 한다. 특히, 자사의 규모에서는 UI기획능력을 배양해야할 필요성이 있으며, 왜 이렇게 디자인하여야 하는지에 대한 의견을 분명히 말할 수 있는 충분한 자료를 스스로 확보하여야 한다. 또한, 웹프로젝트는 혼자 수행하는 것이 아니며, TFT(TASK FORCE TEAM)의 상호협조하에 이루어진다. PM은 기획, 디자인, 개발자가 하나의 소리를 낼 수 있는 오케스트라의 지휘자가 되어야 한다. -- JungEunMi 2008-09-09 09:06:36

홈페이지가 흔히들 디자이너가 만드는 것, 개발자가 만드는 것이라고 착각하기 쉽다 훌륭한 웹사이트란 무엇인가? 삐까번쩍하고 '우와' 라고 감탄사를 절로 내뱉게 만드는.. 이런 사이트가 훌륭한 사이트일까? 누가 깔끔하게 디자인을 하던, 군더더기 없는 코드를 완성하던, 다듬고 다듬은 기획이던간에 중요한 것은 이 세가지 모두가 아니다 기획, 개발, 웹디자인의 삼박자가 균형있게 진행되는 사이트에 사용자의 입장을 최대한 고려한 사이트가 훌륭한 사이트이지 않을까? 아주 간단하지만 슬쩍 잊어버리거나 내 고집을 피워서 홈페이지를 처음 만들때의 의도와는 달리 많이 변형된 사이트가 되지는 않았는지.. 기획자와 디자이너, 개발자들의 문제가 서로 아우러져 서로의 의견이 서로 상충하면서 사용자들의 편의성은 무시되어진 사이트가 등장하는게 아닐까?

사이트 이용자에게 고민할 꺼리를 주지마라, 고민을 조금 해서라도 이해하고 익숙해지면 이용할 것이라고 자기위안으로 삼지말라, 글자 크기를 다르게 하든 여백을 살리든 사용자가 한번 보면 척~하고 이해가 가는 삼척동자도 알만한 사이트를 만들어라. 우리가 늘상 알고는 있지만 무심코 지나치는 그런 부분을 세심하게 살리는 사이트가 되어야 할거 같다.

여담: 이책을 읽고 느끼는 점은 '프리젠테이션 젠'이라는 책을 읽었을 때의 느낌과 비슷하다. 읽으며 '아~~'하고 절로 수긍하게 만드는 그 무엇인가가 있다고 해야할까? 발표를 잘하는, 내 의사를 정확히 전달해서 상대를 설득하는 프리젠테이션이나 웹사이트에서 사용자에게 이 사이트의 특징과 내용을 잘 전달해서 이용하게끔 만드는 것에는 서로 무언가의 공통점이 있지 않을까? 발표자료는 발표자료다워야 한다는. 웹사이는 웹사이트 다워야한다는 기본원칙을 우린 너무 간과하고 있는걸까? " ~답다" 라는 말이 새삼떠오른다. 남자는 남자다워야하고 뭐 이런 말이 웹사이트에는 적용되지 말라는 법이 있을까? 버튼은 버튼답게, 링크는 링크답게.. 잘 알지만 슬쩍슬쩍 넘어가지는 않았나 싶다.

적절한 여백과 간결, 명료함, 그리고 내가 전달하고자 하는 핵심 이것들은 발표에서나 웹사이트에서나 서로 공통적이지 않나싶다. 상대방을 충분히 납득시키고 기억에 남는 무언가를 주던, 사이트에서 검색이나 버튼같은 것들이 의도하는바와 같이 분명하다면 청중이나 사이트 이용자들이 고민없이 받아들이고 잘 사용할 수 있지 않을까? -- KyooyeolLee 2008-09-11 07:10:02

Tag : book

CategoryBook