App referral traffic to your web site and how to track it

Measuring referrals from mobile and tablet apps to web sites is extremely difficult – actually, its practically impossible. Over the past few years you will have seen traffic from direct/typed/bookmarked sources increase steadily as app usage has increased. Unfortunately this is not because your web site has become a destination for your chosen content, but instead its because your analytics platforms are unable to attribute traffic to apps.

I am specifically finding traffic from social media apps, so Facebook and Twitter, the hardest to track down. There are techniques that I discuss below that can help you to track content that you post yourself, but unfortunately this doesn’t help with organic sharing.

While Facebook Insights for domains does give you some level of overall referrer information, it does not breakdown the traffic between desktop and mobile.

This post explains why your analytics package is currently unable to track this traffic and tries to find some solutions to help you to make sense of it all.

So how do analytics platforms track referrals?

Most analytics packages use header information contained in your user’s web browser to determine which site the user had been to previously to visiting your web site. This header information only appears if a user clicks on a link to your site. For example, if I am on web site A, click on a link to web site B, then the header information would show that the referrer was web site A.

Just so we are clear, if I am on web site C, then type web site D’s domain name into my web browser, then there would be no referrer and the traffic source would be Direct.

No referrer in the header

This latter example explains why measuring app traffic is extremely difficult; an app is not a web site, it is not viewed in a web browser and they do not contain header information when linking out to a web site.

There are two different techniques that apps can use to open up web content:

  1. Open the content in a native mobile or tablet browser – such as Safari, Chrome, Android Browser, Opera etc
  2. Open the content in an in-app version of the native browser

In both cases, because the app is opening up a new instance of a web browser, whether its the native browser app or the in-app version of the browser app, there is no referrer in the headers. So when your analytics package is seeing the user visiting your web site, it is seeing that there is no referral and  it will deem the traffic to have no source and therefore assign that referral as direct.

So how can we track app referral traffic?

There are a couple of things that we can do as content creators to get around this:

Google’s UTM Tracking: https://support.google.com/analytics/answer/1033867?hl=en

If you use Google Analytics, you can use the built in UTM tracker to track links that you post to other web sites or platforms. Quite a few URL shortening services and sharing plaforms such as Buffer, Bit.ly and Owl.ly allow you to add these dynamically so you don’t need to keep adding the tracking manually.

When a user visits your site using a UTM tracked link, this will override what is contained in the web browser’s header and attribute the source of the traffic to relevant keyword that you add to the tracking. You need to be very careful here as I have seen instances where these have been setup incorrectly and links posted to Facebook with Twitter as the source have been shared which makes the data inconsistent and unreliable.

One thing to note on this, is to only use this method for external, inbound site links. You should not use these links on internal links as they automatically start a new site visit – meaning that you will see a spike in visits whenever someone clicks on your tracked links.

Using a similar service for other analytics platforms:

Many other analytics platforms have a similar method for campaign tracking. While these have been primarily used for more traditional marketing campaign tracking, there is no reason why you cannot do use this same method for the sharing of content.

Limitations

This would only work for content that you share yourself. There is no way to enforce this for any organic shares – so when a user copies and pastes a url from your web sites into a social status update for example.

Also, as you cannot post content to a specific device or platform, you cannot differentiate easily between a social media’s desktop, mobile web or mobile app experience. So while you may get closer to tracking Facebook traffic, you will still not know the make up of desktop, mobile web or mobile app referrals.

 

Mobile Native Browsers vs In-App Browsers

I was surprised to find that Adobe Analytics (Adobe SiteCatalyst or Omniture, depending on how far back you go) doesn’t allow you to report on mobile browsers. Even though, I’ve been using Adobe SiteCatalyst for many years and I had always assumed that the ability was there. I am actually a little ashamed that I hadn’t noticed this before.

SiteCatalyst Device Type with Browser Breakdown
SiteCatalyst Device Type with Browser Breakdown

The main reason for me to look at this was that a colleague sent me a link about Embedded Mobile Browser Usage on http://www.lukew.com. While the blog post is more to do with how developers should be testing on in-app versions of mobile browsers as well as native browsers. This is mainly due to the in-app versions of Safari and the native Android browsers having less functionality and lower rendering powers. Luke explains that the in-app version of Safari for example does not include the Nero Javascript engine, certain Safari caches, or the “asynchronous” rendering mode. Meaning that web sites could appear to load more slowly, contain errors etc that would normally not be detected if testing on the native versions.

As Facebook and Twitter app usage continues to grow, its going to become more and more important to understand the differences between these different browser types and how users browse your sites when using these apps. In addition, when users click on your content from apps such as Facebook and Twitter, they appear as either Direct or Typed/Bookmarked depending on which analytics package you use and whether you are using any form of campaign tracking or not.

When I realised that Adobe Analytics does not track mobile device browsers, I turned to our implementation of Google Analytics. Fortunately, GA does track in-app browsers on iOS – so you can see data for Safari and Safari (in-app).

What I have found in my initial dive into this is that users browsing our sites using an in-app verison of the native browser consume less content (in terms of pages per visit), has a higher bounce rate and are on the site for about half the time than the native version.

In-app browsers vs native mobile browsers
In-app browsers vs native mobile browsers

What is going to be hard to work out is whether this is due to a behavioural or technical motivation.

If the site renders slowly, contains certain errors, or is not fully optimsied for the in-app experience, you could attribute some of the reduction of usage to this rationale.

In terms of behavioural, you need to consider what users are doing. If I am on my Facebook app on my phone, its probably while I am in the middle of doing something else. Potentially on the toilet, in a meeting (hopefully my boss is not reading this) or in transit therefore I have limited time to view.

Also, to move this point further, if I am in my Facebook app, I’m also interested in seeing what other content my friends have posted. So I might just read the article that a friend posted, then click back in the app so I go back to my feed and continue my Facebook journey.

One of the main things that I tell colleagues at my job is that Analytics is great at telling you what happened. Trying to find the reasons behind a person’s behaviour is not generally achievable. You can find commonalities between certain types of users, segment them and try to implement changes to convert users to behave in the same way. But in terms of understanding the drivers for users to act in a particlular way is not something that I believe Analytics will answer.

You need to be talking to your users and understanding why they are doing what they are doing – whether it be done through social media, email or surveys. You really need to have all the information to make decisions and I believe that Analytics is only one part of it in this case.

Prioritising a backlog doesn’t need to be rocket science!

The common component in most software development agile practises is the backlog – a list of user stories, often written on cards, that represent a feature or a piece of work that needs to be completed by a member of the development team.

This backlog of work needs to be prioritised – and I have seen different people do this in different ways.

I’ve seen these items prioritised individually in excel by a single individual, where many different factors have been scored and a calculation applied to give a final score where weightings have been applied. This took a lot of time and a lot of toing and froing – all the while the development team were working on lower value items. Made no sense to me.

This list is then ordered largest value to smallest, resulting in one person’s opinion on what his list should be. This did not take into account any development team member’s experience, as well as any other teams that may be impacted by the work.

Any new items would need to be scored in this fashion, debated extensively and then slotted in to the backlog.

As far as I am concerned, this is not the way to prioritise work – especially in an agile environment.

A big part of agile is collaboration, responding to change and having working software at the end of each release. Why not apply these five principles to prioritisation.

Get everyone together

If someone is involved or impacted by the functionality being discussed, get them involved in the prioritisation – within reason obviously. At least have each department represented and ensure that there is one mediator and someone who can make a final decision if there is a disagreement.

Understand the goals

Set out at the start what the strategy is for your product and set out the objectives. Each user story or card needs to constantly compared to these objectives and ranked according to how far it goes to achieve these goals.

Relative priority

Keep things simple. Select a starting point buy placing a card in the middle of a table. Discuss this card and ensure that all involved understands exactly what this card represents and how it helps to achieve your product’s strategy and objectives.

Select the next card, discuss what it is and explore it’s benefits, risks, amount of dev work etc and then place it above the card if it is more important or below this card if it is less important.

Keep doing this with each card until you have a fully prioritised backlog. If its a big backlog, then you may need to split this into a couple of sessions.

Be flexible

Through discussion, you may find that items are no longer required or require more definition or to be defined. You can do this in the meeting itself or separately.

Future proof

Once finished, when new items come up, they can be easily prioritised as all members of the team understands the backlog and how it is made up. You place the new feature in the backlog relative to everything else.

In my experience, this is by far the best way to prioritise work. Having items prioritised relatively compared to other work get’s the business to understand that they cannot have everything all at once and that a decision has to be made as to which is more important than the other. You do not have a spreadsheet that gets ignored with multiple items with the same value.

Items can be redefined as you go and the team as a whole has been included and feel valued. The whole team has a voice. This leads to highly motivated team who have bought into the product and what is trying to be achieved.

A Practical example of Feature Driven Development

Feature Driven Development (FDD) is often theorised about on many web sites with blog posts, articles and essays being published on a regular basis and this blog post will give you a much needed practical example of it in use.

One article that is worth pointing out is DZone’s Introduction to Feature Driven Development. This is part one of a two part article describing a theoretical project and a theoretical team and the first three of five steps to achieving Feature Driven Development. It is extremely well written and gives you some really good insight into what is needed.

In my experience, I find that when you take these theories and methodologies and apply them to real life situations and projects, that they need adapting and shaping to fit with what you are trying to deliver.

An example of this is when I was leading the Product Development across five different web sites and one development team. The way in which I had implemented the Kanban methodology was different for each site due to different stakeholders and different commercial strategies needing to be delivered.

Anyway, back to a practical example of Feature Driven Development.

The example that I am using is the build of Mousebreaker, a casual gaming site that utilised a mixture of Kanban and Feature Driven Development to quickly and effectively deliver a new web site with a new code base in 28 days.

Traditionally, my approach had always been to gather all requirements, build the infrastructure, then the code, and finally the front end for a web site.  This information gathering and the writing of functional and technical specs can take a long time to complete. Then, when the development begins, the whole spec needed to be delivered before the site could launch. By which time 6 months has passed and requirements may well have changed and what is delivered is not necessarily what the business or the market needs.

Feature Driven Development tries to get around this by defining the requirements as features, then the business owners and development teams prioritise these features into a backlog of work and then the developers deliver these features in the order that offers the most business value.

One thing to note is that there is some pre-work that needs to happen before development can start. The general technical approach needs to be agreed; technologies need to be discussed, terminology needs to be agreed and basic development, testing and live environments need to be created.

In addition, certain standards would have been discussed such as coding, SEO and accessibility standards and any automated testing. In addition, any front/back end frame works that will be used as well should also be discussed.

If you look at the Mousebreaker site, you will see that the primary user function is for the user to play flash games. So the first feature that was worked on was that the user needs to be able to play a game on a web page.

At first, the developers approach was to start building a database infrastructure that could be used for the whole site. They were also wanting designs for pages etc. You need to be careful here as that is not what was required by the feature. All the feature required was for the user to be able to play a game. Nothing else.

So to deliver this feature, all that was required was a static html page with some embed code that would allow a user to play a game. The game needed to be in a web facing folder.

Once complete and tested, the feature can then be released.

The next story was that a user needs to be able to play all games on a web page.

This is where the database gets created and the initial html page is turned into a template. Again, the developers only needed to create a database that delivers the feature’s requirement.

In the meantime, while the initial features were being delivered, the designers were working with the development and business teams to deliver the designs for the site. There was a further feature for the site to have a premium look and feel that eventually would need to be delivered which could be applied to the site around the templates that were being delivered.

This felt a little back to front, but you need to remember that we were delivering features in the order of business priority.

As the features kept being delivered, the site quickly started to take shape. Throughout the development, the business representatives were always attending the stand ups and were constantly making decisions on scope of work and what would be required for launch.

We found that the close collaboration between the business and the development team was the most effective way of managing scope and ensuring that what the dev team delivered is what was expected.

I have applied this form of Feature Driven Development many times and I find that it really works. You do need buy in and effort from the business owners, and you do need to make sure that the developers do only focus on what is required to deliver the features rather than architecting a full solution before understanding all the requirements.

This allows more of a front to back development process. Where the features take priority over the implementation. One thing that I would like to point out is that there would be occasions where future considerations are sometimes ignored or put to one side to get functionality out and that this may result in refactoring work further down the line.

The thing to remember is that you will have already delivered the highest business value functionality required at that point and that the business will understand that any refactoring work should also have a value and then a discussion can be had about options and whether this work needs to be done or not. If it does and it takes a longer period of time, then allowances should be made for this.

Interesting piece on personal data held by Facebook

Interesting piece on personal data held by Facebook

Facebook Registration – Breaking down the registration barriers

Recently Facebook announced a new social plugin called Registration. Registration allows web sites to integrate a sign up form via an iframe or fbml that is hosted by Facebook.

I am working on a project that requires registration and we have decided to try this out so a lot of what you see in this post is first-hand experience of how it works.

This form can be customised to include bespoke fields that you may want to collect. By default it does not ask for a password for example, but that is easily added. Similarly, if you wanted to add in check boxes, free text boxes, options etc they are all simple additions.

Check out the Custom Fields example on the Facebook Registration page. When a user arrives at the registration form and are logged into Facebook, any compatible fields are pre-filled in therefore reducing the need to fill out copious amounts of data about themselves. This will help to reduce the barrier to entry for many users who are often put off by registration forms.

If a user doesn’t want to pre-populate the form with their Facebook data, they can remove this from the form by clicking on the [x] next to their name and photo on the form.

So what happens to the user’s data?

If a user is logged into Facebook and is filling out the form, any extra data that is compatible with Facebook is added to their Facebook profile. In the Custom Fields example on the Facebook Registration page, if you click on the text box for Current Location, a pre-ticked check box appears which says ‘Save this to my Facebook Profile’.

As a site owner, you can disable this for any custom fields that you add to the form by adding in the no-submit function to the integration.

If a user does not have a Facebook account, they are not automatically signed up.

Submitting the form

When a user submits the form, you can do some form validation before Facebook processed the form and returns the user data to you as json – a lightweight text-based open standard designed for human-readable data interchange (Wikipedia). The registration plugin can also do this over SSL which we would recommend as best practice for security reasons.

There are some issues currently with the validation – namely that if a form fails validation it can sometimes not run the validation a second time. I’m sure that there are ways around this – by doing your checks server side – which we are still investigating.

Once you have the data returned to you as json, the website needs to process that data and store it.

Key feature

You may think that the pre-filling of personal data would be the killer app for this product. Whilst it is a pretty important feature, my personal favourite feature is it shows any of your friends that have already registered on the site – giving users social proof that the site is worth registering for and that they are not doing this blindly. Giving further incentive to users to register.

The end?

Nope! Once you have the data stored in your database the web site still needs to handle things like logging in, profile pages,editing of profiles, forgot passwords etc.

Final thoughts

The Facebook Registration plugin is definitely a step in the right direction for Facebook. For them, it allows further integration of their platform into external websites as well as gathering further incremental information about their users.

For the websites, it takes out a big chunk of development that would be required to create a new registration system. It also reduces barriers to entry by having the form pre-filled in most cases so therefore converting non-registered users to registered users should be easier.

It will be interesting to see where Facebook goes with this. Whether they will extend the Facebook Connect product to help with editing locally stored profile information and profile pages.

I do think that this is one of the bets plugins that Facebook has released and its still early days.

I’ll post updates as and when I have them.

Closing the Viral Loop – Beyond the Facebook Like Button

Most web pages that you visit nowadays contain a version of the Facebook Like Button.

Most web site owners assume that users know exactly what the like button is for, but what is it for? What exactly can be done with it?

In its most basic form, when a user likes a piece of content it appears on their Facebook Wall for all of their friends to see.

I suppose that the hope of web site owners is that the user’s friends will see this and then send users back to this piece of content. This concept is known as ‘Social Proof’ – where you are more likely to do something if one of your friends deems it ok to do so.

See http://en.wikipedia.org/wiki/Social_proof for more information on this.

So I can see why those who like to show off what they like to their friends would want to do this, but what about those users who are more passive in their consumption of media.

There is a rule that states that, with social media, 90% of passively consume media, 9% interact with content and 1% create the content. If we use YouTube as an example, that means that 90% of users watch videos, 9% comment on those videos and 1% actually upload the content.

If this is the case for the like button, only 9% or 10% of users actually use the like button. How do we engage with that 90% of passive internet users?

My suggestion would be looking to close the viral loop.

Closing the Viral Loop

I believe that users would be more likely to click the Facebook Like button if they knew what was going to happen and that they were going to get something in return from it.

Web site owners are asking users to be active on their pages, to help promote that content to users without asking for anything in return. This is a very lazy way to try to grow traffic.

What steps could be used to make the clicking of the Like button more attractive to users?

Firstly, box out the like button and tell them what it will do. ‘Do you like this story? if so, click the like button.’

If users are liking your site versus a piece of content and if they click like, they will receive updates straight to their Facebook news feed – tell them!  This would appeal to their passive consumption.

‘By clicking the like button, you will receive content updates to your Facebook wall so you don’t need to keep checking back on our site.’

The Open Graph – closing the viral loop

This is where the most interesting bit comes into play.

If a site has been more sophisticated with their integration and also integrated the Open Graph at the article level, users could actually be liking a product, an actor, a musician etc.

If this is the case, then I believe that closing the viral loop becomes extremely important.

If a user is on a music news web site, such as www.nme.com, and they are on the Black Eyed Peas artist page – http://www.nme.com/artists/the-black-eyed-peas – and they click like, they should receive updates from NME every time that there is new content posted up about the Black Eyed Peas.

At the moment, there is no incentive to Like the Black Eyed Peas – not unless the user is just that passionate about the band.

There is also no call to action. Just a plain old tiny Like button.

If the like button had a call to action and had its content feed for Black Eyed Peas set up correctly, it would be much more appealing for users to click.

‘Click like to get updates from NME every time we post new content on the Black Eyed Peas’

This would be the same on all sites across the Internet and I would argue that this would result in many more users engaging with the Like button.