CTA (행동 버튼)

CTA 버튼 문구는 어떻게 정하나요?

CTA 문구는 ‘누르면 무슨 일이 일어나는지’를 손님 입장의 동사로 적으면 돼요. 손님은 버튼 앞에서 ‘이걸 누르면 바로 결제되나?’, ‘전화가 걸리나?’를 먼저 걱정하기 때문이에요.

버튼을 누른 뒤 손님이 부담을 느낄 만한 일이 있다면 버튼 바로 아래에 짧게 덧붙여요. ‘상담만 받아도 괜찮아요’, ‘결제는 다음 단계에서 해요’ 같은 한 줄이 망설임을 줄여 줘요.

버튼 문구는 짧을수록 좋지만 뜻이 사라질 만큼 줄이면 안 돼요. 두세 단어 안에서 ‘무엇을’과 ‘어떻게’가 함께 보이는 정도가 적당해요.

버튼 문구는 손님이 실제로 쓰는 말과 맞추세요. 미용실이라면 ‘시술 예약’보다 ‘커트 · 펌 예약’처럼 손님이 머릿속에 떠올리는 말이 더 빨리 읽혀요.

주 버튼과 보조 버튼은 어떻게 나누나요?

주 버튼은 가게가 손님에게 가장 바라는 행동 하나이고, 보조 버튼은 아직 결정하지 못한 손님을 위한 다른 길이에요. 예를 들어 미용실이라면 ‘예약하기’가 주 버튼, ‘가격표 보기’가 보조 버튼이 될 수 있어요.

주 버튼은 채운 색으로, 보조 버튼은 테두리만 있거나 글자 링크로 만들어 무게를 달리해요. 두 버튼이 같은 색 · 같은 크기면 손님이 어느 쪽을 눌러야 할지 다시 생각하게 돼요.

페이지마다 주 버튼이 무엇인지 미리 정해 두면 디자인 회의도 짧아져요. 메인은 ‘예약’, 가격 페이지는 ‘이 시술 예약’, 오시는 길 페이지는 ‘길찾기’처럼 페이지 목적에 맞춰 바꾸면 돼요.

업종 예를 들면 카페는 ‘길찾기’, 공방은 ‘클래스 신청’, 온라인 판매는 ‘장바구니 담기’가 주 버튼이 되는 경우가 많아요. 보조 버튼은 아직 고민 중인 손님을 위한 ‘메뉴 보기’, ‘작품 구경하기’, ‘후기 보기’ 같은 것이에요.

CTA 버튼은 어디에, 얼마나 크게 두나요?

CTA는 손님이 결정을 내리는 자리 바로 옆에 둬요. 첫 화면, 가격이나 설명을 다 읽은 지점, 페이지 맨 끝이 대표적이에요.

크기는 손가락으로 정확히 누를 수 있을 만큼이어야 해요. 웹 접근성 국제 기준 WCAG 2.2는 누르는 영역을 최소 24×24 CSS 픽셀 이상으로 정하고 있고, 중요한 버튼은 이보다 넉넉하게 만드는 편이 좋아요. 버튼끼리 너무 붙어 있으면 옆 버튼이 눌리기 쉬워서 간격도 함께 챙겨요.

폰에서는 화면 아래쪽에 ‘전화 · 예약’ 버튼을 고정해 두는 방식도 많이 써요. 엄지가 닿기 쉬운 자리라 편하지만, 내용을 가리지 않도록 높이를 낮게 잡아야 해요.

버튼이 버튼처럼 보이는 것도 중요해요. 글자만 있고 테두리나 배경이 없으면 손님이 누를 수 있는 것인지 모르고 지나치기 쉬워요.

CTA는 어떤 순서로 만들면 되나요?

버튼 디자인보다 ‘손님에게 무엇을 해 달라고 할지’를 먼저 정하는 게 순서예요. 아래 단계를 따라가면 페이지마다 맞는 버튼을 정할 수 있어요.

가게가 작을수록 주 버튼은 사장님이 가장 빨리 응대할 수 있는 연락 방법으로 정하는 게 좋아요. 영업 중에 전화를 자주 못 받는다면 ‘전화하기’보다 ‘카카오톡 문의’나 ‘예약하기’를 주 버튼으로 두는 식이에요.

버튼 위치는 처음부터 완벽할 필요가 없어요. 공개 후 실제로 눌린 기록을 보고 옮기는 편이 짐작으로 정하는 것보다 정확해요.

1. 01가게 매출로 이어지는 행동을 적어요. (예약, 전화, 카카오톡 문의, 구매, 방문)
2. 02그중 가장 중요한 하나를 주 버튼으로, 나머지 한두 개를 보조 버튼으로 정해요.
3. 03페이지마다 주 버튼을 하나씩 배정해요.
4. 04버튼 문구를 손님 입장의 동사로 써요.
5. 05첫 화면, 설명이 끝나는 지점, 페이지 끝에 버튼을 배치해요.
6. 06폰에서 엄지로 눌러 보며 크기와 간격을 확인해요.
7. 07공개 후 버튼별로 얼마나 눌렸는지 기록해 두고 문구와 위치를 다듬어요.

CTA가 잘 작동하는지 어떻게 확인하나요?

버튼이 몇 번 눌렸는지, 그중 실제 예약 · 문의로 이어진 게 몇 건인지 보면 돼요. 방문 통계 도구에 버튼 클릭을 ‘이벤트’로 기록해 두면 어떤 버튼이 일하고 있는지 알 수 있어요.

전화 버튼은 눌린 횟수까지만 알 수 있고 통화가 됐는지는 따로 확인해야 해요. 매장에서 ‘어떻게 알고 오셨어요?’라고 물어보는 습관을 함께 들이면 숫자를 해석하기 쉬워져요.

문구를 바꿀 때는 한 번에 하나만 바꾸고 2~4주 정도 지켜보는 편이 좋아요. 여러 개를 동시에 바꾸면 무엇 때문에 달라졌는지 알기 어려워요.

방문자가 많지 않은 작은 가게는 비율보다 건수를 보는 편이 나아요. 한 달에 버튼이 몇 번 눌리고 그중 몇 건이 실제 예약이 됐는지 적어 두면, 몇 달 뒤 변화가 보여요.

CTA에서 자주 하는 실수는 무엇인가요?

흔한 실수는 버튼을 너무 많이 두는 거예요. ‘예약’, ‘문의’, ‘전화’, ‘카톡’, ‘인스타’가 한 줄에 같은 크기로 있으면 손님은 오히려 아무것도 누르지 않기도 해요.

‘여기를 클릭’, ‘더보기’처럼 앞뒤 문맥 없이는 뜻을 알 수 없는 문구도 피해야 해요. 화면을 소리로 읽어 주는 프로그램을 쓰는 손님은 버튼 문구만 듣고 판단하기 때문에, 웹 접근성 기준도 링크 목적을 알 수 있게 쓰라고 권해요.

버튼을 누른 다음 화면도 CTA의 일부예요. 문의를 보냈는데 아무 안내가 없으면 손님은 제대로 보내졌는지 몰라 다시 보내거나 전화를 걸어요. ‘보통 몇 시간 안에 답장드려요’ 같은 완료 안내를 꼭 넣어 주세요.

CTA에 대해 제작사에 무엇을 물어보면 되나요?

제작사에는 ‘버튼을 크게, 빨갛게’처럼 모양만 요청하기보다 ‘이 페이지에서는 예약이 가장 중요해요’처럼 목적을 먼저 알려 주세요. 목적이 분명하면 디자이너가 그에 맞는 크기 · 색 · 위치를 제안할 수 있어요.

• 페이지마다 주 버튼을 무엇으로 정했는지 설명해 줄 수 있나요?
• 폰에서 버튼 크기와 간격을 따로 확인하나요?
• 버튼 클릭을 방문 통계에 기록해 주나요?
• 공개 후 버튼 문구나 위치를 바꾸려면 어떻게 요청하나요?