어떠한 물체가 보이거나 인정되지 않는다면, 그것은 간단한 존재하지 않는 것이다. 좀 더 직설적으로 말하자면, 링크가 링크로 인지되지 않으면, 대중들은 그것을 클릭하지 않을 것이고, 옵션이 누군가에 의해 인지되지 않으면, 그것은 존재하지 않는 것이라고 보면 된다.
가시성을 잃어버리게 되는 네 가지 경우
- 사람들이 찾는 곳에서 필요한 정보를 이용할 수 없을 때
- 필요한 정보가 다른 무언가에 의해 물리적으로 차단되어 있을 때
- 심지어 필요한 정보가 잘 보이는 곳에 있더라도 인식되지 않을 때
- 그냥 필요한 정보 자체가 존재하지 않을 때
사람들이 스크롤을 하고 있다!
대다수의 디자인팀은 사람들이 스크롤을 하지 않는다고 생각할 것이다. 하지만 1996년부터 이어져 온 연구 결과를 보면 ‘사람들은 분명히 스크롤을 한다!’ 대개 한 페이지에서 최소한 50% 정도를 스크롤한다.
접히는 부분을 정확히 보여줄 수 없는 이유
- 접히는 면의 위치는 브라우저 창의 크기에 따라 달라진다.
- 큰 스크린에서 브라우저 창을 최대화하면 어떠한 페이지든 많이 볼 수 있겠지만, 창을 작게 하면 그만큼 적게 보일 것이다. 그리고 스마트폰이나 넷북에서는 일반 컴퓨터 모니터의 크기보다 보이는 부분이 항상 작을 수밖에 없다.
- 새로운 툴바가 열릴 때마다 접히는 면은 점점 페이지의 위쪽으로 올라가게 된다.
- 툴바는 브라우저 창의 맨 위에 보이는 여러 가지 도움 되는 기능 아이콘들이 있는 줄이다. 여기서 인쇄하기나 저장하기 등 다양한 기능을 빠르게 수행할 수 있지만, 이 툴바가 많이 열려 있을수록 브라우저 창은 공간을 더욱 많이 차지하게 되며, 그에 따라 웹페이지는 더욱 아래 공간으로 밀릴 수밖에 없고, 이것이 접히는 면을 원래보다 위쪽에 오도록 만든다.
- 화면의 해상도가 낮을수록 접힌 면은 더 위쪽에 형성된다.
- 화면의 해상도는 브라우저 창에서 보이는 것을 엄청나게 바꿀 수 있다. 오늘날에는 표준 해상도가 1024X768 픽셀인 것이 일반적이지만, 시력이 좋지 않은 사람들은 해상도를 그보다 훨씬 낮게, 보통 800X600으로 설정하곤 한다. 이것이 브라우저 창에 표시되는 정보의 양을 줄이기도 한다.
접힌 면이 중요할 때
반드시 접힌 면에 있어야 할 것들
- 브랜딩과 메인 메뉴
- 고객센터의 연락처 정보
- 페이지 내 검색창
- 장바구니와 결제 링크
- 연락처 링크
- 언어 변경 기능
- 신속한 애플리케이션의 주요 입력창
- 주요 결과물 영역
페이지 가장 하단에 배치해도 문제가 없는 것들
- 법적 공지
- 개인정보 보호 정책
- 실제 주소와 전화번호
접힌 면이 중요하지 않을 때
- 접힌 면을 정확히 찾아내는 것은 불가능하다. 당신이 아무리 훌륭한 예상을 한다고 해도, 방문자의 약 10% 정도만 만족시킬 수 있을 것이다.
- 홈페이지는 ‘스크롤 친화적’으로 만들어야 한다. 그러면 페이지 윗부분에 가능한 한 많은 정보를 집어넣으려고 애쓰지 않아도 된다.
- 여러분은 자신의 광고를 접힌 면 위에 배치해야 한다고 주장 한느 광고업자들을 많이 만나게 될 것이다. 그러나 사실 만약 페이지가 스크롤하기 좋은 데다 흥미로운 콘텐츠를 제공한다면, 긴 페이지의 하단에 있는 광고는 실제로 상단의 비싼 배너광고만큼 좋거나 혹은 더 나인 클릭 효과를 낼 수 있다.
스크롤 친화적 페이지 제작하기
스크롤 친화적인 환경을 만드는 요령은 하나는 그래픽적으로 따분한 곳의 내용을 잘라내 버리는 것이다. 보통 웹페이지 아래쪽 가장자리가 깔끔해 보일수록 스크롤 친화력은 더 떨어지는 경향이 있다.
불친절한 스크롤 친화적 페이지
- 만약 화면에 어떠한 변화가 있다면 당신은 방문자들이 그것을 알아채기를 바랄 것이다. 하지만 이 변화가 ‘화면 바깥’, 즉 보이지 않는 곳에서 일어난다면 방문자들은 변화가 실제로 있었는지 알아챌 수 없을 것이므로 똑같은 정보를 계속 다시 제출했다가 포기하고 싶어질 것이다. 이는 내가 전에 언급했던 피드백 문제와 밀접한 연관이 있지만, 이 상황에서는 피드백이 없는 것은 아니다. 단지 피드백이 어디에 있는지 보이지 않을 뿐이다.
- 스크롤 친화적인 페이지가 구축되어 있다 하더라도, 당신은 방문자들이 필요 이상으로 스크롤하는 것은 원하지 않을 것이다. 제출 버튼이 화면에서 살짝 벗어나 있는 것 때문에 스크롤을 아주 조금씩 내려야 하는 것은 엄청나게 짜증 나는 일이다. 스크린이 작아질수록 점점 더 많은, 입력창, 출력 창 등이 아마도 페이지의 상단과 하단에서 모두 반복되어야 할 필요가 있다고 유추할 수 있다.
스크롤, 메뉴 길이 그리고 모바일 폰
만약 당신이 어떠한 이유로든 사용자가 스크롤을 하도록 만들기 위해서는, 확실한 시각적 단서를 제공하라! 만약 작은 스크린을 사용할 때 볼 수 있는 메뉴 항목의 수가 제한되어 있다면 특정 범주의 총 메뉴 항목 수를 스크롤하지 않고 화면에 표시할 수 있는 개수까지로 제한 한느 것이 좋다. 사용자들이 스크롤을 하지 않는 것이 아니라, 스크롤해야 한다는 사실을 몰라서 안 할 뿐이다.
중요한 것을 광고처럼 보이게 만들지 마라
광고업체들은 광고를 콘텐츠처럼 만들어 사람들이 이를 클릭하게 만드는 다양한 트릭들을 개발해왔다. 이런 것은 실제로 효과가 있다. 그러므로 그 반대의 효과도 가능하다는 사실에 놀라지 마라. 만약 사용자들이 당신의 콘텐츠를 읽고 사용하기를 원한다면, 그 콘텐츠를 광고나 상황별 메뉴, 또는 완전히 새롭고 전혀 원하지 않은 방향으로 내모는 것처럼 보이는 어떤 것으로 만들지 마라.
맛보기 서비스의 함정
사용성 비즈니스에서 성공하려면 당신 역시 고객들에게 그 가치를 보여줘야 한다. 그러니, 무언가 숨기려고 하지 마라.
깨달음을 주는 엘리베이터 조사
가시성이라는 주제를 다루면서 내가 가장 선호하는 방법은 낯선 건물에서 막 엘리베이터를 타고 올라가 어떤 층에서 내렸다고 가정해보는 것이다. 엘리베이터에서 내린 다음에는 무엇을 해야 할지 알아봐야 한다. 내가 필요한 정보가 눈에 보이는가? 내가 어디로 가야 할지 알려줄 표지판이나 어떤 다른 단서가 있는가?
건축가들은 물리적 환경에서 표지판을 만들 때 ‘길 찾기(wayfinding)’에 대해 이야기한다. 하지만 그 원리는 웹사이트, 레스토랑 메뉴 그리고 다른 수많은 것들에 적용할 때에도 마찬가지다. 핵심은 바로 가시성이다.
셜록, 에드워드, 도널드 노먼 그리고 기
정보에 관해서는 정보의 ‘해상도’를 줄이는 것에 의존하면 안 된다.
‘우리는 단순함을 갈망하는 동시에 복잡성 또한 필요하다’
찾아봐야 할 10가지 비가시적 사항들
- 당신의 제품 정보가 실제로 사용 불가능한 상태임에도 사용 가능하다는 신호를 보내지는 않은가? 아니면 당신이 사람들이 볼 수 없는 어딘가에 그것을 숨겼던 것은 아닌가?
- 무언가가 물리적으로 사용자의 정보에 대한 시야를 가리지 있지는 않은가? 팝업창? 물리적 장애물? 아니면 그 밖의 것? 일단 제거하라!
- 중요한 정보가 배너광고나 기타 관련성이 미심쩍은 그 밖의 무언가와 같이 무시해도 될 법한 것처럼 보이지 않는가?
- 당신은 사용자들이 어떤 종류의 작업을 완료하는 데 필요한 중요한 정보를 포함하는 것을 잊어버리지는 않았는가?
- 제품에 ‘접힘’ 속성이 있나? 만약 그렇다면 사용자가 필요로 하는 정보는 모두 접힌 면의 동일한 부분에 그룹화되어 있는가? 아니면 그 접힘 면이 이름과 주소, 입력과 출력 등을 따로 떨어뜨려 놓고 있지는 않은가? 또 주요 연락처 링크와 같이 중요한 것이 접힌 면 아래에 가려져 있지는 않은가?
- 화면상의 기다란 페이지는 사용자들이 스크롤을 하게끔 강력한 신호를 보내고 있는가?
- 인터넷에서 일정 금액을 지불해야 콘텐츠를 볼 수 있도록 한 것이 오히려 무료 콘텐츠에 대한 사용자 경험을 방해하고 있지는 않은가?
- 웹사이트에 있는 모든 페이지, 빌딩에 있는 모든 문 그리고 당신의 제품에 대한 새로운 시각과 전망은 ‘깨달음을 주는 엘리베이터 조사’에 나오는 요구사항을 충족시킬 수 있는가?
- 당신의 디자인팀이 제품을 더 나아지게 하려고 어수선함을 줄이고 있는가, 단지 더 예쁘게 만들려고 줄이고 있는가? 더 나아지는 게 더 낫다.
- 사용자가 업무를 수행하는 데 도움이 되는 일반적인 용어 대신 내부에서 또는 독점 브랜드 용어를 사용하고 있지는 않은가? 예를 들어, ‘보험 가입하기’ 대신에 ‘토털 유연성(Total Flexibility Plan)에 가입하기’라고 말하지는 않는가?
자료 출처: UX 불변의 법칙 — 에릭 리스