If you've browsed the web on an iOS device, chances are that you've already encountered at least one Smart App Banner. Smart App Banners are an unobtrusive way for websites to advertise their corresponding apps to users. An example of such a banner can be found on Apple's own WWDC website:
There are multiple reasons for you to adopt Smart App Banners in your application. One of them is that it's easy. Implementing a Smart App Banner only takes a short amount of time and it's just a single tag you add to the html markup for your page. This alone should be enough reason for you to implement them; minimum effort, lots of benefits.
Another reason is that Smart App Banners are smart. They know whether an app is installed on the device or not and they prompt the user accordingly. If your app isn't installed, the banner will ask visitors of your site to download your app. If they do have your app installed, the banner will give your users the option to open the current page in your app. This is more secure than somebody else being able to check whether or not your app is installed on a device because Smart App Banners don't use a custom URL scheme nor do they communicate with the webpage they're embedded in. In other words, you or other sites can't abuse the Smart App Banner to find out if a user has installed a certain app on their device.
The final reason you should adopt Smart App Banners is that they benefit your visibility throughout Spotlight and Safari. If your app implements Smart App Banners, Apple can identify your app more easily and it knows that the current page should be indexed by its bot. Combine this with the other benefits of Smart App Banners and you're looking at a powerful, easy to adopt technology that will benefit you, your app, and more importantly, your users.
To implement a Smart App Banner on your site, all you need is your application id and optionally a deeplink URL to content inside your app. To find your application id, you should navigate to the iTunes Connect website, log in, and navigate to your app. In the App Information tab, you should be able to find an Apple ID header. Under this header you'll find a number that represents your application id.
If your app supports deep linking through Universal Links, the link to the current page can be used as the app deep link. Alternatively, you could provide a different URL or a URL with a custom scheme to the Smart App Banner. Ideally you have support for Universal Links and the current page URL is passed as the URL that your app should open.
So, what does the implementation of a Smart App Banner look like?
<meta name="apple-itunes-app" content="app-id=YOUR_APP_ID, app-argument=YOUR_APP_DEEPLINK">
Simple enough, right? It's a metatag that you add to the <head> section of an html page and that's it. Once Safari detects this metatag in your html file, it will render a Smart App Banner for your page. The app deep link you provide is passed to your AppDelegate class application(_:open:options:) method.
This is all the work involved in implementing Smart App Banners. Now that our server is able to prove that the app and site are connected and Smart App Banners are added to the site, we're done with the web work. We need to implement the handling of deep link URLs in the main application now.