접힌면의 의미: 페이지 접힌면은 왜 아직도 문제인가

에이미 셰이드 2015년 2월 1일

요약: 페이지 상단에 나타나는 것 vs. 숨겨진 것은 UX에 항상 영향을 준다--스크린 크기에 상관없이. 윗면 vs. 아랫면을 사용자들이 어떻게 다루는 지에 대한 평균적인 차이는 84%이다.

스크린 크기는 끊임없이 변화하고 디자인은 이 크기들에 반응한다, 끊임없는 크기에 맞기보다. 그래서 고객, 디자이너, 개발자나 마케팅 담당자가 "접힌면 위"에 있는 컨텐츠에 대하여 이야기할 때--그 용어는 인쇄한 신문에서 빌려온 용어로 웹페이지를 스크롤하지 않은 상태에서 참고할 방법으로 사용된다--최근에도 접힌면이 이치에 맞을까?

그렇다, 접힌면은 여전히 존재하고 여전히 적용된다. 정확한 위치에 접힌면이 있더라도 기기들 마다 차이가 있다. 접힌면은 한 화면에 단 하나의 사용자가 존재한다. 기술적인 관점에선, 가장 일반적인 기기 크기들을 위한 접힌면은 웹 트래픽을 살펴보고 기기와 브라우저 통계에 있다고 밝혀낼 수 있다. 반응형 디자인은 2개, 3개, 4개 그 이상의 다른 접힌면을 가지는데, 최적화된 디자인은 기기와 스크린 크기에 구체적이다. 목표가 된 기기들은 제각각 고려해야 할 접힌면을 가지고 있다.

하지만 접힌면은 치수보다 컨셉이라고 본다. 접힌면은 페이지 상단에 문제들이 나타나기 때문에 문제가 된다. 사용자들은 스크롤을 하지만, 접힌면의 위에 있어야만, 충분히 볼 가능성이 있다. 어떤 동작이 필요하지 않아도 페이지에서 보이는 것은 우리가 스크롤하도록 격려한다. 이것은 어떤 스크린 크기에서도 현실이다. 모바일, 태블릿이나 데스크탑에도 해당한다: 숨겨져 있는 무엇이든지, 사용자는 밝혀내야 할 것을 귀찮다고 여긴다.

여기에 상호작용 비용의 단순한 문제가 있다:

- 추가적인 동작 없이도 보임 (예, 접힌면 위에 있는) = 다시 보려면 낮은 상호작용 비용이 든다

- 보이지 않고 보이게 하려면 동작이 필요함 (예, 접힌면 아래에 있는) = 높은 상호작용 비용, 정신적 노력으로 추측하려고 구성된 어떤것은 숨겨져있고, 컨텐츠를 밝혀내려고 긍정적인 결정을 하게 하고있다. 그리고 컨텐츠를 보려면 정신적인 노력이 드는 일이 필요하다 (예, 페이지를 스크롤하기).

우리는 페이지로 가서, 쓸모없고 상관없는 컨텐츠를 보지 않는다. 그리고 이런 유용함은 보이지 않는 부분을 스크롤해서 숨겨진 화면 5개를 내리게 하도록 기대한다. 페이지 상단에서 우리가 찾은 것은 스크롤을 계속하고, 다른 페이지나 다른 사이트로 이동하거나, 함께한 작업을 망치도록 결정하게 우리를 도와준다. 이것은 긴 페이지가 페이지 상단에 있는 표지판에게서 이익을 얻을 수 있는 이유이다. 링크나 컨텐츠를 통해서 다음에 무엇이 오는지 사용자들에게 보여준다.

스크린이 점점 작아지면서, 우리는 필요 이상으로 강제로 스크롤을 더 해야했다. 작은 모바일 스크린의 상단에 작은게 나타날 때, 우리는 더 아래를 본다. 하지만 우리는 스크롤을 좋아하기 때문에 그렇게 하지 않는다. 우리는 접힌면 아래에 가치있는 더 많은 정보가 예상되기 때문에 그렇게 한다.

스크롤을 격려하라

웹페이지들은 확실한 이야기를 지을 필요가 있다. 사용자들은 좋은 이유를 줘서 스크롤을 하도록 격려받을 수 있다. 시각적인 요소들은 페이지에서 시선을 내리도록 할 수 있다. 정말 흥미로운 컨텐츠는 사용자들을 끌어당길 수 있다. 만약 가장 흥미로운 정보가 페이지의 상단에 있다면, 사용자들은 역시 페이지의 하단을 방문하도록 유도될 수 있다.

어떤 크기의 페이지라도 상단에 적은 컨텐츠를 제공할 때, 사용자들이 페이지에서 사용 가능한게 무엇인지 알기 어렵다. 매력적인 페이지를 만들지도 모르지만, 스크롤하는 사용자들이 좌절하는 비용이 들게된다. 그런 디자인들은 사용자들이 컨텐츠를 전부 다 봤다고 생각하도록 "가짜 바닥"을 만들 수 있다.

[modnotebooks_homepage.png]

모드 노트북의 사이트는 화면에 꽉차는 이미지와 동영상으로 가는 링크로 시작한다. 컨텐츠가 아래에 있다는 유일한 시각적인 암시는 화살표인데, 가짜 바닥을 깨려고 시도하고 있다. 디자인들은 사용자들에게 스크롤하라고 말할 필요가 없다.

[modnotebooks_scroll.png]

반면, 일단 사용자가 스크롤을 시작하면, 모드 노트북 사이트는 더 이동하도록 격려하는 것을 잘해낸다. 사이트는 앵커에 기반한 네비게이션 옵션들을 제공해서 사용자들이 흥미로운 주제로 넘어가게 돕는다. 여러가지 화면 크기에서, 텍스트와 이미지들은 페이지 전체에 걸쳐있는데, 사용자들을 더 많은 정보로 이끌고 있다. 컨텐츠는 잘 조직되었고 제품에 대한 이야기는 잘 지어져 있어서, 독자가 계속 스크롤하도록 격려한다.

사용자들이 가치있는 정보를 보는데 실패할 때, 그들은 스크롤을 멈춘다. 사용성 테스트에서, 특이한 사용자들은 페이지를 접하기 전에 무엇이 있는지 추측하기 위해 스크롤을 한다. 하지만 이것은 기본적인 행동과는 거리가 멀다. 사용자들은 이유가 있을 때만 스크롤한다.

컨텐츠에 접근할 필요가 있는 사용자들은 스크롤이 추가적인 동작이기 때문에 접힌면이 항상 문제가 된다. 페이지를 불러오기 위해 기다리거나, 캐러셀을 전환하거나, 텍스트를 보려고 아코디언을 열거나, 스크롤하는 것은 목표를 완수하기 위해 사용자들이 해야할 여러 단계를 추가한다.

솔깃한 사용자들이 스크롤하는 동안 페이지 상단에 아주 작게 성공적으로 제공하는 확실한 디자인들이 있다. 성공적인 디자인들은 추가적인 노력을 격려한다--그것들은 흥미로운 컨텐츠, 주목하게 하는 도입부, 매력적인 이미지를 제공한다. 주목하게 하는 성공적인 긴 페이지들을 만든 디자이너들은 접힌면을 주의한다. 그들은 사용자들이 탐험하도록 격려할 페이지를 어떻게 만드는지 안다, 길찾기를 포기하기 보다. 그들은 사용자들이 페이지를 내리도록 하는 페이지, 컨텐츠에 우선순위를 매겨서, 추가적인 노력을 성공하게 만든다.

접힌면의 영향력에 대한 증거

인터페이스 디자인의 딜레마로, 양쪽 방법은 논쟁을 가져오는게 일반적이며, 가장 강한 논쟁을 추정하려고 UX팀이 필요하다. 이 경우에는, 이론이 대단히 명백하다: 상호작용 비용은 접힌면이 위 아래에 있는지에 따라서 상당히 다르다. 그러니 이 두가지 부분은 사용자들이 다르게 다룰 것이다.

여전히, 이론을 지지하는 경험적인 데이터가 있을 때는 좋다. 그리고 페이지 접힌면의 경우에 그 증거가 풍부하게 사용 가능하다. 우리는 질적인 사용성 연구에서 수많은 사용자들을 관찰했는데 그들의 행동이 접힌면에 영향을 받는 것을 알아냈다. -- 웹사이트들은 접힌면 위에 알맞게 컨텐츠의 우선순위를 매기지 않았기 때문에, 종종 악화된다. 사용자들은 그들에게 필요하거나 더 안좋은 정보를 찾기 전에 스크롤을 멈추는데, 접힌면 아래에 더 많은 정보가 있다는 것을 깨닫지 못했다.

여기에 양적인 증거도 있다: 57,453건의 고정된 시선추적 분석에 의하면, 우리는 페이지가 접힌 위치에서 사용자의 관심이 극적으로 멈췄다는 것을 발견했다. 접힌면 위에 있는 요소들은 접힌면 아래에 있는 요소들보다 더 잘보인다: 접힌면 위의 100픽셀은 접힌면 아래의 100픽셀보다 102% 더 잘 본다.

우리의 연구에서 아래의 히트맵은 모든 사이트에 적용된다 (검색 엔진과 검색 페이지는 제외한다). 접힌면 아래에 있는 컨텐츠도 가끔 볼지도 모르지만, 접힌면 위에 있는 컨텐츠만큼은 아니다.

[aggregate-heatmap-all-non-search-pageviews_1.png]

전체적인 히트맵은 광범위한 페이지들에 걸쳐 57,453건의 시선추적을 실시함을 보여주는데, 검색 엔진과 검색 페이지는 제외한다. 붉은 표시는 사용자들이 가장 많이 본 곳이다; 노란색은 사용자들이 조금 본 곳이다. 흰색 구역은 사실상 전혀 보지않았다. 연구에서 상단의 검은색 줄무늬는 접힌 페이지를 가리킨다; 그 다음에 오는 검은색 줄무늬들은 각각 스크롤한 후에 나오는 추가적인 스크린을 나타낸다.

두번째 데이터 집합은 엄청난 수의 웹사이트들에 결쳐 광고를 표시한 것에 대한 구글의 최근 분석이다. 이 연구는 어떻게 광고를 볼 수 있었는지 살펴보았고, 가시성은 광고의 픽셀중에 50%가 1초마다 한 화면에 있다고 정의했다. 접힌면 위에 있는 광고들은 73%의 가시성을 가졌고, 반면에 접힌면 아래에 있는 광고들은 44%의 가시성을 가졌다. 구글 연구에서, 66% 접혔다면 하락이 일어난다. 접힌면 아래에 있는 광고들과 비교해서, 접힌면 위에 있는 광고들은 훨씬 잘 보이기 떄문이다.

왜 구글은 우리가 102%로 측정했을 때 접힌면의 영향을 66%로 측정했을까? 이 설명은 도입한 두가지 다른 측정에 대해서 거짓말을 하고있다. 구글은 광고가 화면에 표시되는 여부에 따라서 측정한다. 그래서 사용자들은 그것을 볼지도 모른다. 만약 그들이 특정 지점을 살펴보려고 시도했다면. 우리는 화면에서 사람들이 실제로 보는 곳과 그들이 살펴보는데 얼마나 많은 시간을 소비하는지 측정했다.

두가지 양적인 연구들은 사용자 경험에서 접힌면의 영향이 약간 다른 평가를 내놓았다. 하지만 양쪽 수는 크다: 우리는 접힌면 위아래에 관한 정보 사이에서 5%의 차이나 10%의 차이를 말하지 않는다. 그 차이는 66%-102%의 순서에 있다. 만약 당신이 우리의 가장 현재 추정치로 한가지 숫자를 원한다면, 이 범위의 중간 지점을 살펴보자: 84%는 접힌면의 위아래에 있는 정보를 사용자들이 어떻게 다루느냐에 따라서 평균적으로 다르다. 정말 거대하다. 접힌면을 믿자. 여기서, 사용자 경험은 그 지점에서 급격하게 변화한다.

사용자들은 재미로 스크롤하지 않는다. 그들은 약속을 위해 스크롤한다. 그러니 접힌면에 대해 말하고 있다면, 페이지 처음에 오는 것에 대하여 초점을 맞추고, 대화를 계속하자.

출처: 닐슨 노먼 그룹