올바른 구성 요소로 전문적인 랜딩 페이지를 디자인하는 방법
게시 됨: 2017-05-24금요일 밤이고 마침내 긴장을 풀고 소파에 발을 올릴 기회가 생겼습니다. 리모컨을 잡고 Netflix를 스크롤하여 영화를 찾습니다.
다음, 다음, 다음. 아, 이건 어때?!
그 영화를 중단하게 된 이유는 무엇입니까? 표지 이미지 맞죠? 아니면 이미지와 짝을 이루는 제목이었을까요? 물론, 설명(그리고 아마도 등급)은 볼 것인지 말 것인지에 대한 최종 결정을 유도할 것이지만, 영화의 이미지와 제목은 설명을 읽는 것을 귀찮게 할 만큼 충분히 빠져들게 한 것 같습니다.
첫인상이 중요 하기 때문 입니다.
그리고 Netflix에 관한 한, 또는 처음으로 사람들을 만날 때뿐만 아니라; 온라인 검색 행동에 관해서도 마찬가지입니다. 실제로 웹사이트의 첫인상은 1/20초만에 평가될 수 있으며 빠르게 공식화되는 첫인상은 94%가 디자인과 관련이 있습니다.
트윗하려면 클릭
따라서 전문적으로 디자인되고 시각적으로 매력적인 클릭 후 방문 페이지는 방문자에게 좋은 첫인상을 남기고 전환율을 크게 향상시킬 수 있습니다.
클릭 후 방문 페이지는 100% 전환율을 보장할 수 없습니다. 그러나 전문적인 클릭 후 방문 페이지 템플릿을 사용하여 페이지를 만들면 멋진 첫인상을 만들고 전환을 생성하며 궁극적으로 판매를 유도할 수 있습니다.
전문적인 클릭 후 방문 페이지란 무엇입니까?
전문적인 클릭 후 방문 페이지는 방문자가 제안으로 전환하도록 설득하는 요소를 사용하는 독립형 웹 페이지입니다. 제안에는 제품 구매, eBook 다운로드, 뉴스레터 등록 또는 웨비나 등록이 포함될 수 있습니다.
'프로페셔널'이라는 단어에는 특별한 의미와 '좋은 분위기'라는 느낌이 있습니다. 특히 클릭 후 방문 페이지와 관련하여 보면 알 수 있습니다.
완벽하게 최적화된 클릭 후 방문 페이지의 필수 요소에 대해 알아보기 전에 다음 클릭 후 방문 페이지를 간단히 살펴보세요.

그것이 당신에게 전문적으로 보입니까? 좋은 첫인상을 보여주고 생존 가이드를 다운로드하고 싶습니까?
첫인상은 "이거 맞나?" 방문자에게 가이드에 포함된 내용이나 가이드로부터 혜택을 받을 수 있는 방법을 알려주는 정보가 거의 없습니다.
이건 어때?

여기에는 헤드라인, 글머리 기호, 리드 캡처 양식 및 고객 평가와 같은 더 많은 클릭 후 방문 페이지 요소가 포함되어 있습니다. 그러나 모든 것이 공백 없이 꽉 차 있고 여러 개의 바닥글 링크가 포함되어 있기 때문에 여전히 전문적인 분위기가 나지 않습니까?
대조적으로 이 AppFolio 클릭 후 방문 페이지는 훨씬 더 나은 인상을 줍니다.

혜택 지향적 헤드라인, 최소한의 카피로 글머리 기호, 최적화된 형식, 충분한 공백 및 다수의 신뢰 신호가 포함되어 있는지 확인하시겠습니까? 이것은 전문적인 클릭 후 방문 페이지의 모습입니다.
클릭 후 방문 페이지 전환 프로세스는 모두 페이지로 트래픽을 생성하는 것으로 시작됩니다. 그러나 방문자의 관심을 끌고 클릭 후 방문 페이지를 더 많이 탐색한 후에는 어떻게 전환을 유도할 수 있습니까?
그것은 모두 그들의 머리 속으로 들어가 그들의 고충을 알고, 당신의 제품이나 서비스가 그들의 문제에 대한 최선의 해결책임을 확신시키는 데 달려 있습니다. 이를 위해 전문적인 클릭 후 방문 페이지를 구성하는 몇 가지 주요 구성요소가 있습니다.
전문적인 클릭 후 방문 페이지의 요소
인상적인 헤드라인
Netflix 영화의 제목이 관심을 불러일으키고 더 자세히 알고 싶게 만든 것처럼 클릭 후 방문 페이지의 헤드라인도 방문자에게 동일해야 합니다. 즉시 관심을 끌고 페이지를 더 많이 탐색하도록 유도해야 합니다.
그렇다면 좋은 첫인상을 확실히 남길 수 있는 효과적인 헤드라인을 만드는 방법은 무엇입니까?
클릭 후 방문 페이지에서 무엇을 홍보하든 다음과 같은 헤드라인이 중요합니다.
- 귀하의 광고와 관련이 있습니다. 어떤 유형의 광고가 잠재 고객을 페이지로 유도하든지 광고와 헤드라인 모두 메시지 일치를 사용해야 합니다.
- 선명도를 제공합니다. 모호할 여지를 남기지 않고 요점을 바로 파악하세요.
- 제안의 이점을 보여줍니다. 헤드라인은 항상 혜택 지향적이어야 하며 제안의 UVP를 강조하고 잠재 고객에게 전환을 통해 얻을 수 있는 것을 알려야 합니다.
- 공감을 보여줍니다. 대부분의 사람들은 감정적 의사결정자이기 때문에 어떤 종류의 감정을 불러일으키고 처음부터 문제에 공감하면 페이지를 계속 탐색하도록 격려할 것입니다.
- 방문자의 시선을 사로잡습니다. 헤드라인이 위에서 언급한 모든 것을 수행하도록 하려면 페이지에서 가장 크고 가장 주의를 끄는 텍스트여야 합니다.
다음은 위의 각 항목을 수행하는 Joint Chiropractic의 예입니다.

페이지(및 UVP)의 요점은 헤드라인에서 명확합니다. 허리 통증을 완화하도록 조정하십시오. 이것은 요통으로 고생하고 있는 사람들에게 공감을 제공하고 그들의 문제에 대한 해결책을 제공합니다. 또한 페이지에서 가장 큰 텍스트이고 흰색이 파란색 배경과 잘 대비되기 때문에 헤드라인을 놓칠 수 없습니다.
다음은 Therasoft의 최적화된 헤드라인의 또 다른 예입니다.

다시 말하지만 헤드라인이 커서 즉시 눈에 띕니다. 또한 명확하고 간단하여 Therasoft 소프트웨어를 구매할 때의 이점을 제공합니다(시간과 노력을 덜 들여 일정 관리, 문서화 및 청구에 도움).
읽을 수 있는 사본
사람들은 읽을 페이지가 아니므로 클릭 후 방문 페이지 사본으로 요점으로 바로 이동하십시오. 큰 텍스트 블록으로 그들을 압도하지 마십시오. 제안의 이점을 가능한 한 적은 단어로 전달하면 제안의 가치를 빠르고 쉽게 결정할 수 있습니다.
일반적으로 클릭 후 방문 페이지 사본은 다음과 같아야 합니다.
- 스키머블. 목록, 부제목, 글머리 기호, 굵은 글꼴 및 짧은 단락으로 중요한 정보를 강조 표시하여 방문자가 검색하거나 찾기 위해 힘을 들이지 않고도 원하는 내용을 쉽게 찾을 수 있도록 합니다.
- 이익 중심. 모든 제품 기능을 나열하는 대신 해당 기능의 이점을 제공하십시오. 잠재 고객은 제품이나 서비스가 문제를 해결하는 데 어떻게 도움이 되는지에 가장 관심이 있습니다.
- 고객 중심의. 방문자는 훑어볼 때 마치 귀하가 그들에게 직접 말하고 있는 것처럼 느껴야 합니다. "당신"과 "당신의"와 같은 단어를 사용하여 당신이 그들의 문제를 해결 하는 데 집중하고 있음을 보여주십시오.
- 단순한. 귀하의 사본은 업계 내부자만 이해할 수 있는 전문 용어 없이 방문자가 이해할 수 있는 기본적이어야 합니다.
- 읽기 쉬운. 귀하의 서체는 방문자가 쉽게 읽을 수 있어야 합니다. 너무 작거나 장식적인 글꼴은 피하십시오. 글꼴을 해독하기 어렵게 하거나 이해하려는 시도조차 하지 못하게 할 수 있기 때문입니다.
이 LegalZoom 클릭 후 방문 페이지는 헤드라인, 본문 카피 및 CTA 버튼에 1인칭을 사용하기 때문에 고객 중심 카피를 사용하는 좋은 예입니다.

최소한의 사본이 있고 LegalZoom의 이점이 글머리 기호 체크 표시로 강조 표시되어 방문자가 페이지를 빠르게 훑어보고 원하는 것을 찾을 수 있습니다. 글꼴은 읽기 쉽고 카피는 단순하므로 잠재 고객은 메시지를 읽고 이해하는 데 문제가 없어야 합니다.

매력적인 미디어
거의 항상 미디어는 텍스트보다 더 매력적이고 이해하기 쉽습니다. 따라서 확실하지 않은 경우 텍스트보다 미디어를 선택하십시오.
예를 들어, 히어로 샷은 방문자가 귀하의 제품이나 서비스가 문제를 해결했다면 어떤 모습일지 상상하는 데 도움이 될 수 있습니다. 반면에 제품 샷, gif 또는 설명 동영상은 새롭거나 복잡한 제품이 어떻게 작동하는지 보여주는 데 도움이 될 수 있습니다.
다시 Therasoft 클릭 후 방문 페이지로 돌아가 보겠습니다. 회사는 페이지 전체에 걸쳐 여러 제품 사진을 사용하여 다양한 제품 기능을 시연합니다.

비디오 평가는 소셜 증거에 대한 참여 수준을 높이고 시청자에게 더 사실적으로 보이도록 하는 또 다른 형태의 미디어입니다.
Bryan University는 클릭 후 방문 페이지에서 비디오 평가를 사용합니다. 그들은 또한 잠재 고객에게 미션 개요, 캠퍼스 미리보기 및 학생들에게 제공하는 주요 이점 중 일부를 강조하기 위해 소개 비디오를 추가했습니다.

최적화된 형태
리드 캡처 양식은 방문자 정보를 얻기 위한 티켓입니다. 다음은 완벽하게 최적화된 양식을 만들기 위한 몇 가지 기본 규칙입니다.
- 마찰이 없는지 확인하십시오. 잠재 고객에게 필수 정보만 요청하여 그들이 양식을 작성하는 것을 겁내거나 단념하지 마십시오. 잠재 고객에게 덜 요구할수록 전환 가능성이 높아집니다. 양식 필드의 양은 일반적으로 마케팅 유입경로에 있는 사람의 위치에 따라 다릅니다. 유입경로 아래로 내려갈수록 더 많은 정보를 요청할 수 있으며 그 반대의 경우도 마찬가지입니다.
- 단계적으로 정보를 요청하십시오. 제안에 많은 정보가 필요한 경우 가능한 한 많이 나누십시오. 잠재 고객은 길고 위협적인 양식보다 몇 가지 작은 양식을 작성할 가능성이 더 큽니다.
- 2단계 옵트인을 고려하십시오. 2단계 옵트인 양식은 양식을 제거하고 CTA 버튼만 포함하여 페이지를 단순화하는 데 도움이 됩니다. 방문자가 CTA 버튼을 클릭하면 팝업 상자에서 양식이 열립니다. 이렇게 하면 위협적인 형식의 가능성을 제거하는 데 도움이 되며 가장 관심 있는 잠재 고객만이 완료할 수 있습니다.
- 쉽게 완료할 수 있습니다. 필드를 논리적 순서로 구성하는 것과 함께 필드를 미리 채우는 것도 또 다른 효과적인 전술입니다. 잠재 고객이 과거에 다른 리소스를 요청하여 이미 일부 정보를 제공한 경우 해당 정보로 필드를 자동으로 채워 이 제안을 최대한 쉽게 전환할 수 있습니다.
- 페이지에 전략적으로 배치하십시오. 이것이 반드시 스크롤 없이 볼 수 있는 부분을 의미하지는 않습니다. 양식을 배치하는 위치는 제안에 따라 달라집니다. 일반적으로 제안이 비싸거나 복잡하거나 높은 참여가 필요한 경우 스크롤 없이 볼 수 있는 것이 더 좋습니다. 이렇게 하면 잠재 고객이 해당 제안에 익숙해지는 데 더 많은 시간이 걸리기 때문입니다.
이 Buildium 클릭 후 방문 페이지의 리드 캡처 양식은 잠재 고객이 스크롤할 때 함께 이동하므로 절대 놓치지 않고 전환할 준비가 되었을 때 필요한 노력이 줄어듭니다.

시선을 사로잡는 CTA
이것이 모든 것입니다. 잠재 고객이 귀하의 제안을 사용하도록 설득하는 마지막 단계이므로 페이지의 다른 모든 항목 중에서 눈에 띄어야 합니다.
다음 필수 구성요소를 고려하여 페이지에 가장 적합한 CTA 버튼을 만드세요.
- 위치. 양식과 마찬가지로 CTA 버튼을 너무 일찍 표시하면 전환이 줄어들 수 있습니다. 제안을 소개하고 설명한 후에만 제시해야 합니다. F-패턴 또는 Z-패턴을 따르도록 페이지를 디자인하면 버튼 주위에 공백을 사용하는 것처럼 CTA 버튼을 강조하는 데 도움이 될 수 있습니다.
- 크기. CTA 버튼은 방문자가 검색할 필요 없이 눈에 띄고 주의를 끌 수 있을 만큼 커야 합니다. 너무 작게 만들면 완전히 놓칠 수 있습니다.
- 색상. CTA 버튼이 최대한의 관심을 끌도록 하는 또 다른 방법은 페이지의 나머지 부분과 대비되는 색상으로 디자인하는 것입니다. 색상환을 사용하면 페이지에서 CTA 버튼을 "튀게" 만드는 색조, 색조, 음영 및 톤을 선택할 수 있습니다.
- 복사. 너무 자주 마케터는 "제출", "다운로드", "가입" 또는 "구독"과 같은 문구를 작성합니다. 그 단어들은 남용될 뿐만 아니라 지루하고 모호합니다. 사람들이 귀하의 제안에 따라 전환하도록 설득하려면 귀하의 사본은 설득력 있고 매력적이어야 합니다. 즉, 설명적이고 개인화되고 1인칭으로 작성되어야 합니다.
Lauren Clark Law가 CTA 버튼을 최적화한 방법을 살펴보세요.

버튼은 스크롤 없이 볼 수 있는 부분 아래에 있고 방문자가 볼 수 있을 만큼 충분히 크며 파란색과 흰색과 대조되며 개인화된 문구("my")와 유인("무료")을 사용하여 방문자가 클릭하도록 유도합니다.
신뢰 지표
잠재 고객이 귀하의 제안으로 전환하려면 먼저 귀하의 브랜드를 신뢰할 수 있어야 하므로 신뢰 지표를 통합하는 것이 중요합니다. 신뢰 지표는 다양한 방식으로 제공되며 가장 일반적인 방법은 다음과 같습니다.
- 통계적 증거. 귀하의 제품이나 서비스가 잠재 고객의 문제를 해결할 수 있음을 뒷받침하는 숫자가 있으면 헤드라인, 부제목 또는 카피에 표시하십시오.
- 고객 평가. 현재 또는 이전 고객의 긍정적인 경험을 공유하는 것은 가장 강력한 신뢰 지표 중 하나입니다. 고객 평가를 표시할 때 최대한 많은 정보(성명, 직위, 비즈니스 및 얼굴 사진)를 제공해야 신뢰도가 가장 높아집니다.
- 권위 배지. 여기에는 고객 로고, 다른 웹사이트의 상 등이 포함됩니다. 예를 들어, 알아볼 수 있고 신뢰할 수 있는 회사의 로고를 표시하면 잠재 고객은 "와, 이 회사는 다른 유명 회사를 모두 도왔습니다! 나도 그들과 거래해야겠어!"
- 개인 정보 정책. 개인 정보 보호 정책 링크는 잠재 고객에게 정보 공유 방법/여부를 알려주기 때문에 클릭 후 방문 페이지에서 허용되는 몇 안 되는 이탈 링크 중 하나입니다. 이 링크의 가장 일반적인 위치는 리드 캡처 양식 아래 또는 바닥글에 있습니다.
- 타사 씰. Paypal, Verisign 및 McAfee와 같은 타사 씰은 잠재 고객에게 정보가 손상되지 않고 안전하게 보관될 것임을 알려줍니다.
SpareHire는 고객 평가와 회사 배지를 사용하여 제안에 대한 신뢰를 더합니다.

그러나 약간의 개선이 필요할 수 있습니다. 평가에 포함된 세부 정보가 많지 않습니다. 이름, 비즈니스 정보 및 얼굴 사진이 모두 누락되었습니다. 그들은 또한 5개 대신 4.5개만 받은 리뷰도 포함했습니다. 이것은 잠재 고객이 별 5개를 잃기 위해 무엇을 했는지 궁금해하게 만들 수 있습니다.
Financial Engines는 신뢰 지표로 훨씬 더 나은 작업을 수행합니다.

여기서 주요 차이점은 Financial Engines가 평가에 성명, 직함 및 얼굴 사진을 추가하여 신뢰성을 크게 높인다는 것입니다. 그들은 또한 2016년에 잘 알려진 회사 로고와 InvestmentNews의 수상 배지를 포함하여 여러 권위 배지를 전시했습니다.
지금 전문적인 클릭 후 방문 페이지를 만드십시오.
전문적이지 않은 클릭 후 방문 페이지와 전문적인 클릭 후 방문 페이지의 차이는 전환 가능성을 높이거나 낮출 수 있습니다. 비전문적인 클릭 후 방문 페이지에 만족하고 평생 고객을 놓칩니다.
이 문서의 청사진을 사용하고 다른 예를 통해 최고의 첫인상을 만들고 더 많은 전환을 생성하십시오.
클릭 후 방문 페이지를 전문적으로 만들기 시작하고 지금 Instapage Enterprise 데모에 등록하십시오.
