랜딩 페이지 이면: 전환을 높이는 사용자 경험 원칙

게시 됨: 2017-06-01

어제 마케팅 캠페인으로 인해 마우스가 거의 부러질 뻔했습니다.

어떻게?

나를 실망시켜 거의 방을 가로질러 던졌다.

마침내 진정된 후, 나는 내 분노에서 배울 가치 있는 마케팅 교훈이 있다는 것을 깨달았습니다. 그리고 여기 그것이 무엇인지 ...

사용성은 클릭 후 방문 페이지에서 최우선 순위여야 합니다.

이렇게 된 것입니다. 막바지 호텔이 필요했기 때문에 Google 검색 창에 "오늘 밤 보스턴 호텔"을 입력했습니다.

결국 유료 검색 광고를 클릭한 후 HotelTonight에서 위치별 클릭 후 방문 페이지에 도달했습니다. 스크롤 없이 볼 수 있는 부분은 다음과 같습니다.

사용자 경험 원칙 호텔 투나잇

그 페이지에서 내 눈은 시각적 계층 구조에서 가장 주의를 끄는 요소인 페이지에서 가장 큰 텍스트인 "보스턴의 막바지 호텔 거래"에 즉시 매료되었습니다.

아래를 보니 가격이 좀 올랐네요. 그런 다음 아래로 스크롤하여 더 많은 목록을 찾았습니다. 내가 본 것은 다음과 같습니다.

사용자 경험 원칙 호텔 투나잇 보스턴

호텔은 있었지만 가격이나 가용성에 대한 지표는 없었습니다. 그래서 더 자세한 정보를 얻으려면 하나를 선택해야 한다고 생각했습니다. 사치스러운 것은 필요하지 않아 "미드타운 호텔" 목록의 제목을 클릭하여 자세히 알아봤습니다.

...하지만 아무 일도 일어나지 않았습니다.

"다시 해보자."라고 생각한 후 그 아래에 있는 "No-frills Back Bay base"라는 자막을 클릭했습니다.

…아직…아무것도.

"'기본' 레이블을 클릭하면 어떻게 되나요?"

아무것도.

“이 목록이 깨졌을 수도 있습니다. Wyndham Boston Beacon Hill을 클릭하면 어떻게 되나요?”

다시, 아무것도.

그 시점에서 나는 화가 나서 페이지 전체를 미친 듯이 클릭했습니다. 다음 생각으로 나는 큰 소리로 말했습니다.

이 페이지를 사용하기가 왜 그렇게 어려웠습니까?

사용성은 클릭 후 방문 페이지에서 최우선 순위가 되어야 합니다.

트윗하려면 클릭

사용자 경험을 위한 디자인의 중요성

미학적으로 이 페이지에는 눈에 띄게 잘못된 것이 없었습니다. 스크롤 없이 볼 수 있는 목록 아래로 나를 끌어들일 만큼 충분히 신뢰할 수 있는 것처럼 보였습니다.

그러나 웹 디자인에는 사물을 아름답게 보이게 하는 것 이상의 것이 있습니다. 페이지의 "사용성"은 사용자 관점에서 해당 기능을 수행하는 데 얼마나 효과적인지를 설명합니다. Don't Make Me Think의 저자 Steve Krug에 따르면:

[사용성]은 실제로 무언가가 잘 작동하는지 확인하는 것을 의미합니다. 평균적인 능력과 경험을 가진 사람이 절망적으로 좌절하지 않고 의도된 목적을 위해 웹사이트, 토스터, 회전문 등을 사용할 수 있다는 것입니다.

불행히도 온라인(HotelTonight 클릭 후 방문 페이지)과 오프라인 모두에서 많은 디자인이 사용자에게 최적화되어 있지 않습니다. "밀어내는" 문을 당겨 본 적이 있다면 나쁜 UX 디자인을 경험한 것입니다.

스스로 바보라고 생각하는 대신 디자이너가 "밀기" 도어에 "당기기" 손잡이를 설치하기로 선택한 이유가 궁금해야 합니다.

네가 아니야; 그것은 디자인입니다.

사용성이 좋지 않은 다른 예가 많이 있습니다. 각각에 대해 설명하는 대신 사용자 인터페이스가 청중을 염두에 두고 작성되지 않으면 사용자 경험이 좋지 않을 수 있다고 안전하게 말할 수 있습니다.

온라인에서 그 열악한 경험은 웹사이트에 치명적인 결과를 초래할 수 있습니다. 웹 사용성의 아버지, Jakob Nielsen:

웹사이트가 사용하기 어렵다면 사람들은 떠나게 됩니다. 홈페이지에 회사가 제공하는 것과 사용자가 사이트에서 할 수 있는 것을 명확하게 명시하지 않으면 사람들이 떠납니다. 사용자는 웹사이트에서 길을 잃으면 떠납니다. 웹사이트의 정보가 읽기 어렵거나 사용자의 주요 질문에 대답하지 않으면 사이트를 떠납니다. 여기에 패턴이 있습니까? 사용자가 웹 사이트 매뉴얼을 읽거나 인터페이스를 파악하는 데 많은 시간을 소비하는 것과 같은 것은 없습니다. 사용할 수 있는 다른 웹사이트가 많이 있습니다. 이탈은 사용자가 어려움을 겪을 때 첫 번째 방어선입니다.

디자인 과정에서 클릭 후 방문 페이지 작성자는 종종 자신의 목표가 자신의 기술을 보여주는 것이 아님을 잊습니다. 대신, 다른 사람이 목표를 달성하도록 돕는 것입니다.

대체로 그 목표는 클릭 후 방문 페이지에서 제안을 평가하고 가능한 경우 이를 주장하는 것입니다. 특히 디자인을 시작하기 전에 다음과 같은 질문을 스스로에게 던져야 합니다.

  • 클릭 후 방문 페이지(가입, 다운로드, 구매 유도 등)에 대한 나의 목표는 무엇입니까?
  • 청중이 도달한 구체적인 목표는 무엇입니까?
  • 내 제안을 가능한 한 쉽게 평가하려면 무엇이 필요합니까?
  • 그들이 내 제안을 쉽게 청구할 수 있도록 하려면 어떻게 해야 합니까?

이에 대한 답을 얻으려면 대상 고객에 대한 포괄적인 지식, 클릭 후 방문 페이지 사용성 모범 사례에 대한 아이디어, 설득력 있는 클릭 후 방문 페이지를 만드는 데 대한 통찰력의 세 가지가 필요합니다.

첫 번째는 여기에서 개발 방법을 배울 수 있습니다. 두 번째는 이 블로그 게시물에서 찾을 수 있습니다. 세 번째로, 새로운 Instapage 리소스에서 찾을 수 있습니다: 설득력 있는 클릭 후 방문 페이지 구축을 위한 궁극적인 가이드:

사용자 경험 원칙 전자책

클릭 후 방문 페이지 사용성 원칙

모든 비즈니스는 고유하고 모든 제안은 다르지만 우수한 사용자 경험을 제공하는 기본 사항은 동일합니다. 최적의 사용자 경험을 위해 클릭 후 방문 페이지를 디자인할 때 다음 5C를 염두에 두십시오.

일관성

클릭 후 랜딩 페이지를 구축하는 동안 경쟁에서 눈에 띄기 위해 디자인 규칙에서 벗어나고 싶은 유혹을 받을 것입니다. 여기에서 당신이해서는 안되는 이유가 있습니다 ...

웹을 재발명하려고 하지 마십시오.

인터넷의 초기 단계에서 디자이너가 기발한 레이아웃과 요소를 실험하는 것을 보는 것은 드문 일이 아닙니다. 다음 보석을 살펴보십시오.

사용자 경험 원칙 Microsoft

그 당시에는 웹이 어떻게 사용될지 완전히 명확하지 않았습니다. 그래서 옆에 있는 "FAQ" 버튼과 공간 배경은 창의적인 아이디어처럼 보였습니다.

그러나 오늘날에는 더 이상 이와 같은 웹 페이지를 볼 수 없습니다. 우리가 배운 디자인 규칙을 위반하면 사용자 경험이 저하될 수 있기 때문입니다. 공간 배경은 주의를 산만하게 하고 옆으로 텍스트는 읽기가 불필요하게 어렵습니다.

그렇기 때문에 웹의 모양과 느낌을 재창조하려는 시도가 아니라 명확한 USP로 눈에 띄는 데 집중해야 합니다. 버튼은 별이나 정지 신호가 아닌 버튼처럼 보여야 합니다. 로고는 페이지의 오른쪽 하단이 아니라 왼쪽 상단에 위치해야 합니다.

일관성 은 사용성에 가장 크게 기여하는 요소 중 하나입니다. 방문자가 페이지의 요소를 인식하고 이해할 수 있도록 하려면 방문자에게 친숙한 요소, 즉 웹의 다른 모든 곳에서 볼 수 있는 요소를 사용해야 합니다.

HotelTonight의 클릭 후 방문 페이지에 대한 실망스러운 경험으로 다시 돌아가 보겠습니다. 클릭하면 특정 목록에 대한 자세한 정보를 얻을 수 있다고 생각했습니다. 거의 모든 호텔의 클릭 후 방문 페이지가 작동하는 방식이기 때문입니다. 목록을 클릭하면 해당 목록에 대해 자세히 알아볼 수 있습니다.

그러나 이것은 그렇게 작동하지 않았습니다. 호텔 클릭 후 방문 페이지가 작동하는 방식에 대한 내 기대를 충족시키지 못했고 그 결과 실망스러운 사용자 경험을 받았습니다.

여기서 교훈?

방문자가 볼 것으로 예상되는 위치에 요소를 배치합니다. 잠재 고객이 기대하는 방식으로 디자인하십시오. 귀엽지 마. 일관성을 유지하십시오.

일치하는 메시지가 반드시 있어야 합니다.

클릭 후 방문 페이지 디자이너가 잊어버리기 쉬운 또 다른 사항은 다음과 같습니다. 클릭 후 방문 페이지는 브랜드에 대한 방문자의 첫인상이 아니라 참조자입니다. 그렇기 때문에 클릭 후 방문 페이지는 광고, 이메일 또는 유료 검색 결과에서 제공하는 약속을 이행해야 합니다. Smashing Magazine의 공동 창립자인 Vitaly Friedman에 따르면 그렇지 않은 경우 다음과 같은 일이 발생합니다.

대부분의 사용자는 흥미롭고(또는 유용한) 클릭할 수 있는 것을 검색합니다. 유망한 후보자가 발견되자마자 사용자는 클릭합니다. 새 페이지가 사용자의 기대에 맞지 않으면 뒤로 버튼을 클릭하고 검색 프로세스를 계속합니다.

완벽한 메시지 일치를 위해 클릭 후 랜딩 페이지의 단어, 로고, 색상까지도 리퍼러와 일치 해야 합니다. 이 디자인 모범 사례를 무시하면 페이지가 순식간에 중단됩니다.

명쾌함

명확성과 일관성은 관련이 있습니다. 사람들은 디자인 요소를 인식하면 그것이 어떻게 기능하는지에 대한 아이디어를 갖게 됩니다. 그 디자인 요소도 명확하다면 그 목적에 대해 의문의 여지가 없습니다. 방문자가 페이지의 모든 항목을 쉽게 이해하고 사용할 수 있도록 하는 방법은 다음과 같습니다.

이해를 위해 사본을 작성해야 합니다.

글을 쓰는 사람과 읽는 사람 모두에게 단어는 어렵습니다. 카피라이터는 제안에 대해 이미 모든 것을 알고 있는데도 제안을 명확하게 설명해야 하는 어려움에 직면해 있습니다. 그리고 독자들은 현재 제안에 대해 아무 것도 모르는 상황에서 제안을 이해하려고 노력하는 똑같이 어려운 위치에 놓이게 됩니다. 종합적인 카피 작성에 대한 몇 가지 팁:

  • 높은 수준의 기술 지식을 가진 청중을 대상으로 글을 작성하지 않는 한 모든 전문 용어를 제거하고 잠재 고객이 6학년 수준에서 읽을 것이라고 가정합니다.
  • 제안의 이점을 강조하십시오. "doodads" 및 "thingamawhats"와 같은 제품 기능은 설득력이 없습니다. 대신 사람들에게 이러한 기능으로 무엇을 할 수 있는지 알려주십시오.
  • 모호한 단어를 교체하십시오. 어떤 사람들에게 "품질"이라는 단어는 "고품질"을 의미합니다. 다른 사람들에게는 "만족"을 의미합니다. 더 나은 설명을 사용하여 제안의 가치를 전달하십시오.

전환해야 하는 이유를 이해할 수 없다면 잠재 고객이 전환할 가능성이 없습니다.

CTA 버튼은 방문자에게 클릭 시 수행되는 작업을 알려야 합니다.

인식할 수 있는 버튼을 만들었다면 이미 절반의 승리를 거둔 것입니다. 나머지 절반은 방문자가 버튼을 클릭하면 어떻게 되는지 알려주는 것입니다. 이를 위해 귀하의 제안을 고려하십시오.

방문자로부터 지불을 요구하지 않는 경우 다음과 같이 자문하여 매력적인 CTA를 선택하십시오.

클릭 후 방문 페이지 디자인에 대한 전자책의 경우 "내 전자책 보내기"를 클릭 유도문안으로 사용하거나 "디자인 전문가로 만들기"와 같이 보다 구체적인 것을 고려하십시오. 다음은 Amy Porterfield의 예입니다.

사용자 경험 원칙 CTA 버튼

반면에 신용 카드 번호가 필요한 경우 위와 같은 설명적인 제목을 피하고 대신 "구매" 또는 "기부"와 같은 노골적인 기본적인 제목을 사용하는 것이 가장 좋습니다. 마지막으로 원하는 것은 "디자인 전문가로 만들기" 버튼을 눌렀을 때 카드 요금이 청구될지 몰랐던 쇠갈퀴를 휘두르는 수많은 고객입니다.

양식 레이블 및 피드백은 설명적이어야 합니다.

양식을 작성하려면 방문자가 원하는 것이 무엇인지 정확히 알아야 합니다. 이 팁이 상식처럼 보일 수 있지만 여전히 따르지 않는 양식이 많이 있습니다.

  • 사라지는 자리 표시자 텍스트를 레이블로 사용하지 마십시오. 잠재 고객을 혼란스럽게 만들고 기억에 도전하는 것으로 나타났습니다. 대신 레이블은 해당 필드 위에 있어야 합니다.
  • 레이블은 해당하는 양식 필드에 가장 가깝게 위치해야 합니다. 모호한 공백 또는 다른 필드와의 등거리 간격은 잠재 고객이 제출해야 하는 정보에 대해 질문하게 만들 수 있습니다.
  • 항목은 특수 문자가 포함된 8자여야 합니까? 양식에서 별표를 처리할 수 없습니까? 필드에 특정 입력이 필요한 경우 레이블은 방문자에게 알려야 합니다.
  • 오류 메시지는 주의를 끌 수 있고 설명적이어야 합니다. 빨간색만 사용하는 것이 아니라 굵은 텍스트 및 잘못된 필드 주변의 윤곽선과 같이 입력 문제를 나타내는 여러 신호를 사용합니다. 두 번째로 고칠 수 있도록 그들이 어떤 실수를 저질렀는지 확인하십시오.
  • 선택 필드와 필수 필드를 명확하게 구분하십시오.

귀하의 제안은 이해하기 쉬워야 합니다.

왜 사람들은 신용 카드로 더 많이 지출합니까? 현금을 쓰는 것이 더 현실적으로 느껴 지기 때문 입니다.

카드를 긁을 때 돈은 손을 교환하지 않습니다. 청구 내역은 나중에 은행 명세서에 표시되지 않습니다. 계정 잔액을 확인하지 않으면 거의 구매가 발생하지 않은 것과 같습니다.

ING 직원을 대상으로 한 금융 교육 세션에서 실시한 연구 실험을 생각해 보십시오. 두 그룹의 참가자에게 다음과 같은 질문을 했습니다.

  1. 그들이 401k 계획에 등록한다면.
  2. 정기적으로 저축할 의사가 있는 금액.

첫 번째 그룹에는 이러한 질문만 제시되었습니다. 그러나 두 번째 그룹에게는 추가 지시가 주어졌습니다. 더 많이 저축하면 일어날 모든 긍정적인 일을 상상해 보십시오.

그 결과 그룹 2에서 등록이 20% 증가하고 사람들이 저축할 금액이 4% 증가했습니다.

이는 클릭 후 방문 페이지 제안에 무엇을 의미합니까?

사람들이 그 가치를 이해하기를 바란다면 그 가치를 명확하게 설명하는 방식으로 그것을 제시해야 합니다. 그리고 많은 경우, 그것은 텍스트 대신 시각 자료를 사용하는 것을 의미합니다.

일부 제안의 경우 인포그래픽이 가장 잘 작동합니다. 다른 사람들에게는 설명 동영상이나 영웅 사진이 더 효과적일 것입니다.

당신이 선택하는 것은 청중과 제안에 달려 있습니다. 말하는 대신 보여주고 제품이나 서비스가 가장 잘 팔리는 것을 발견할 때까지 테스트하십시오.

간결

페이지를 디자인할 때 기억해야 할 가장 중요한 것은 가장 일반적으로 무시되는 것일 수도 있습니다. 시간과 관심이 거의 없는 사람들을 위해 디자인하고 있다는 것입니다.

아무도 재미를 위해 클릭 후 방문 페이지를 탐색하지 않습니다. 그들은 이메일에 있는 광고나 링크를 클릭했으며 귀하의 제안이 주장할 가치가 있는지 가능한 한 빨리 알고 싶어합니다. 그 의미는…

텍스트는 스키밍에 최적화되어야 합니다.

Krug는 그의 책에서 "각 페이지에 있는 단어의 절반을 없애고 남은 단어의 절반을 제거합니다."라고 말합니다. 클릭 후 방문 페이지 사본의 50%를 잘라낸 후에는 사람들이 읽는 것을 좋아하지 않기 때문에 나머지 부분을 훑어볼 수 있도록 만드는 것이 중요합니다 .

푹신한 부사와 스톡 문구를 제거하여 장황한 표현을 최소화하십시오. 글머리 기호와 부제목을 사용하여 위협적인 텍스트 블록을 분해하십시오. 굵게 및 기울임꼴과 같은 효과를 추가하여 중요한 단어를 눈에 띄게 만듭니다.

시각적 계층 구조는 중요성을 전달해야 합니다.

페이지 콘텐츠가 정렬되고 조작되는 방식은 방문자가 보는 것과 놓친 것과 많은 관련이 있습니다. HotelTonight 클릭 후 방문 페이지에서 클릭 유도문안을 놓쳤지만 "보스턴의 막바지 호텔 거래"라는 제목을 보았습니다.

왜요?

그 크기가 스크롤 없이 볼 수 있는 부분에서 가장 주목을 끄는 요소가 되기 때문입니다. 사용자에게 시간이 거의 없을 때(항상) 배치, 색상, 크기 등과 같은 시각적 신호를 사용하여 페이지에서 중요한 것이 무엇인지 결정합니다. 방법에 대한 몇 가지 예:

  • 더 크다 = 더 중요하다
  • 더 높은 배치 = 더 중요
  • 더 큰 대비 = 더 중요

여기에서 시각적 계층 구조를 사용하여 방문자를 CTA 버튼으로 안내하는 방법에 대해 자세히 알아보세요.

양식은 가능한 한 짧고 작성하기 쉬워야 합니다.

이름과 이메일에서 역할과 예산에 이르기까지 클릭 후 방문 페이지 양식에 모든 종류의 잠재 고객 정보를 캡처하고 싶을 것입니다. 그러나 그 모든 정보가 절대적으로 필요하지 않은 경우 요청해서는 안 됩니다.

최고의 리드 생성은 잠재 고객을 검증하는 데 필요한 최소한의 정보를 알고 있는 마케팅 팀에 의해 달성됩니다. 어떤 사람들에게는 세 개의 필드에 해당하는 정보가 될 것입니다. 다른 사람들에게는 10이 될 것입니다.

양식의 길이에 관계없이 작성하는 데 어려움이 없도록 해야 합니다. 방문자가 클릭 한 번으로 소셜 자동 완성 기능을 사용하여 정보를 제출하고 동일한 입력으로 일반적으로 답변되는 필드를 미리 채우도록 허용합니다(예: "국가"를 캡처하고 대부분의 잠재 고객이 미국 출신이라는 것을 알고 있는 경우 "미국"은 좋은 관행입니다).

또한 관련 필드(예: 도시, 주 및 우편 번호)가 아닌 경우 방문자의 하향 모멘텀을 방해하지 않도록 단일 열 레이아웃으로 필드를 표시합니다. 그런 다음 서로 옆에 배치하면 방문자가 개념적으로 이해하는 데 도움이 될 뿐만 아니라 양식의 인지되는 길이를 줄일 수 있습니다.

방해 요소를 제거해야 합니다.

제안을 간결하게 제시하는 것의 일부는 전환율을 떨어뜨릴 가능성이 있는 주변의 다른 모든 요소를 ​​제거하는 것입니다. 즉, 제거...

  • 탐색 메뉴
  • 로고의 홈페이지 링크
  • 다른 제안을 광고하는 경쟁 클릭 유도문안
  • 바닥글의 아웃바운드 링크

웹 페이지를 클릭할 수 있는 옵션이 너무 많으면 힉스의 법칙(Hick's Law)이라는 원칙이 적용됩니다. Miles Soegaard는 Interaction Design Foundation 블로그에서 다음과 같이 명확하게 설명합니다.

힉스의 법칙은 사용자에게 더 많은 선택을 제시할수록 결정에 도달하는 데 더 오래 걸린다는 간단한 아이디어입니다.

사용자 경험 원칙 Hick의 법칙

그러나 연구원 Sheena Iyengar는 선택 과부하가 결정을 내리는 데 걸리는 시간을 늘리는 것 이상을 할 수 있다는 것을 발견했습니다.

구체적으로 한 실험에서 그녀와 동료 Mark Lepper는 식료품점에 진열대를 설치하여 샘플을 채취한 사람들에게 잼 한 병을 1달러 할인했습니다. 첫날, 그들은 쇼핑객들에게 24가지 다른 종류의 스프레드를 제공했습니다. 둘째 날에는 6개만 제공했습니다.

실험의 결론에서 그들은 큰 디스플레이가 더 많은 관심을 끌었지만 매출은 10배 더 적었다는 것을 발견했습니다.

또한 사람들에게 더 많은 옵션이 제공될 때 그녀는 다음과 같은 가능성이 더 높다는 것을 발견했습니다.

  • 자신의 이익에 반하더라도 선택을 미루다
  • 더 나쁜 선택을 하다
  • 객관적으로 더 잘 수행하더라도 덜 만족스럽게 만드는 것을 선택하십시오.

TED Talk에서 그녀는 구체적으로 다음과 같이 말했습니다.

사실, 우리가 점점 더 많은 것을 보고 있는 것은 당신이 기꺼이 삭감할 의향이 있다면 — 그러한 관련 없는 중복 옵션을 제거하십시오 — 음, 매출이 증가하고 있습니다. 비용 절감이 있습니다. 선택 경험이 향상되었습니다.

선택 최적화와 관련된 다른 놀라운 정보를 보려면 아래 전체를 시청하십시오.

믿을 수 있음

신뢰도는 일반 웹 페이지보다 클릭 후 방문 페이지에서 훨씬 더 큰 역할을 합니다. 클릭 후 방문 페이지는 방문자가 개인 정보 및 경우에 따라 금전을 처리하도록 특별히 설계되었습니다. 즉, 그들이 당신을 신뢰하도록 해야 합니다. 방법은 다음과 같습니다.

디자인을 통해 권한을 전달해야 합니다.

누군가의 권위를 평가할 때 심리학자 Robert Cialdini는 우리가 구체적으로 세 가지를 찾을 것을 제안합니다.

  • 직위 – 박사, 교수, 박사, 사장, 설립자, CEO, 업계 전문가
  • 복장 : 군복, 양복, 의상(군복, 고가의 양복, 실험복)
  • 장식: 특정 역할과 함께 제공되는 액세서리(예: 경찰 배지, 종교, 묵주, 멋진 자동차 등)

그러나 온라인에서 비즈니스를 운영하는 사람들에 대한 사진이나 지식이 없으면 잠재 고객은 이러한 정보를 찾을 수 없습니다. 대신, 그들은 당신의 디자인을 평가할 것입니다.

귀하의 페이지가 2002년에 웹 디자인을 담당하는 인턴이 만든 것처럼 보인다면 권위 있는 것으로 보이지 않을 것입니다. 예를 들어, 이것은 헝거 게임의 베스트셀러 작가인 수잔 콜린스의 웹사이트처럼 보입니까?

사용자 경험 원칙 빈약한 웹사이트 디자인

그럴 수 없겠죠?

그럴 수 있고 실제로 그렇습니다.

연구에 따르면 온라인에서 첫인상의 94%는 주로 디자인과 관련이 있으며 4%만이 웹사이트의 실제 콘텐츠와 관련이 있습니다. 웹 페이지가 사용자가 기대하는 방식과 느낌을 갖도록 하십시오.

신용 배지는 눈에 띄게 표시되어야 합니다.

권위는 그 부분을 보는 것이지만 신뢰는 당신이 능력이 있음을 증명합니다. 가능하면 다음을 최대한 많이 보여주세요.

  • 수상한 모든 상
  • 귀하가 출연한 저명한 출판물 또는 프로그램
  • 당신이 가진 경험
  • 믿을 수 있는 기업과의 파트너십
  • 행복한 고객님들의 후기

다음은 HomeBay의 훌륭한 예입니다.

사용자 경험 원칙 신뢰 배지

신뢰성 지표를 사용하는 것은 당신이 당신이 말하는 만큼의 자격이 있음을 증명하는 간단한 방법입니다. 사람들에게 말하고 있기 때문에 당신은 그들이 아무것도를 설득하지 않습니다 표시하지 않고 최선이야.

편의

사용자가 액세스 가능성이 높은 페이지를 기대하고 검색 트래픽의 주요 소스가 그렇지 않은 페이지에 불이익을 주는 세상에서는 적응 또는 실패라는 단 하나의 옵션만 있습니다.

귀하의 페이지가 편의상 이러한 규칙을 따르지 않으면 이탈률이 급증합니다.

페이지가 빠르게 로드되어야 합니다.

Google의 데이터에 따르면 로드하는 데 3초 이상 걸리면 사용자의 53%가 페이지를 포기합니다. 그리고 거기에서 바운스 확률이 훨씬 높아집니다.

사용자 경험 원칙 페이지 속도

평균 22초의 모바일 클릭 후 방문 페이지 로드를 고려하면 데이터에 문제가 있습니다. 다음 팁을 따르면 대부분의 방문자를 잃지 마십시오.

  • 페이지 요소를 최소화합니다. Google에 따르면 테스트한 페이지의 70%는 1MB 이상, 36%는 2MB, 12%는 4MB 이상이었습니다. 빠른 3G 연결을 통해 1.49MB를 로드하는 데 약 7초가 걸립니다. 원인은 페이지 요소(이미지, 헤드라인, 버튼 등)가 너무 많기 때문입니다.
  • 성과 예산을 만드십시오. 페이지가 얼마나 빨리 로드되기를 원하는지 결정하십시오(일명 "예산"). 해당 예산에서 이를 충족하기 위해 페이지에 포함할 수 있는 요소를 결정합니다.
  • 이미지를 줄이십시오. 파비콘, 로고 및 제품 이미지는 페이지 크기의 ⅔에 쉽게 기여할 수 있습니다. 전환율이 높은 페이지에는 이미지가 38% 적게 포함됩니다.
  • JavaScript를 덜 사용하십시오. JS는 HTML 코드의 구문 분석을 중단하여 방문자에게 클릭 후 방문 페이지가 표시되는 속도를 늦춥니다. AMP 및 광고용 AMP와 같은 프로그램은 개발자에게 자바스크립트 없이 페이지를 빌드할 수 있는 프레임워크를 제공하여 페이지가 거의 즉시 로드되도록 합니다.

클릭 후 방문 페이지의 속도를 높이는 방법에 대한 추가 팁은 이 게시물을 읽어보세요.

접근성 범위가 우선되어야 합니다.

당연한 이야기지만 어쨌든 상기시켜 드리겠습니다. 사람들이 선택한 기기에서 귀하의 페이지에 액세스할 수 없으면 페이지를 전혀 사용하지 않을 것입니다. 확대/축소하기 위해 핀치하지 않으며 클릭 유도문안 버튼을 더듬지 않습니다.

페이지는 반응형으로 디자인되어야 합니다. 즉, 모든 기기의 화면에 맞게 조정되어야 합니다. 그리고 모든 요소는 사용하기 쉬워야 합니다.

필드가 너무 작으면 엄지손가락으로 양식을 채우는 것이 고통스럽습니다. CTA 버튼의 면적이 손가락 패드만큼 크지 않으면 누르기가 어렵습니다. 데스크톱은 더 이상 인터넷의 제1의 트래픽 소스가 아닙니다. 따라서 모바일용 페이지를 아직 최적화하지 않았다면 지금 해야 합니다.

사용자 경험은 페이지마다 다릅니다.

색상과 모양에서 단어와 레이아웃에 이르기까지 수많은 클릭 후 방문 페이지 디자인 요소는 사람들이 클릭 후 방문 페이지를 경험하는 방식에 영향을 미칩니다.

전환율에 미치는 영향을 확인하는 가장 좋은 방법은 사람들이 페이지에서 구체적으로 어떻게 행동하는지 테스트하는 것입니다. 그리고 기억하십시오. 방문자가 오늘 귀하의 페이지를 사용하는 방식이 내일은 페이지를 사용하는 방식이 아닐 수도 있습니다. 따라서 테스트를 중단하지 마십시오.

클릭 후 방문 페이지 사용자 경험을 쉽게 테스트하고 최적화하려면 지금 Instapage Enterprise 데모에 등록하십시오.