방문 페이지 속도가 개선되면 일반적으로 더 많은 전환이 유도되며, AMP는 빠르게 로드되는 매력적인 Google Ads 방문 페이지를 만드는 데 유용합니다. amp.dev는 웹 개발자에게 매력적이고 실적이 우수한 페이지를 만드는 데 필요한 리소스를 제공합니다. 이 단계별 가이드에서는 AMP 페이지에서 Google Ads 및 기타 광고 기술을 사용하는 방법을 설명합니다.
1단계: AMP 페이지 만들기 및 확인
AMP 페이지 만들기
기본 AMP 페이지를 만드는 방법을 알아보려면 AMP 프로젝트의 첫 AMP 페이지 만들기 튜토리얼을 시작하세요. 실습 단계별 안내를 보려면 HTML을 AMP로 변환 및 고급 AMP 기능 추가 튜토리얼을 완료하세요. AMP 구성요소의 샘플 코드와 템플릿은 AMP 웹사이트 예 및 AMP 템플릿에서 확인할 수 있습니다.
아래 목록에서는 AMP 페이지에 사용되는 일부 구성요소를 설명합니다. 참조를 위해 구성요소의 전체 목록을 참고하세요.
- amp-bind: JavaScript와 유사한 이벤트를 기반으로 맞춤 상태 저장 상호작용을 추가합니다.
- amp-form: 사용자로부터 입력을 받아야 하는 방문 페이지를 만듭니다.
- amp-list: CORS JSON 엔드포인트에서 동적으로 콘텐츠를 가져옵니다.
- amp-carousel: 이미지 갤러리를 스크롤하기 위한 이미지 캐러셀입니다.
- amp-lightbox: 구성요소와 상호작용한 경우 구성요소의 전체 화면 뷰를 표시합니다.
- amp-call-tracking 통화 추적을 위해 하이퍼링크의 전화번호를 동적으로 대체합니다.
- amp-mustache: Mustache.js를 사용하여 렌더링할 수 있습니다.
- amp-date-picker: 날짜를 선택할 수 있는 위젯을 제공합니다. 날짜 선택 도구는 입력란과 관련된 오버레이 또는 정적 캘린더 위젯으로 렌더링할 수 있습니다.
AMP 페이지 확인
개발 중에 AMP 페이지가 유효한지 확인해야 합니다. AMP는 문서를 확인하는 여러 가지 방법을 제공합니다. AMP 페이지를 확인하는 가장 일반적인 방법은 웹 유효성 검사 도구 또는 Google 웹마스터 도구 유효성 검사 도구를 사용하는 것입니다. Chrome 브라우저 플러그인 및 개발자 콘솔을 사용하거나 빌드에 amphtml-validator npm 모듈을 통합할 수도 있습니다.
AMP 페이지 배포와 관련된 문제를 확인하고 디버깅하는 오픈소스 웹 애플리케이션 및 서비스인 AMPBench를 사용할 수도 있습니다.
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 태그 관리자를 사용하여 리마케팅, DoubleClick Floodlight, Google 유니버설 애널리틱스 및 유사한 측정 제품을 추가할 수 있습니다. 호환되는 태그의 전체 목록을 참고하세요.
Adobe Analytics (이전 명칭: Omniture)
Adobe Analytics는 웹사이트 실적
추적 솔루션을
amp-analytics
구성요소를 사용하여 구현하는 두 가지 방법(iframe(adobeanalytics_nativeConfig) 및 비 iframe
(adobeanalytics) 구현)을 제공합니다. 각 접근방식의 장단점과 구현
세부정보를 읽어보세요.
기타 일반적인 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에 추가하세요.
AMP 프로젝트는 매일 새로운 기능과 구성요소를 추가하고 있습니다. 누락된 기능을 발견하면 GitHub 문제를 열어 기여하거나 추가를 요청할 수 있습니다.