기본 설정

텍스트

포인트:
버튼에 표시할 문구를 설정합니다. 사용자가 다음에 할 행동을 명확하게 전달하는 핵심 항목입니다.

이 설정으로 달라지는 점:
문구에 따라 클릭률과 이해 속도가 직접적으로 달라집니다.

조정 팁:
10~18자 내외의 동사가 포함된 문구(예: 자세히 보기 / 지금 신청하기)로 작성하면 의도가 잘 전달됩니다.

설정 항목

• 텍스트: 버튼에 표시할 문구입니다. 기본값은 버튼 스타일입니다.

호버 시 다른 문구를 보여주려면 Hover 탭을 활성화하고 호버 텍스트를 설정하세요.

태그

실제 인터페이스와 약간 다를 수 있습니다.

포인트:
출력할 HTML 태그와 속성을 설정합니다. 링크 이동인지, 동작 실행용 버튼인지를 여기서 명확히 구분합니다.

이 설정으로 달라지는 점:
SEO, 접근성, 추적(GTM)과 연결되는 핵심 정보가 확정됩니다.

조정 팁:
페이지 이동 목적이면 a, 폼 제출/JS 실행 목적이면 button을 선택하세요.

설정 항목

• HTML 태그: 링크(a 태그) / 버튼(button 태그). 기본값은 링크입니다.

의미론적으로 URL 이동 목적은 링크, 스크립트 실행/폼 조작 목적은 버튼을 선택해야 합니다. 사이트 내 이동 동선은 SEO 크롤러가 추적 가능한 링크 사용을 권장합니다.

링크 선택 시

실제 인터페이스와 약간 다를 수 있습니다.

실제 인터페이스와 약간 다를 수 있습니다.

• 링크 URL: 이동할 URL을 설정합니다. 추적 대상 페이지는 정규 URL 사용을 권장합니다.
• 링크 Target: 같은 탭(_self) 또는 새 탭(_blank)을 선택합니다. 외부 링크는 새 탭이 일반적입니다.
• rel Attribute: noopener, noreferrer, nofollow 등을 설정해 보안/SEO 조건을 조정합니다.

target="_blank"를 사용하면 rel="noopener"가 자동 부여됩니다(보안상 강제). 수동으로 제거할 수 없습니다. 외부 링크에 SEO 평가를 넘기지 않으려면 nofollow를 추가하세요.

• 링크 Title: 보조 설명을 추가해 접근성과 의미를 강화합니다.

버튼 선택 시

실제 인터페이스와 약간 다를 수 있습니다.

• 버튼 Type: button / submit / reset 중 선택해 폼 내 동작을 정의합니다.

submit은 폼 제출을 실행합니다. 폼 외부에서 사용할 때는 button을 선택하세요. reset은 폼 입력값을 모두 초기화하므로 오작동 방지 관점에서 신중히 사용해야 합니다. 기본값은 button입니다.

접근성 제한:
링크 URL이 비어 있거나 #이면 출력 HTML에 role="button"이 자동 부여됩니다. 링크로 동작하지 않는 요소를 스크린리더가 버튼으로 올바르게 읽을 수 있게 합니다.

호버 텍스트 폴백:
Hover 탭의 호버 텍스트가 비어 있으면 기본 텍스트를 그대로 사용합니다.

공통 항목

실제 인터페이스와 약간 다를 수 있습니다.

• aria-label: 화면 표시 문구만으로 의도가 충분하지 않을 때 보조 라벨을 제공합니다.
• Tracking ID: GTM/분석 도구 이벤트 집계에 사용하는 식별자입니다.
• 버튼 Location: 버튼 위치 관리용 라벨입니다. 다중 CTA A/B 테스트에서 유용합니다.
• ID: CSS/JS에서 요소를 고유하게 참조하기 위한 식별자입니다.

Tracking ID, 버튼 Location은 HTML data-* 속성으로 출력됩니다. ID는 페이지 내에서 유일해야 하며, 중복되면 CSS/JS 동작이 꼬일 수 있습니다.