Deep Linked WebsiteTechnicalWeb to App

How to Deep Link from Your Mobile Website

By November 5, 2015 No Comments

If a user has your app installed and they see the mobile web, you’re doing something wrong. Deep linking from your mobile website is an absolute requirement to deliver a high-quality user experience. Users will always end up on your site one way or another – either through a SERP, or typing in the URL directly. You should even expect a large percentage of web traffic from users that already have the app installed.

 If the user doesn’t have the app, you have to provide options for them to download it. In this scenario, you want to carry their context and expectations for your app through the install by deep linking them to the item or page they were just viewing. It results in a substantial lift in activation conversion and overall retention.

deeplinked mobile web routing

If you’re ready to learn how to deep link from your mobile website and provide an optimal user experience, this blog is for you.

Handle Every Edge Case for Deep Linking from Mobile Web

Branch has been providing deep linking tools for the last year, and there’s one thing we can confidently say: there is no consistency when it comes to deep linking protocols. Apple, Google, Facebook, Twitter, and the rest of the platforms continually launch new things that result in changes and breakages to deep link routing.

Over the course of the last year, we’ve now accumulated a system that handles over 6,000 different edge cases in link routing. In the last two weeks alone, with the release of iOS 9.1 and Android 6.0, Branch has added support for about 40 edge cases that were introduced by these platforms. When trying to build a mobile app, you don’t want to dedicate a full-time engineer to support mobile linking.

Even large engineering teams use third-party solutions to handle their deep link routing. The Pinterest engineering team depends on Branch for every page load and button click from their mobile site. Jeff, a growth engineer at Pinterest, said “We use the Branch web integration to create a smooth deep link experience for Pinners, which has improved our app install conversions.”

Let Branch Auto-Open Your App

The first step to deep link from your mobile site is to add the code that will tell Branch which deep link to use in order to auto open the app. If the platform and browser support it, and your app is presently installed on the device, it will open up immediately on top of the browser. If you’ve also prepared your app for deep linking, the correct page will open.

To initialize Branch on your website, execute the following code. This defines the Deepview link data and attempts to open the app. 

 Note: As of Nov. 4th, iOS 9 Safari, iOS 9 Facebook webview, and iOS 9 Twitter webview do not support auto-app opens.

Let Branch Handle All Clicks

Next, for your ‘View In the App’ button or call to action, you should call the following function. This will try to open up the app if it’s installed, then fall back to the appropriate app store page if not.

branch.deepviewCta();

If you want to change your HTML link to trigger the call to action, simply embed the method in the href field like so:

<a id='downloadapp' onclick='branch.deepviewCta()'>View this in app</a>

View The Conversions

With your deep linking all set up, you can view conversions on the summary tab of the Branch dashboard.

It will look something like this:

mobile web to app install

There are various metrics to understand when deep linking from your mobile website.

  • Views: a user viewed the mobile site.
  • Clicks: a user clicked on the Deepview CTA
  • Installs: a user installed the app for the first time
  • Upgrades: a user re-opened or upgraded the app from a previous version

It’s that easy. Just a few lines of code, and you’ve enabled state-of-the-art deep linking on your mobile site.