제품 방문 페이지: 모범 사례 및 예

우리는 이미 리드 생성 페이지에 대한 지난 기사에서 방문 주제를 밝히기 시작했습니다. 오늘 우리는 제품 랜딩 페이지에 대해 자세히 알아볼 것입니다. 즉, 구조에 대해 이야기하고, 디자인 및 카피를 만들기 위한 몇 가지 팁을 제공하고, 몇 가지 실제 사례를 살펴보겠습니다.

제품 랜딩 페이지란 무엇입니까?

짐작하셨겠지만 제품 방문 페이지는 제품이나 서비스를 홍보하고 판매하는 데 사용됩니다. 사용자는 이메일, 광고 또는 기타 디지털 소스의 링크를 따라가거나 검색 결과에서 리디렉션된 후 이 페이지로 이동할 수 있습니다.

임산부를 위한 옷을 판매한다고 상상해 보십시오. 구글에서 '임산부 의류 4개월'을 검색하는 사용자가 있습니다. 검색 결과에서 4개월 임산부를 위한 제품 전용 랜딩 페이지를 볼 수 있으며 페이지의 제목과 설명이 흥미롭다고 생각하면 클릭합니다. 그런 다음 귀하의 제안이 그들과 관련이 있는 경우 구매를 통해 전환합니다.

WordStream의 조사에 따르면 제품 방문 페이지의 평균 전환율은 2.35%입니다. 그러나 상위 25%의 페이지 전환율은 5.31%, 상위 10%의 페이지 전환율은 11.45%로 인상적입니다.

모든 방문 페이지는 전환 기회이므로 페이지가 많을수록 더 타겟팅할 수 있습니다. 그러나 비밀은 당신이 만드는 페이지의 수뿐만 아니라 당신이 그것을 만들고 디자인하고 사본을 작성하는 방식에 있습니다. 디자인과 카피에 대한 조언은 나중에 하겠지만 이제 제품 랜딩 페이지의 일반적인 구조가 어떻게 보일지 봅시다.

제품 방문 페이지의 구조

제품 방문 페이지는 각각 고유한 목적이 있는 다양한 블록으로 구성됩니다. 블록은 논리적인 순서로 하나씩 차례로 이동하여 마지막에 행동 촉구로 이어집니다. 로고 크기나 글꼴 색상과 같은 작은 세부 사항에 주의가 흐트러지지 않고 구조 자체에 집중할 수 있도록 랜딩 페이지의 개요를 한 블록씩 종이에 시작하는 것이 좋습니다.

Mango Languages의 예를 기반으로 좋은 제품 랜딩 페이지가 갖추어야 할 주요 블록을 살펴보겠습니다.

헤더

방문자가 페이지에서 가장 먼저 보는 것은 일반적으로 다음을 포함하는 헤더입니다.

• 로고;
• 메인 메뉴 버튼;
• 로그인 및 가입 버튼;
• 제목 및 설명;
• CTA;
• 배경 비디오, 사진 또는 제품 사진과 같은 시각적 요소를 지원합니다.

Mango Languages는 헤더에 이러한 모든 측면을 포함했습니다.

회사는 제공하는 서비스 유형을 설명하고 응용 프로그램을 시연하고 두 가지 유형의 작업 버튼을 추가했습니다. 하나는 등록용이고 다른 하나는 제품 동영상용입니다. 또한 헤더 상단에 특별 제안을 배치하여 신규 사용자가 더 저렴한 가격으로 앱을 사용해 볼 수 있도록 했습니다.

헤더 뒤에 있는 주요 아이디어는 제품에 대한 가장 중요한 정보를 즉시 제공하는 것입니다. 목표물을 명중하고 사람이 이 정보가 유용하다고 생각하면 자세한 내용을 보려면 스크롤합니다.

확실히 눈에 띄는 제목에는 제품이 고객에게 제공할 이점에 대한 설명과 행동 유도 문안이 포함되어야 하며 모두 2-3단어 문장으로 표현되어야 합니다. 설명에서 제목을 자세히 설명하고 사용자가 즉시 알아야 하는 중요한 세부 사항을 밝히는 몇 개의 짧은 문장을 작성할 수 있습니다.

제품 및 이점 상세 설명

방문자가 제품을 소개한 후에는 더 많은 정보를 제공해야 합니다. 설명에서는 고객 경험을 시작으로 고객의 불만 사항에 중점을 두어야 합니다. 귀하의 제품이 어떻게 작동하는지, 그리고 그것이 청중의 실제 또는 잠재적인 문제를 어떻게 해결할 수 있는지 보여주십시오. 그런 다음 보너스로 약간의 세부 사항을 추가하십시오. 사용자에게 반드시 큰 이득이 될 수는 없지만 주요 제품에 대한 훌륭한 보완책이 될 것입니다.

페이지를 통해 방문자의 눈을 안내하고 모든 중요한 포인트가 시각적으로 강조 표시되도록 하십시오.

보시다시피 Mango Languages는 큰 제목, 이미지 및 버튼을 사용하여 제공하는 언어의 수와 앱 작동 방식을 나타냅니다. 그 후 다양한 사람과 조직에서 앱을 사용할 수 있음을 보여주기 위해 별도의 시각적 블록을 추가하고 자세한 내용에 대한 링크를 제공했습니다.

사회적 증거

실제로 사용자의 15%는 리뷰가 없는 회사를 신뢰하지 않습니다. 오늘날 소셜 미디어와 온라인 상호 작용을 통해 사용자는 모든 제품에 대한 의견을 자유롭게 공유하고 이미 사용해 본 고객의 리뷰를 읽을 수 있다는 점을 고려하면 이해할 수 있습니다.

제품 방문 페이지에 고객 리뷰를 게시하는 방법에는 여러 가지가 있습니다.

• 익명의 텍스트 리뷰 추가
• 고객의 이름과 사진이 포함된 텍스트 리뷰 추가
• 비디오 평가를 추가합니다.

예를 들어 Mango Languages는 익명의 리뷰를 표시하기로 결정했습니다. 상당히 많은 양의 텍스트를 사용자가 쉽게 파악할 수 있도록 각 리뷰의 주요 아이디어를 상단에 굵게 표시했습니다. 방문자는 리뷰를 스크롤하여 더 많이 볼 수도 있습니다. 이는 방문 페이지의 공간을 절약하는 현명한 솔루션입니다.

행동을 요구하다

방문 페이지의 기본 사용자 대상은 클릭 유도문안 버튼입니다. 페이지 전체에서 CTA를 몇 번 반복하고 다른 CTA 버튼의 텍스트를 변경할 수도 있습니다. 그러면 어떤 옵션이 가장 효과적인지 추적할 수 있습니다.

Mango Languages는 클릭 유도문안을 두 번 반복했습니다. 첫 번째 "가입" 버튼은 머리글에 배치되었고 마지막 "언어 선택" 버튼은 방문 페이지의 바닥글 앞에 있어 동일한 등록 페이지로 연결되었습니다.

Mango Languages ​​앱은 인앱 구매와 함께 무료로 사용할 수 있습니다. 그러나 실제 제품을 판매하는 경우 방문 페이지에서 클릭 유도문안 버튼 근처에 제품 가격을 언급해야 합니다.

보행인

제품 방문 페이지의 마지막 부분은 바닥글입니다. 페이지에서 가장 "지루한" 요소처럼 보일 수 있지만 실제로는 메뉴, 소셜 미디어 링크, 이메일 구독 양식 및 기타 버튼과 같은 매우 중요한 정보가 포함되어 있습니다.

바닥글에서 Mango Languages는 머리글에 사용된 버튼의 내용을 부분적으로 반복하고 확장했습니다. 이를 통해 사용자는 회사에 대해 자세히 알아보고, 블로그 및 소셜 미디어 계정을 방문하고, 앱을 다운로드하고, 요약을 구독하고, 제품 자체에 대한 자세한 내용을 읽을 수 있습니다.

챗박스

일반적으로 제품 방문 페이지의 모든 블록 위에 배치되는 요소 중 하나는 채팅 상자입니다. 이를 통해 사용자는 제품에 대해 질문하고 즉시 답변과 지원을 받을 수 있습니다.

Mango Languages ​​제품 방문 페이지에서 오른쪽 하단 모서리에 파란색 메시지 아이콘처럼 보입니다.

클릭하면 사용자가 질문을 입력하고 파일을 보낼 수 있는 더 큰 채팅 창으로 펼쳐집니다.

랜딩 페이지에 채팅 상자를 추가할 때 저절로 펼쳐지지 않도록 하여 사용자의 주의를 산만하게 만듭니다.

제품 랜딩 페이지 디자인 및 카피를 위한 팁

사용할 블록을 결정하고 종이 한 장이라도 제품 랜딩 페이지의 기본 구조를 설정했다면 카피와 디자인으로 강화해야 합니다. 전환수로 측정되는 페이지의 성공은 제품을 얼마나 잘 제시하고 클릭 유도문안이 얼마나 효과적인지에 달려 있습니다.

제품 랜딩 페이지 디자인 및 카피를 최대한 활용하는 방법에 대한 짧지만 유용한 팁을 제공합니다.

제품 랜딩 페이지를 위한 5가지 기본 디자인 팁

Adobe에 따르면 사용자의 38%는 레이아웃이나 이미지에서 콘텐츠가 매력적이지 않으면 페이지를 닫을 것입니다. 이것이 랜딩 페이지를 디자인하는 방식에 세심한 주의를 기울여야 하는 좋은 이유입니다.

다음은 방문자의 시선을 사로잡는 데 도움이 되는 제품 방문 페이지 디자인에 대한 권장 사항 목록입니다.

1. 세부 사항에 집중하기 전에 가장 크고 가장 중요한 요소에 대해 생각하고 레이아웃 또는 페이지 구조를 만드는 것으로 시작하십시오.
2. 페이지 전체에 일관성을 주는 것이 중요합니다. 이를 위해 하나의 디자인과 색 구성표를 고수하십시오. 서로를 보완하는 색상을 선택하려면 색상 또는 재료 팔레트와 같은 색상 구성표 생성기를 사용해 보십시오. 하나 또는 두 가지 색상을 선택하여 작업 버튼을 강조 표시하고 배경에 중간 톤을 사용하고 텍스트가 다른 요소와 대조되도록 합니다.
3. 전환율을 80%까지 높일 수 있으므로 동영상을 추가하세요. 페이지의 특정 부분에 사용자의 관심을 끌고 더 오래 유지하려면 애니메이션을 사용합니다. 제품의 일부 비디오 리뷰를 배치하는 것에 대해 생각하십시오.
4. 휴대 전화에 대한 방문을 최적화하십시오. 모든 랜딩 페이지의 50%만이 모바일에 최적화되어 있으며, 이는 사용자의 82%가 휴대전화로 웹사이트를 방문한다는 점을 고려하면 좋은 결과가 아닙니다. 따라서 방문 페이지 디자인을 반응형으로 만드는 것을 잊지 마십시오.
5. 1초라도 지연되더라도 전환이 7% 감소할 수 있으므로 웹페이지가 빠르게 로드되는지 확인하세요.

제품 랜딩 페이지를 위한 5가지 기본 카피 팁

카피와 관련하여 당신의 목표는 가장 중요한 이점을 강조하여 매력적인 방식으로 제품을 제시하고 잠재 고객을 위한 강력한 클릭 유도문안을 만드는 것입니다.

다음은 변환하는 효과적인 사본을 작성하는 몇 가지 팁입니다.

1. 제품의 장점을 강조하고 방문자가 자신이 아니라 그들에게 관심을 갖도록 합니다.
2. Adobe Consumer Content Survey에 따르면 대부분의 소비자에게 좋은 웹 사이트의 가장 중요한 세 가지 특성은 정확성, 정보 제공 가치 및 단순성입니다. 따라서 요점을 정확히 파악하고 설명이나 불필요한 정보로 구독자를 압도하지 않는 짧은 헤드라인을 작성하십시오.
3. 사용자에게 조치를 취하도록 요청하고 가입, 구매 또는 연락을 위해 클릭할 위치를 알려줍니다. CTA 텍스트로 실험해 보세요. 때로는 너무 단순한 "여기를 클릭하십시오" 텍스트처럼 보이는 것도 전환율을 30%까지 향상시킬 수 있습니다. 사용자가 즉시 결정을 내리도록 동기를 부여하는 긴박감을 조성합니다.
4. 통계 및 숫자와 같은 특정 정보를 사용하여 요점을 증명하십시오. 예를 들어 사회적 증거를 추가하고 이미 제품을 사용하는 사람들의 수를 보여줄 수 있습니다. 예를 들어 실시간으로 업데이트되는 숫자와 같은 상호 작용을 추가하여 페이지에 재미있고 유익하며 효과적인 요소로 만드십시오.
5. 항상 문법과 맞춤법을 확인하십시오. 일부 사용자는 실수를 발견하면 방문 페이지에서 눈을 돌릴 수 있습니다.

마지막으로, 계속해서 새로운 판매를 가져올 완벽한 균형을 찾기 위해 사본과 디자인을 A/B 테스트하는 것을 잊지 마십시오. 최신 동향을 따르되, 동시에 항상 진정성을 유지하고 자신의 고유한 아이디어를 구현하십시오.

제품 방문 페이지 예시

무언가를 배우는 가장 좋은 방법은 다른 사람들이 그것을 어떻게 하는지 보는 것입니다. 몇 가지 제품 랜딩 페이지의 예를 살펴보고 다양한 회사에서 디자인과 카피를 사용하여 제품을 판매하는 방법을 살펴보겠습니다.

SquareUp의 첫 번째 예는 실제 제품을 판매하는 방법을 잘 보여줍니다.

이 방문 페이지 사본의 장점은 다음과 같습니다.

1. 텍스트는 첫 번째 문장의 요점으로 바로 연결됩니다.
2. 기능은 고객의 문제와 우려를 해결하는 능력을 통해 설명됩니다.
3. 사용된 단어는 단순하고 문장은 짧고 명확합니다.

이 랜딩 페이지 디자인의 장점은 다음과 같습니다.

1. 제품의 고퀄리티 사진이 잔뜩 있습니다.
2. 균형 잡힌 색상 팔레트가 사용되었으며 텍스트와 대조되는 선명한 배경이 있습니다.
3. 가장 중요한 정보는 굵게 또는 색상으로 강조 표시됩니다.

이제 더 인터랙티브한 예를 살펴보겠습니다.

Bellroy는 재미를 더하고 사용자가 최대 10장의 카드와 현금을 사용하여 기존 지갑과 새 Bellroy 지갑이 어떻게 생겼는지 확인할 수 있습니다. 방문자의 관심을 끌고 귀하의 제품이 탁월한 선택인 이유를 알게 하는 영리한 솔루션입니다.

이 랜딩 페이지 카피가 정말 좋은 이유:

1. 페이지는 대화형 헤더의 재미있는 클릭 유도문안으로 시작됩니다.
2. 텍스트가 거의 없으므로 제품에 대해 알아야 할 모든 것을 배우기에 충분합니다.
3. 섹션 유형, 넣을 수 있는 카드 수, 색상 및 가격과 함께 다양한 지갑에 대한 명확한 설명이 있습니다.

이번 랜딩페이지 디자인의 장점으로는

1. Bellroy 지갑이 왜 그렇게 얇은지에 대한 비디오 설명은 고사하고 방문 페이지의 모든 블록은 대화형입니다.
2. 제품의 클로즈업 이미지가 많이 있습니다.
3. 사용 가능한 모든 지갑은 지갑의 외부 및 내부 사진과 함께 랜딩 페이지에 표시됩니다.

마지막 예는 이전에 보여드린 모든 것과 다릅니다. 보다 개인적인 톤을 가지고 있으며 표준 제품 랜딩 페이지 구조에서 벗어나 캐릭터가 가득한 페이지를 만듭니다.

Marie Forleo는 랜딩 페이지를 일종의 명함으로 사용하는 자신의 쇼 진행자입니다. 그녀의 주요 제품은 오디오 교육이지만 페이지에서 Marie TV 쇼와 그녀의 자선 프로젝트를 홍보하기도 합니다.

이 페이지 사본의 장점은 다음과 같습니다.

1. 메시지는 개인 페이지나 소규모 회사 웹사이트의 분위기를 완벽하게 표현하는 개인적이고 따뜻하고 위안이 됩니다.
2. 헤더 텍스트가 이 방문 페이지의 내용을 실제로 나타내지는 않지만 호기심을 불러일으키고 방문자가 아래로 스크롤하도록 동기를 부여합니다.
3. 텍스트의 양과 문장의 길이는 앞의 예보다 더 컸지만, 이는 전체적인 랜딩 스타일에 완벽하게 어울립니다.

랜딩 페이지 디자인의 경우 여기에서 다음과 같은 장점을 찾을 수 있습니다.

1. 애니메이션은 페이지 전체에 걸쳐 여러 번 사용되어 보다 인터랙티브하고 재미있게 볼 수 있습니다.
2. 서예 타이포그래피는 매우 개인적이고 우아한 느낌을 주고 있으며, 랜딩 페이지의 각 블록의 독특한 디자인은 보는 사람이 내용을 쉽게 이해할 수 있도록 합니다.
3. 사진으로 뒷받침되는 유명인들의 명언이 많은데, 이는 대중들 사이에서 마리의 권위를 증명할 뿐이다.

이제 당신 차례입니다

권장 사항을 따르고 트렌드를 살펴보고 테스트하는 것을 잊지 마십시오! SendPulse의 다중 채널 마케팅 플랫폼은 제품 방문 페이지에 구독 양식을 추가하고, 메일링 리스트를 작성하고, 고품질 이메일을 발송하는 데 도움이 될 것입니다. 또한 디지털 마케팅 전략에 대한 전체적인 접근 방식을 취할 준비가 된 사용자에게 SMS, 웹 푸시 알림 및 Facebook 챗봇을 제공합니다.