고래가 부르는 노래

[summary] 상식이 통하는 웹사이트가 성공한다 본문

고래노래의 사는 이야기/웹 기획 이야기

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

고래의노래 2008. 1. 14. 22:01
http://www.sensible.com/

- 각 페이지를 명확히 눈에 띄는 계층구조로 만들어라
  - 중요한 항목들이 부각되게
  - 놀리적으로 연관된 항목들은 시각적으로 연관되게
  - 상위 항목은 하위 항목을 포괄하고 있듯이 시각적으로 표현되어야 함
- 익숙한 관례적 형식을 따르라.
- 페이지를 명확히 구분된 영역들로 나눠라.
- 클릭 가능한 항목인지 분명히 표시하라.
- 혼란스러울 요인을 없애라.

- 장황한 설명을 줄여라

- 사람들이 무엇을 좋아할지 논쟁하느라 시간을 허비하고 개발팀의 에너지를 갉아먹을 동안에 차라리 테스트를 통해 직접 눈으로 확인하라.

- 포커스 그룸 : 대개 5~8명의 소그룸으로 모인 사람들이 탁자에 둘러앉아서 제기되는 아이디어나 디자인에 대해 이야기를 나눕니다. 그룹으로 진행되는 과정이기 때문에 이 작업의 성공여부는 참여자들이 서로 얼마나 적극적으로 의견을 나누느냐에 좌주됩니다. 어떤 시안을 두고 사용자들의 의견이나 느낌 등을 표본으로 얻어내는데 효과적입니다. => 사용자들이 무엇을 워하며 좋아하는지!
- 유저빌러티 테스트 : 한 번에 한 사람의 사용자에게 테스트 대상을 보여주고 그 대상을 이해했는지 물어보거나 그 대상을 이용해서 주어진 과제를 수행하도록 요구합니다. 이떄 테스트 대상은 웹사이트 전체일수도 있고 사이트 샘플이나 페이지 샘플일 수도 있습니다. => 사이트가 제대로 돌아가고 있는지 사이트를 어떻게 개선해야 할지!

유저빌러티 테스트
- 멋진 사이트를 만들고 싶다면 반드시 테스트를 하세요
- 단 한 사람의 테스트라도 해보는 것이 안하는 것보다 100배 좋다.
- 프로젝트 말미에 100명 보다 프로젝트 초기에 한 명이라도 테스트하는 것이 좋다.
- 테스트 참여자 선발 자체는 중요하지 않다. (사이트의 내용이 초보자들에게도 충분히 분명해 보인다면 전문가는 불편해할 이유가 없을 것이다.
- 테스트의 핵심은 증명. 반박이 아니라 제작 방향을 결정하는데 도움을 주기 위함이다.
- 테스트는 반복이 중요하다.
- 사용자의 반응을 직접 살펴봐야 한다.

참가자 선발 시 주의사항
- 적절한 보상
- 간단한 선발공고 작성
- 테스트 사이트에 대해 미리 의견을 나누어서는 안됨.
- 친구나 이웃에게 부탁하라.

- 사용자가 자율적으로 선택할 수 있는 과제를 밭겨라
(최근에 구입한 책을 찾아보세요)

테스트 이후 문제점 선별
 - 순간적으로 길을 잃는 현상에 너무 주목하지 말 것(제빨리 되돌아왔다면)
- 항목을 더 넣으려 말 것(차라리 혼란스러운 것을 빼는 방법을 택할 것)
- 제안한 새로운 기능을 모두 수용할 필요는 없다.
수행하기 쉽고도 명확하고 효과가 분명한 것 위주로 우선 실행

신뢰를 저버리는 것들
- 사용자가 원하는 정보를 숨긴다
- 사이트 운영이 수월하도록 사용자의 행동을 규제하고 다그친다.(전화번호에 -를 넣지 말라는 등)
- 꼭 필요하지 않은 정보를 요구한다
- 긴 플래시 인트로 또는 자화자찬 홍보사진

신뢰를 쌓는 것들
- 사이트 방문자들이 여기서 무엇을 하려고 하나? 가장 중요한 것 세가지는? 그것을 명확히 하고 쉽고 간단하게!
- 사용자 수고 덜어주기 (한 번 입력한 정보는 다시 입력하지 않게!)
- 사용자가 오류를 신고할 수 있게 하라
- 문제를 해결할 수 없으면 일단 사과하라.

Guidelines for Accessible and Usable Web Sites: Observing Users Who Work With Screen Readers1 : http://redish.net/content/papers/interactions.html

http://www.csszengarden.com/

CSS
- 컨텐츠의 위치를 조작하기에 좋다.
- 쉽게 변경시킬 수 있다.
- 브라우저가 다르더라도 외양을 유지할 수 있다.
- 컨텐츠를 순서대로 나열할 수 있다.
- 텍스트의 크기를 변경할 수 있다.

- 모든 이미지에 적절한 alt 텍스트 추가
- 작성한 form 요소가 스크린리더와 제대로 동작하는가?
- 각 페이지마다 시작 부분에 메인 컨텐츠 건너뛰기를 둔다.
- 키보드 만으로 모든 컨텐츠에 접근할 수 있어야 한다.
- 특별한 이유없이 자바 스크립트를 사용하지 않는다.
- 서버 사이트 이미지 맵이 아니라 클라이언트 사이드 이미지 맵을 사용