광고로 사람을 데려오고 첫 화면으로 마음을 잡았는데, 정작 문의 폼 앞에서 고객이 등을 돌리는 경우가 많다. 입력칸이 너무 많거나, 무엇을 쓰라는 건지 헷갈리거나, 빨간 에러 메시지가 이유도 없이 뜨면 사람은 미련 없이 창을 닫는다. 폼은 웹사이트에서 매출과 가장 가까운 한 칸이다. 작은 회사일수록 이 마지막 관문을 가볍게 봐서는 안 된다.
1. 칸은 적을수록 좋다
폼의 완성률은 입력칸 수에 반비례한다. 이름·연락처·문의 내용 세 칸이면 충분한데도 회사명, 직급, 주소, 유입 경로까지 묻는 순간 고객의 손이 멈춘다. 지금 당장 연락하는 데 꼭 필요한 정보만 남기고 나머지는 통화하면서 물어보면 된다. 칸 하나를 줄이는 것이 디자인을 다듬는 것보다 전환율을 더 끌어올릴 때가 많다.
2. 라벨은 칸 위에 두고, 안내는 칸 안에 숨기지 마라
깔끔해 보인다는 이유로 라벨을 없애고 placeholder(흐린 안내 글자)만 넣는 디자인이 흔하다. 하지만 고객이 입력을 시작하는 순간 안내 글자는 사라지고, "내가 지금 뭘 쓰는 칸이었지?" 하는 혼란이 생긴다. 라벨은 칸 위에 또렷이 고정하고, 형식 안내(예: 010으로 시작하는 번호)는 칸 아래 작은 글씨로 따로 적어준다.
3. 에러는 즉시, 친절하게, 그 자리에서
다 채우고 전송 버튼을 눌렀더니 맨 위로 튕겨 올라가 "오류가 발생했습니다"만 뜨는 폼은 최악이다. 어디가 틀렸는지 알 수가 없다.
- 위치: 에러는 문제가 된 칸 바로 아래에 빨간 글씨로 보여준다.
- 시점: 전송 후가 아니라 그 칸을 벗어나는 순간 바로 알려준다.
- 문구: "잘못된 입력"이 아니라 "이메일에 @를 넣어 주세요"처럼 해결 방법을 적는다.
4. 모바일에서는 키보드까지 배려하라
고객의 절반 이상이 휴대폰으로 폼을 채운다. 전화번호 칸을 눌렀는데 한글 키보드가 뜨면 그 자체로 스트레스다. 전화 칸은 숫자 키보드, 이메일 칸은 @가 보이는 키보드가 자동으로 뜨도록 입력 유형을 지정하고, 자동완성을 켜두면 고객이 직접 타이핑할 글자 수가 확 줄어든다. 손끝의 수고를 줄이는 것이 곧 완성률이다.
5. 버튼은 하나, 그리고 다음을 알려줘라
전송 버튼 옆에 '초기화' 버튼을 나란히 두면 다 쓴 내용을 실수로 날리는 사고가 난다. 주 동작은 눈에 띄는 버튼 하나면 충분하다. 또한 버튼을 누른 뒤 화면이 멈춘 듯 보이면 고객은 두세 번 더 누른다. "접수되었습니다, 1영업일 안에 연락드릴게요" 같은 다음 안내를 분명히 보여줘 불안을 없애야 한다.
작은 칸 하나가 매출을 가른다
폼은 디자인의 마지막 장식이 아니라, 방문자를 고객으로 바꾸는 결제 창구다. 칸을 줄이고, 라벨을 또렷이 하고, 에러를 친절하게 만드는 작은 손질만으로도 같은 방문자에서 더 많은 문의가 나온다. CYAN은 작은 회사의 웹사이트를 만들 때 폼 한 칸까지 고객의 손끝을 따라가며 설계한다. 사이트는 멀쩡한데 문의가 들어오지 않는다면, 가장 먼저 들여다봐야 할 곳은 바로 이 입력 폼이다.