2007년 6월 3일 일요일

하이퍼텍스트 :: 눈에 잘 들어오는 뉴스 사이트 만들려면?

하이퍼텍스트 :: 눈에 잘 들어오는 뉴스 사이트 만들려면?
<인터넷신문과 온라인 스토리텔링>을 저술할 때 많은 도움을 받았던 것이 바로 제이콥 닐슨(Jakob Nielson)의 글들이었다. '웹 사용성(web uasbility)' 전문가인 제이콥 닐슨은 어떻게 하면 사람들에게 읽히는 사이트를 만들 것이냐는 문제를 놓고 엄청나게 많은 연구 성과를 내고 있는 사람이다.

(웹 유저빌리티에 관심 있는 사람은 제이콥 닐슨이 운영하는 useit.com이란 사이트를 방문해 보시라. 정말 많은 통찰력을 배울 수 있을 것이다.)

역시 서핑을 하다가 뒤늦게 <온라인 저널리즘 리뷰>에 실린 Eyetracking points the way to effective news article design 란 글을 읽게 됐다. 사람들이 웹 사이트를 볼 때 어떤 부분을 주시하는 지를 연구해 좀 더 가독성 높은 뉴스 사이트를 만들자는 연구다. 제이콥 닐슨이 뉴욕 시민 255명을 대상으로 눈동자 추적 연구를 한 결과를 기사 형태로 정리한 것이다.

(눈동자 추적 연구는 일정 시간 사이트를 보게 한 뒤 '시험'을 치른 뒤 어떤 부분에 있는 콘텐츠를 가장 잘 기억하는지를 표시하는 방식으로 진행한다. 신문이나 인터넷 사이트의 가독성 조사를 할 때 가장 널리 사용되는 방법이다.)

1. rewrite + reformat = remember

이들은 사이트를 새롭게 만들어서 제시한 결과 절반 동안만 머물고도 34%나 더 많은 내용을 기억했다고 한다. 그 비결은
- 게시판형 글쓰기(글 앞에 점이나 세모 표시 같은 것들 첨부)
- 부제(subheadline)
- 좀 더 간결한 글쓰기 등이었다.

이 런 연구 결과를 토대로 독자들이 글을 더 잘 읽고, 잘 기억하며, 만족할 수 있도록 하기 위해서는 인쇄신문 텍스트를 온라인용으로 쓸 땐 새롭게 작성할 것을 권고하고 있다. 아래 사진은 눈동자 추적 연구 실험팀들이 실험한 사이트들. 왼쪽이 원래 사이트이고, 오른쪽이 새롭게 구성한 뒤 가독성을 한층 높인 사이트다.

사용자 삽입 이미지

2.
Precise and relevant editing = successful design

뉴스 사이트는 정확하고 철저하게 편집될 필요가 있다. 따라서 '스캔'하기 쉬운 형태로 텍스트를 제시하고, 내비게이션을 좀 더 간결하게 할 것. 그리고 쓸 데 없는 그래픽은 텍스트로 바꾸든지, 차라리 공란으로 남겨두는 것이 좋다.

특히 뉴스 사이트 디자이너들은 종이신문에서 힌트를 얻는 일은 절대 금하는 것이 좋다고 권고하고 있다.

3. Photos edited for relevance = photos viewed

사진이 있다고 해서 더 눈길을 끄는 것은 아니다. 이미지를 쓸 때는
  • 콘텐츠와 관계가 있고
  • 명확하며
  • 얼굴이 잘 보이는 사진을 쓰는 것이 좋으며
  • Feature areas of private anatomy. (이건 무슨 뜻인지?)

    또 독자들은 모델의 이미지보다는 진짜 사람 사진을 더 좋아한다.

    따라서 사진을 쓸 때는

  • 독자가 누구인지를 알 것.
  • 관련 콘텐츠와 사진을 어떻게 연관시킬 지 알아야만 한다.
  • 비슷한 사진 중에서 고를 때는 '진짜' 사람이 웃거나, 카메라를 보고 있는 사진을 쓰는 것이 좋다. 광고에 첨부된 사진처럼 보이는 모델은 피하는 것이 좋다.
  • 댓글 없음: