iOS6의 새로운 기능 중 하나가 Smart App Banner입니다.
이 기능은 쉽게 말해서 아래와 같이 iOS에 내장된 Safari로 특정 웹페이지를 호출했을 때 화면 상단에 App 배너가 나타나게 하는 기능입니다.
적용을 위해서는 웹 페이지에 간단한 메타태그 한 줄만 넣어주면 됩니다.
참 간단하죠.
자 그럼 위 태그에 입력해야할 값들에 대해서 알아보겠습니다.
1. name
이 부분은 그냥 위와 같이 적어주시면 됩니다. itunes에 적용된 앱이라는 것을 명시하기 위함입니다.
2. content
2.1. app-id (필수)
앱스토어에 등록된 앱이 부여받은 ID값입니다. 이 값을 알기 위해서는 http://itunes.apple.com/linkmaker/ 에서 검색을 합니다.
저는 아래와 같이 아임리얼맛집을 검색했습니다.
하단에 결과가 나왔죠? 그럼 하단 오른쪽에 있는 “iPhone App Link”를 살포시 눌러줍니다.
아래와 같이 검색된 앱의 상세정보가 나타납니다.
여기에서 중요한 부분은
주소 중 “/idXXXXXXXXX?mt=” 의 XXXXXXXXX에 위치한 숫자입니다.
이 숫자가 app-id에 들어갈 ID값입니다.
2.2. affilidate-data (선택)
이 부분은 관련된 컨텐츠를 등록하기 위한 필드이며, http://www.apple.com/itunes/affiliates/ 에서 등록을 해야 사용이 가능합니다.
따로 테스트해 볼 방법은 없는 상황이라 자세한 사항은 위에 명시한 사이트에서 얻으셔야 합니다.
검색을 하다보니 잘 설명된 링크를 얻었습니다. http://david-smith.org/blog/2011/12/28/user-friendly-itunes-affiliate-links/
2.3. app-argument (선택)
URL이 입력되며, 입력된 URL은 Facebook에서 제공하는 Deep-Linking과 유사하게 해당 앱의 특정 컨텐츠를 열어줄 수도 있습니다.
물론 앱과의 프로토콜은 맞춰야겠죠.
예를 들어, 핀터레스트의 특정 컨텐츠의 상세 페이지에서 Smart Banner의 열기(View)를 터치했을 때 핀터레스트 앱이 실행되고 해당 페이지로 이동하는 역할을 합니다.
scheme://protocol_text 형식으로 명명하고 앱의 아래 메소드에 이에 대한 정의를 구현하면 됩니다.
테스트를 위해 만들어 본 페이지는 http://y8k.me/SmartTest/ 에서 보실 수 있습니다.
iPad로 봤을 때는 스크린샷까지 나타납니다.
