CTA를 디자인할 때 피해야 할 6가지 실수
마지막 업데이트 2023년 12월 11 일 월요일
CTA는 사소한 요소처럼 보일 수 있지만 전환율의 성패를 좌우할 수 있습니다. 잘 배치되고 잘 표현된 CTA는 웹사이트 방문자와 고객 사이의 가교 역할을 할 수 있습니다. 이 요소가 없으면 수많은 전환을 놓칠 수 있습니다.
오늘 이 글에서는 CTA 디자인에서 가장 흔한 실수를 살펴보고 이를 개선하는 방법을 알아보겠습니다.
실수 #1: 오디언스를 이해하지 못함
오디언스를 이해하는 것은 모든 마케팅 또는 시장 진출 전략의 초석이며, CTA도 예외는 아닙니다. CTA를 통해 전달하는 메시지가 이탈과 전환을 결정짓는 요소가 될 수 있습니다.
'여기를 클릭하세요' 또는 '자세히 알아보기'와 같이 광범위하고 일반적인 CTA는 사용자가 행동을 취해야 하는 맥락이나 이유를 제공하지 않습니다. 반면에 "지금 무료 전자책 받기" 또는 "30일 평가판 시작"과 같이 보다 효과적이고 대상에 맞춤화된 CTA는 사용자에게 가치나 혜택을 명확하게 전달합니다. 또한 HubSpot의 연구에 따르면 개인화된 CTA는 기본 버전보다 202% 더 나은 성과를 거두었습니다.
출처: HubSpot
아래의 콘텐츠 예약 웹사이트 예시인 Recurpost를 살펴보세요. 이 플랫폼은 웹페이지 CTA를 '예약된 게시물'에서 '지금 틱톡 게시물 예약하기'로 조정하는 것만으로 전환율을 10%에서 25%로 높일 수 있었습니다.
출처: Recurpost
또한 수정된 CTA는 Recurpost가 TikTok 예약을 지원한다는 사실을 사용자에게 명확하게 보여주며, 일반적인 '예약된 게시물'로는 명확하지 않았을 수 있습니다. 이렇게 명확하게 표시하면 방문자가 플랫폼의 기능을 빠르게 이해할 수 있어 이탈률을 줄일 수 있습니다.
세일즈 이메일 하단에 포함된 CTA도 마찬가지입니다. 잠재 고객에게 적합하지 않으면 전환율이 크게 떨어질 수 있습니다.
실수 #2: 시각적 계층 구조 간과
웹 디자인에서 시각적 계층 구조는 우리의 눈이 보는 것을 인식하는 순서를 결정합니다. CTA의 경우, 이 계층 구조는 가장 중요한 액션이 시각적으로 가장 눈에 잘 띄도록 하는 데 중요합니다.
색상부터 모양까지 CTA의 모든 측면은 잠재고객의 관심을 끄는 데 중요한 역할을 합니다. 예를 들어 색 상은 감정을 불러일으키고 행동을 유도합니다. 우리 모두는 각기 다른 색상에 대해 직관적인 연상을 가지고 있습니다. 녹색이 긍정성을 전달하고 빨간색은 긴급함을 상징하는 것처럼 말입니다. 이는 수행 가능한 웹사이트 사례에서 매우 효과적임이 입증되었습니다.
출처: HubSpot
이 웹사이트는 CTA 버튼을 녹색에서 빨간색으로 변경한 후 전환율이 21%나 증가했습니다.
크기와 눈에 잘 띄는 것도 CTA의 눈에 띄는 정도를 결정합니다. CTA가 너무 크면 압도적일 수 있고, 너무 작으면 눈에 띄지 않을 위험이 있습니다. 따라서 핵심은 웹페이지의 다른 중요한 콘텐츠를 가리지 않으면서도 CTA가 눈에 띄도록 하는 것입니다.
실제 사용자 모니터링 도구를 사용하여 방문자가 CTA와 상호 작용하는 방식을 시각적으로 모니터링할 수도 있습니다.
실수 #3: 잘못된 CTA 배치
CTA 배치는 놓칠 수 없으면서도 부담스럽지 않게 배치하는 것이 중요합니다. 많은 전문가들은 '접힌 부분 위' 영역을 CTA를 가장 잘 배치하는 위치로 꼽습니다. 스크롤 위는 방문자가 스크롤하지 않고도 볼 수 있는 웹페이지의 일부입니다. 데이터에 따르면 이 영역의 콘텐츠가 사용자의 시선을 사로잡는 비율은 무려 80%에 달한다고 합니다.
'접힌 부분 위'가 좋은 위치이긴 하지만, CTA는 다른 위치에도 잘 어울릴 수 있습니다. 때로는 유익한 콘텐츠의 마지막에 배치하거나 시의적절한 팝업으로 소개하는 것이 그보다 더 효과적일 수도 있습니다.
이에 대한 좋은 예는 Content Verve의 Michael Aagaard의 사례입니다. 그는 긴 B2C 랜딩 페이지 하단에 CTA를 배치하는 실험을 통해 전환율이 무려 304%나 급증하는 놀라운 결과를 얻었습니다!
출처: CXL
하지만 다른 디자인 요소에 가려져 페이지 하단에 숨겨져 있는 CTA는 기회를 놓칠 수 있다는 점을 기억하세요. 방문자가 CTA를 쉽게 찾지 못하면 원하는 행동을 취하지 못해 잠재적인 전환을 놓칠 수 있습니다.
요컨대, CTA의 최적 배치를 고려할 때 만능의 접근 방식은 없지만, 잠재고객의 행동을 이해하고 다양한 배치를 테스트하면 CTA의 최적 지점을 찾을 수 있습니다.
실수 #4: 너무 많은 CTA로 과부하 발생
선택의 폭이 넓은 것은 좋은 일입니다. 하지만 너무 많으면? 마비될 수 있습니다. '선택 과부하'라고 하는 이 현상은 웹사이트에 너무 많은 CTA가 표시되면 방문자를 멈춰 서게 만들 수 있습니다. 방문자는 결정을 내리지 못하고 어떤 행동도 취하지 않을 가능성이 높아집니다.
웹사이트의 주요 목표는 명확해야 합니다. 웹사이트에서 가능한 모든 행동을 포괄하기 위해 여러 개의 CTA를 삽입하고 싶을 수도 있지만, 최종 목표에 부합하는 하나의 주요 행동으로 방문자를 전략적으로 유도하는 것이 좋습니다.
예를 들어 잘 알려진 두 브랜드의 웹사이트를 생각해 보세요: 넷플릭스와 훌루.
넷플릭스의 홈페이지를 처음 방문하면 무엇을 하길 원하는지 명확하게 알 수 있습니다: "시작하기" 이 기본 CTA를 강조하는 미니멀한 디자인으로 방문자가 다음 단계를 쉽게 이해할 수 있습니다.
출처: Netflix
랜딩 페이지로 스크롤을 내려가도 하나의 사용자 행동에 최적화되어 있습니다: 시작하기.
출처: Netflix
이제 Hulu 웹사이트를 살펴보겠습니다. Hulu는 Live TV와의 파트너십을 포함하여 다양한 요금제, 번들 및 애드온을 제공합니다. 이러한 서비스는 사용자에게 선택권을 제공하지 만, 처음 방문한 방문자에게는 홈페이지가 압도적일 수 있습니다. '둘 다 받기', '세 가지 모두 받기', 'Hulu에만 가입하기' 또는 'Hulu + Live TV 받기'와 같은 여러 CTA가 표시됩니다.
출처: Hulu
이러한 옵션은 다양한 사용자 선호도를 충족시키지만, 그 수가 너무 많으면 원하는 것이 무엇인지 잘 모르는 사용자에게는 의사 결정 마비로 이어질 수 있습니다.
따라서 방문자가 취하기를 원하는 주요 행동에 집중하세요. CTA는 적을수록 좋습니다. 비즈니스 오퍼링으로 인해 여러 개의 CTA가 필요하더라도 사용자에게 부담을 주지 않는 방식으로 디자인하세요. 기본 CTA를 선두에 배치하고 보조 CTA는 혼란을 일으키지 않고 그 뒤를 따르도록 하세요.
실수 #5: 모바일 사용자를 소홀히 함
디지털 시대에는 이동 중에도 검색하는 것이 일반화되었습니다. 현재 웹 트래픽의 55% 이상이 스마트폰에서 발생하고 있기 때문에 모바일 최적화를 간과하면 기회를 놓칠 수 있습니다.
핵심은 모바일 사용자는 웹사이트를 다르게 경험한다는 것입니다. 화면이 작아지고 터치 기반 탐색이 가능해짐에 따라 CTA는 명확하고 탭하기 쉬우며 실수로 클릭하지 않도록 배치되어야 합니다.
반응형 웹사이트 디자인은 필수입니다. 방문자가 사용하는 기기에 관계없이 레이아웃부터 이미지까지 모든 것이 깔끔하게 조정되도록 보장합니다. 그리고 속도가 가장 중요합니다. 모바일 사용자는 빠른 로딩 시간을 기대하므로 이미지를 압축하고 속도 향상 기술을 사용하여 웹사이트가 최고 수준인지 확인하세요.
항상 다양한 기기에서 CTA를 테스트하여 결함을 찾아내어 모든 방문자가 원활한 경험을 할 수 있도록 하세요.
실수 #6: 테스트 및 반복 실패
사용자 행동과 선호도는 시간이 지남에 따라 계속 진화합니다. CTA도 마찬가지입니다. 작년이나 심지어 지난달에 효과가 좋았다고 해서 현재에도 효과가 있다고 보장할 수는 없습니다. 따라서 지속적인 성공을 위한 만트라는 테스트하고, 배우고, 반복하는 것입니다.
두 가지 버전의 CTA(또는 모든 웹페이지 요소)를 서로 비교하여 어떤 것이 더 효과적인지 확인하는 A/B 테스트는 이러한 측면에서 강력한 도구입니다. 이는 오디언스의 공감을 이끌어내는 요소에 대한 경험적 증거를 제공하므로 추측을 배제할 수 있습니다.
언바운스처럼 항상 다양한 CTA에 대해 A/B 및 CTA 테스트를 수행하여 어떤 것이 가장 실적이 좋은지 확인해야 합니다. Unbounce는 사람들이 요금제를 선택하고 가입하기를 원하는 랜딩 페이지를 만들었습니다. 처음에는 기본 '요금제 선택' CTA 버튼이 상단에 있었고, 클릭하면 부드럽게 아래로 스크롤되어 페이지 하단에 가격 옵션과 CTA가 표시되었습니다.
출처: Unbounce
더 잘할 수 있다고 생각한 Unbounce는 새로운 레이아웃을 시도했습니다. 가입 CTA 버튼을 가격 세부 정보 바로 위의 위치로 이동하여 사용자가 상단 버튼을 클릭한 직후에 더 잘 보이도록 했습니다. 이 작은 변화로 인해 이 웹사이트는 기존 CTA 디자인에 비해 가입자가 41% 증가했습니다.
균형: 긴급성 대 압박감(보너스 포인트)
매력적인 CTA는 강압적인 전략을 사용하지 않고도 사용자의 관심을 사로잡고 행동으로 유도합니다. '한정 혜택' 또는 '독점 거래'와 같은 문구는 사용자의 흥미를 유발할 수 있지만 현명하게 사용해야 합니다.
목표는 적절한 균형을 맞추고 항상 사용자의 입장에서 생각하는 것입니다. 압박감을 느끼지 않고 행동하도록 동기를 부여할 수 있는 것이 무엇인지 생각해 보세요. 정기적으로 사용자의 피드백을 구하고 웹사이트 분석을 모니터링하면 CTA가 어떻게 인식되는지에 대한 귀중한 인사이트를 얻을 수 있습니다.
글로벌 이커머스 기업인 아마존을 생각해 보세요. 아마존은 희소성을 전달하고 사용자가 즉시 행동하도록 동기를 부여하기 위해 "재고가 X개만 남았습니다"라는 문구를 자주 사용합니다.
출처: Ryanhogue
하지만 강압적으로 느껴지지 않는 방식으로, 그리고 구매에 대한 강한 압박감을 주지 않는 방식으로 이를 수행합니다. 이러한 균형을 유지하면 장기적으로 더 나은 전환과 더 행복한 고객 피드백으로이어질 수 있습니다.
클릭 유도 문안 전략을 재고할 때입니다!
CTA를 디자인할 때는 잠재 고객과의 모든 접점이 중요합니다. CTA는 단순한 버튼이나 문구가 아니라 기회, 초대, 연결고리입니다. 솔루션을 제공하든, 경험을 제공하든, 약속을 제공하든, CTA는 그 제안의 무게를 담고 있습니다.
따라서 CTA는 명확성, 설득력, 진정한 가치가 조화를 이루도록 하는 것이 중요합니다. 이 글에서 강조한 실수들은 단순한 함정이 아니라 학습의 기회이기도 합니다. 이러한 실수를 인지하고 있다면 이미 한 발 앞서 있는 것입니다.
논의된 각 요점은 해야 할 일과 하지 말아야 할 일을 명확하게 제시하여 공감을 불러일으키고 동기를 부여하며 전환을 유도하는 CTA를 만드는 데 도움이 됩니다.
