How to Setup App Deep Linking

One term that is getting a lot of discussion at the minute is that of Deep Linking. This is the process of linking from your website to apps and starting the process of completing an action on that app. The links themselves are not that different to a standard html link and I have provided a couple of examples below

Anatomy of the Deep Link

The anatomy of the link for it to open within an app is different to that of a standard HTML link however the delivery of it on the page is done in the same way as a standard link, by using a < a > tag. It is broken down as below;

Android
Protocol :// Package ID / Scheme / Host Path

Now this looks confusing but it is simple when you break it down and use it with the example below;

android-app :// com.twitter.android / http / twitter.com/kieranheadley

Android Users Click Here

The best way to find the correct Package ID for each app is to visit the play store and find the app you wish to link to. Within the url for the app will be the package id which will be after the id= query string, you can see below this shows com.twitter.android;

Screen Shot 2016-04-28 at 11.14.57

This will give you the following link;

Iphone
The experience on an iPhone is slightly more difficult as the links require you to use the registered URL scheme for the app which are not always publicly available. One good resource for this is visible here;

Url_scheme :// App_action

Once you have the correct URL scheme you can then link to the app, a couple of examples are listed below;

twitter:// user?screen_name=kieranheadley

iPhone Users Click Here

fb://profile/(fbid) – (fbid) to be replaced with your Facebook user ID

These will give you the following link;

Other Actions
twitter://status?id=12345
twitter://post?message=hello%20world
twitter://post?message=hello%20world&in_reply_to_status_id=12345
twitter://search?query=%23hashtag
fb://messaging/compose
fb://events
fb://feed

These are great for usability for your visitors and will help you interact better with the ever growing mobile audience.

Limitations

As with anything there are limitations, I have listed the main ones below;

  • If the user visits the website on a PC the deep links will not work.
  • If the user clicks on the iPhone link when using an Android the link will not work.
  • If the user does not have the app installed on their phone the link will not work, and it will not direct you to the app in the app/play store.

Check Device Type

What you want to be able to do is dynamically serve a link based on the device type, this will limit the risk of hitting the above limitations. I have supplied some sample code below, feel free to use your own.

You can then filter this down further by showing the iPhone link for iPhone users and the Android link for Android users. I would love you get your thoughts on Deep Linking, please leave a comment below.