iOS용 Audience Network 광고 레이아웃 가이드

광고를 화면에 표시할 때 탐색 메뉴, 탭 바, 툴 바 및 기타 이전의 보기가 광고의 일부를 가리면 최적의 사용자 경험을 제공하지 못합니다. 왼쪽 아래의 예시는 iPhone X 화면의 상단에 표시되고 상단 가장자리로 인해 부분적으로 가려진 광고를 보여줍니다. 오른쪽의 예시는 iPhone X 화면의 상단 가장자리와 광고 사이에 적절한 간격을 두어 더 개선된 디자인을 보여줍니다.

iOS 11 이상에서는 safeAreaLayoutGuide라는 새 레이아웃 가이드가 적용됩니다. 이 가이드는 화면에서 렌더링하고 싶은 광고를 포함해 앱 콘텐츠를 그릴 수 있는 안전 영역을 정의하는 데 사용됩니다. 안전 영역은 위의 예시에서 녹색 테두리 상자로 정의된 곳입니다. 이 새로운 레이아웃 가이드를 사용하여 앱에서 네이티브 광고를 렌더링하는 기술적 구현에 대해 자세히 설명해 보겠습니다. 배너 광고 렌더링에도 동일한 방법을 적용할 수 있습니다.

필수 조건

네이티브 광고, 네이티브 배너 광고 또는 배너 광고 예시를 완료해야 합니다.

iOS 11 이상: 안전 영역 레이아웃 가이드

이전 iOS 버전: 상단 및 하단 레이아웃 가이드

iOS 11 이상: 안전 영역 레이아웃 가이드

1. 앱이 Xcode 9 이상을 포함하고 iOS 11 이상을 타게팅하는 인터페이스 빌더를 사용할 경우 안전 영역 레이아웃 가이드를 활성화해야 합니다. 인터페이스 빌더를 열고 뷰 컨트롤러 장면을 클릭합니다. 오른쪽에 인터페이스 빌더 문서 옵션이 보일 것입니다. 안전 영역 레이아웃 가이드 사용을 선택하세요.
   
   
2. 뷰 컨트롤러 장면에서 광고 UI 보기를 선택하고 크기 검사기로 이동합니다. 다음과 같이 안전 레이아웃 사이에 왼쪽, 오른쪽, 상단, 하단 간격을 추가하고 최적의 간격 값을 입력합니다.
   
   
3. 앱을 빌드하여 실행하면 둥근 모서리, 센서, 상태 표시줄 사이의 간격이 최적으로 설정된 광고가 화면에 표시됩니다.
   
   

이전 iOS 버전: 상단 및 하단 레이아웃 가이드

1. iOS 11보다 이전인 iOS 버전을 지원하려면, 안전 영역 문제 해결을 위한 상단 및 하단 레이아웃 가이드를 사용하세요. 다음과 같이 상단 및 하단 레이아웃 가이드가 뷰 컨트롤러 장면에 포함되도록 합니다.
   
   
2. 뷰 컨트롤러 장면에서 광고 UI 보기를 선택하고 크기 검사기로 이동합니다. 다음과 같이 상단 및 하단 레이아웃 사이에 상단 및 하단 간격을 추가하고 최적의 간격 값을 입력합니다.
   
   

네이티브 광고 정책 준수

양질의 제품을 만들려면, 개발자는 네이티브 광고 또는 네이티브 배너 광고 레이아웃을 구현할 때마다 Meta Audience Network 정책을 준수해야 합니다. 항상 사용자에게 클릭에 대한 전체 관리 권한을 제공해야 합니다. 특히 광고에서 클릭 가능한 요소가 있을 경우 광고 제목, URL, 행동 유도 및 이미지 자산만 클릭할 수 있어야 합니다. 그리고 제목 텍스트 또는 이미지 보기에서 흰 공백은 클릭할 수 없어야 합니다.

클릭 가능한 요소의 잘못된 예

네이티브 광고 또는 네이티브 배너 광고의 레이아웃을 빌드할 때는 항상 UILabel의 높이와 너비를 고정하지 않아야 광고 제목, 광고 본문, 광고 소셜 컨텍스트, 광고 홍보 레이블에서 white space가 생기지 않습니다. 아래는 반드시 피해야 할 잘못된 예입니다.

클릭 가능한 요소의 좋은 예

양질의 네이티브 광고를 만들기 위해서는 네이티브 광고 또는 네이티브 배너 광고에 동적 제약 레이아웃을 구축하세요. 예를 들어 스토리보드 자동 레이아웃을 사용할 경우 Trailing Space = x 대신 Trailing Space >= x, Width = y 대신 Width <= y를 사용할 수 있습니다. Meta Audience Network 정책을 준수한 레이아웃의 형태는 아래와 같습니다.