방문 페이지가 빠를수록 일반적으로 전환이 증가하며, AMP는 더 빠르게 로드되는 매력적인 Google Ads 방문 페이지를 만드는 좋은 방법입니다. amp.dev는 웹 개발자에게 매력적이고 실적이 우수한 페이지를 만드는 데 필요한 리소스를 제공합니다. 이 단계별 가이드에서는 AMP 페이지에서 Google Ads 및 기타 광고 기술을 사용하는 방법을 설명합니다.
1단계: AMP 페이지 만들기 및 검증하기
AMP 페이지 만들기
기본 AMP 페이지를 만드는 방법을 알아보려면 AMP 프로젝트의 첫 번째 AMP 페이지 만들기 튜토리얼을 참고하세요. 실습형 단계별 안내를 보려면 HTML을 AMP로 변환 및 고급 AMP 기능 추가 튜토리얼을 완료하세요. AMP 웹사이트 예 및 AMP 템플릿에서 AMP 구성요소의 샘플 코드와 템플릿을 확인할 수 있습니다.
아래 목록에서는 AMP 페이지에 사용되는 몇 가지 구성요소를 설명합니다. 구성요소의 전체 목록을 참고하세요.
- amp-bind: JavaScript와 유사한 이벤트를 기반으로 맞춤 스테이트풀(Stateful) 상호작용을 추가합니다.
- amp-form: 사용자 입력이 필요한 방문 페이지를 만듭니다.
- amp-list: CORS JSON 엔드포인트에서 콘텐츠를 동적으로 가져옵니다.
- amp-carousel: 이미지 갤러리를 스크롤하기 위한 이미지 캐러셀입니다.
- amp-lightbox: 상호작용이 발생한 구성요소를 전체 화면으로 표시합니다.
- amp-call-tracking: 통화 추적을 위해 하이퍼링크의 전화번호를 동적으로 대체합니다.
- amp-mustache: Mustache.js를 사용한 렌더링을 허용합니다.
- amp-date-picker: 날짜를 선택할 수 있는 위젯을 제공합니다. 날짜 선택 도구는 입력란을 기준으로 오버레이로 렌더링하거나 정적 캘린더 위젯으로 렌더링할 수 있습니다.
AMP 페이지 유효성 검사
개발 중에 AMP 페이지가 AMP 사양을 준수하는지 확인합니다. AMP는 여러 유효성 검사 방법을 제공합니다. AMP 페이지를 검사하는 가장 일반적인 방법은 AMP 웹 검사기 또는 Search Console AMP 테스트를 사용하는 것입니다. AMP 검사기 Chrome 확장 프로그램 및 개발자 콘솔을 사용하거나 amphtml-validator npm 모듈을 빌드에 통합할 수도 있습니다.
AMP 테스트와 관련된 지원이 필요한 경우 AMP 지원 페이지를 참고하세요.
2단계: 전환 추적 및 분석을 위한 AMP 설정하기
Google Ads 전환 추적
amp-analytics 구성요소를 사용하여 Google Ads 전환을 추적합니다. AMP 방문 페이지에 Google Ads 전환 측정 설정의 단계에 따라 설정 방법을 알아보세요.
Google 애널리틱스
Google 애널리틱스는 amp-analytics에서 지원하는 분석 솔루션 중 하나입니다. AMP 페이지와 비 AMP 페이지에서 세션을 통합하려면 AMP용 Google 애널리틱스 세션 통합 설정의 단계를 따르세요.
Google 태그 관리자
amp-analytics 구성요소는 Google 태그 관리자를 기본적으로 지원합니다. Google Ads 전환 외에도 Google 태그 관리자를 사용하여 리마케팅, 플러드라이트, 유사한 측정 제품을 추가할 수 있습니다. 호환되는 태그의 전체 목록을 확인하세요.
Adobe Analytics
Adobe Analytics는 amp-analytics 구성요소를 사용하여 웹사이트 실적 추적 솔루션을 구현하는 두 가지 방법, 즉 iframe(adobeanalytics_nativeConfig)과 iframe이 아닌 방법(adobeanalytics)을 제공합니다. Adobe Analytics AMP 문서에서 각 접근 방식의 장단점과 구현 세부정보를 확인하세요.
기타 일반적인 Google Ads 관련 기술 통합
amp-analytics 구성요소를 사용하여 사용자 작업 및 이벤트를 추적할 수 있습니다. AMP 애널리틱스는 40개 이상의 애널리틱스 공급업체를 기본 지원합니다 이 프레임워크는 유연하며, 맞춤 구성을 사용하여 URL을 측정하고 트리거하여 분석 정보를 자체 서버 또는 네이티브 AMP 지원을 사용할 수 없는 공급업체에 전송할 수 있습니다. 지원되지 않는 기술을 사용하는 경우 공급업체에 지원을 추가하도록 요청하세요.
AMP 애널리틱스는 유연한 변수 대체도 허용합니다. 자세한 내용은 변수 대체 문서를 참고하세요.
3단계: Google Ads UI에서 AMP 게재 사용 설정하기
Google 검색의 AMP 페이지는 페이지의 링크를 통해 자동으로 검색되지만 광고주는 Google Ads에 AMP 페이지 URL을 명시적으로 입력해야 합니다. Google Ads UI에서 AMP URL을 설정하는 방법에 대한 자세한 내용은 Google Ads에서 AMP를 사용하는 방법을 참고하세요.
또한 Google Ads 트래픽을 AMP 방문 페이지로 유도하되 자연 검색 결과에는 표시되지 않도록 하려면 일반 웹페이지와 마찬가지로 관련 AMP 페이지의 Disallow 지시어를 robots.txt 파일에 추가하세요.