입력칸을 한 줄 줄였더니 문의가 늘었다 — 작은 회사 웹사이트 문의 폼 설계의 5가지 원칙

광고를 돌리고, 검색에 노출되고, 어렵게 사이트까지 들어온 고객이 마지막에 멈추는 곳이 있다. 바로 문의 폼이다. 작은 회사 사이트에서 문의 폼은 매출과 가장 가까운 화면이지만, 가장 무신경하게 만들어지는 화면이기도 하다. 칸을 하나 줄이거나 안내 문구 한 줄을 바꾸는 것만으로 문의 수가 눈에 띄게 달라진다. 실무에서 반복해서 확인한 다섯 가지 원칙을 정리한다.

1. 묻지 않아도 되는 칸부터 지운다

폼이 길어질수록 고객은 조용히 창을 닫는다. 첫 문의 단계에서 정말 필요한 정보는 생각보다 적다. 연락 수단 하나와 문의 내용이면 대화를 시작하기에 충분한 경우가 많다.

  • 회사명, 직급, 예산 범위처럼 통화 한 번으로 알 수 있는 항목은 빼거나 선택 입력으로 돌린다.
  • 이름과 연락처를 동시에 받기보다, 가장 빠르게 회신할 수 있는 채널 하나에 집중한다.
  • 꼭 필요한 칸에는 (필수) 표시를 달아 고객이 무엇부터 채워야 할지 한눈에 알게 한다.

2. 라벨은 칸 위에 두고, placeholder에 의존하지 않는다

입력칸 안에 회색 글씨로만 안내를 넣는 방식은 깔끔해 보이지만, 글자를 입력하는 순간 안내가 사라져 무엇을 적던 칸인지 헷갈리게 만든다. 라벨은 칸 바깥 위쪽에 항상 보이도록 두는 것이 안전하다. placeholder는 예시(예: 010-1234-5678)를 보여주는 보조 역할로만 쓴다.

3. 에러는 그 자리에서, 빨간 한 줄이 아니라 해결책으로

전송 버튼을 누른 뒤에야 페이지 맨 위에 "입력값을 확인하세요"라고 뜨면 고객은 어디가 틀렸는지 찾아 헤맨다. 에러는 문제가 생긴 칸 바로 아래에서 즉시 보여주고, 무엇을 어떻게 고치면 되는지 알려줘야 한다.

  • "이메일이 올바르지 않습니다"보다 "@를 포함한 이메일 주소를 입력해 주세요"가 낫다.
  • 이미 채운 내용은 절대 지우지 않는다. 다시 처음부터 입력하게 만드는 순간 고객은 떠난다.

4. 모바일에서는 키보드까지 설계한다

문의의 절반 이상이 휴대폰에서 들어온다. 그런데 전화번호 칸을 눌렀는데 일반 키보드가 뜨면 고객은 숫자판을 찾느라 멈칫한다. 입력 종류에 맞는 키보드가 자동으로 뜨도록 칸의 속성을 지정해야 한다. 이메일 칸에는 @ 키가 보이는 키보드, 전화번호 칸에는 숫자 키패드가 바로 떠야 한다. 입력칸과 버튼의 터치 영역도 손가락으로 누르기 충분한 크기로 키운다.

5. 전송 버튼을 누른 다음이 진짜 시작이다

고객이 전송을 누른 순간은 끝이 아니라 관계의 시작이다. 그런데 많은 사이트가 전송 후 아무 변화도 보여주지 않거나, 텅 빈 화면으로 넘긴다. 고객은 "보내진 건가?" 하고 불안해한다.

  • 전송이 완료되면 "문의가 접수되었습니다. 영업일 기준 하루 안에 회신드립니다"처럼 다음 일정을 명확히 안내한다.
  • 버튼은 누른 직후 비활성화해 같은 문의가 두세 번 중복 접수되는 일을 막는다.

문의 폼은 디자인의 끝자락에 대충 얹는 부품이 아니라, 고객이 회사에 처음 말을 거는 문(門)이다. 칸 하나, 안내 한 줄이 문의율을 바꾼다. CYAN 에이전시는 작은 회사의 사이트를 만들 때 이 문의 폼 한 화면을 매출 관점에서 따로 설계한다. 지금 우리 사이트의 폼을 직접 휴대폰으로 채워 보길 권한다. 고객이 멈추는 지점이 바로 그 자리에 있다.