랜딩페이지 행동 버튼 문구: 클릭 유도보다 다음 단계의 불안을 줄이는 법

버튼 이름을 가리고 클릭 뒤 결과부터 적습니다

같은 “지금 시작”도 어떤 화면에서는 자료를 열고, 다른 화면에서는 회원가입을 시작합니다. 문구를 정하기 전에 누른 뒤 생기는 결과를 적으면 필요한 동사와 조건이 보입니다. 파일 보기, 파일 저장, 입력한 내용 보내기, 현재 선택 취소는 서로 다른 행동입니다.

표는 문구 비교를 위한 예시입니다. 단어가 구체적이어도 실제 단계가 다르면 쓸 수 없습니다. “샘플 미리보기” 뒤에서 결제 정보를 먼저 요구한다면 문구와 흐름 중 어느 쪽을 고칠지 다시 정해야 합니다.

이동과 실행을 다른 말로 씁니다

치수표나 이용 조건을 여는 경로는 보통 자료로 이동하는 링크입니다. 옵션 패널을 열거나 폼을 보내는 행동은 현재 맥락의 기능을 실행합니다. USWDS의 버튼 안내도 중요한 행동과 페이지 이동을 구분하고 레이블이 결과를 설명하도록 권합니다.

모양이 비슷해도 문장에서는 차이가 남아야 합니다. “문의 방법 보기”는 안내를 읽는 경로이고 “문의 보내기”는 작성한 값을 전송하는 행동입니다. 이 차이가 없으면 사용자는 눌러도 되는지 망설이거나 이미 보냈다고 생각할 수 있습니다.

<a href="/contact/">문의 방법 보기</a>
<button type="submit">문의 보내기</button>
<button type="button">입력 내용 확인</button>

코드는 요소의 역할을 보여주는 부분 예제입니다. 마지막 버튼은 실제 확인 화면을 여는 처리와 연결되어야 합니다. 이름만 바꿔 기능이 생기는 것은 아닙니다.

비용·가입·파일 형식은 필요한 순간에 알립니다

버튼 이름 하나에 모든 조건을 넣을 필요는 없습니다. 다만 선택에 영향을 주는 조건은 버튼 가까이에서 읽을 수 있어야 합니다. 자료를 받으려면 로그인해야 하는지, 다운로드 파일이 ZIP인지, 다음 단계에서 비용이 생기는지 문맥과 이름을 함께 대조합니다.

같은 이름을 쓸 곳과 나눌 곳을 정합니다

같은 자료로 가는 링크에는 일관된 이름을 쓰면 다시 찾기 쉽습니다. 서로 다른 자료를 모두 “자세히 보기”로 표시하면 링크 목록만 읽는 사람은 목적을 구분하기 어렵습니다. W3C의 링크 목적 기준은 이름과 관련 문맥으로 목적을 파악할 수 있는 관계를 다룹니다.

현재 단계가 달라졌다면 이름도 맞춥니다. 옵션을 고르기 전에는 “구성 선택”, 고른 뒤에는 “선택 내용 확인”, 내용을 전송하는 순간에는 “문의 보내기”처럼 결과를 구분할 수 있습니다. 버튼을 어느 정보 뒤에 놓을지는 CTA 위치와 정보 순서에서 다룹니다.

대기·성공·실패 문구까지 같은 동사를 이어 씁니다

“문의 보내기”를 눌렀다면 대기는 “보내는 중”, 실패는 “보내지 못했습니다”로 연결합니다. 성공 메시지는 실제로 확인한 단계까지만 말합니다. 입력 형식만 검사한 화면에서 “접수되었습니다”라고 쓰면 같은 동사가 다른 처리를 뜻하게 됩니다.

검토할 때는 화면의 문구, 접근 가능한 이름, 실행한 동작, 결과 문장을 순서대로 읽어 보세요. 아이콘에 따로 붙인 이름이 화면 문구와 반대 행동을 말하지 않는지도 확인합니다. 오류 요약과 입력란은 실패 뒤에 고칠 위치를 알리는 방법을 다룹니다. 클릭 수를 평가하기 전에 이 의미 연결부터 끝내는 것이 문구 편집의 목표입니다.

참고 자료

• Button
• Understanding Success Criterion 2.4.4: Link Purpose (In Context)
• Understanding Success Criterion 2.5.8: Target Size (Minimum)
• Understanding Success Criterion 3.2.1: On Focus