Keen – AMP: New Integration for Publishers to Show Authors Engagement Data

With smartphones and tablets now the go-to devices for web browsing, readers and shoppers are often frustrated by slow page load times. The open-source Accelerated Mobile Pages (AMP) project, spearheaded by Google, was intended to solve this problem, providing a framework that allows websites and ads to load fast on all devices.

The drawback for publishers, however, was that the lack of AMP analytics created a blind spot in the user-facing metrics and analytics that they could provide to their authors. After collaborating closely with the AMP open-source community, we are proud to announce that The Keen AMP analytics integration has officially launched!

The Keen AMP analytics integration means that all our customers now have the ability to:

• Easily track events on AMP pages with our out-of-the-box config that simply requires dropping in a piece of code
• Create a custom config using AMP-powered triggers and variable substitutions
• Ensure snappy website loads thanks to data requests sent by the Beacon API

This article will detail how we worked with the AMP community to overcome the challenge of harvesting AMP metrics, two ways that you can implement Keen AMP analytics code on your website and what this integration means for your business. We’ll also offer a look toward the future.

Collaborating with the AMP Community to Innovate

Originally, AMP analytics would send POST requests without a body contained inside. AMP developers knew about this issue from feedback from the dev community. Unfortunately, the limitation meant that there was no way to send data back to the Keen API.

At Keen, our collective focus is to be as close to the leading edge of technology as possible. Our development team stays abreast of web trends and open-source initiatives, and clearly, AMP’s commitment to speeding up the browsing experience for users is exciting, so we collaborated with AMP developers as they worked to fix this issue. We are incredibly thankful for all of the work those folks inside the AMP project have done to enable Keen to now provide AMP analytics!

Implementing Keen for AMP Analytics

Keen customers can immediately take advantage of our AMP analytics integration by implementing a small amount of code. But first, you need to decide whether to implement Keen’s standard predefined config file or create your own custom integration. Let’s review each option, steps for integration and some of the benefits and drawbacks:

1. Keen’s Standard AMP Analytics Config File

This is the simplest and most straightforward way to integrate with AMP. Using our predefined config file, you will automatically begin receiving analytics from your AMP website for a number of items, including browser type, device type, language, and URL tracking parameters. The entire list of variables included in Keen’s standard AMP analytics config file—along with the meaning of each variable—can be viewed on GitHub.

First, you will make sure that you have a Project ID and Write Key from Keen. You can request a demo of Keen or log in to an existing account to get this information.

Next, you’ll replace “YOUR_PROJECT_ID” and “YOUR_WRITE_KEY” with your own values in the following code (view it on GitHub):

<amp-analytics type="keen" id="keen1">
  <script type="application/json">
  {
    "vars": {
      "projectId": "YOUR_PROJECT_ID",
      "writeKey": "YOUR_WRITE_KEY"
    },
    "extraUrlParams": {
      "someCustomParam": "some value"
    }
  }
  </script>
</amp-analytics>

After doing that, you will place the script tag to load amp analytics .js in the header of your site. Configuration should be in the body: https://ampbyexample.com/components/amp-analytics/

Note that while this is the easiest way to get started, you may be returning data that you don’t need—the extra time it takes to get variables that you don’t care about could adversely impact your page load time. If you need only a select few variables, you may want to consider doing a custom integration.

2. Custom Keen AMP Analytics Config

Creating a custom Keen AMP analytics integration means that you, as a developer, will have full control over the data you gather. The major advantage of a custom config is that you can eliminate the variables that you aren’t interested in monitoring. This will reduce the size of the POST request, resulting in faster execution. Plus, sending the smallest possible number of variables is the right thing to do if you’re concerned about privacy issues.

Again, you will need to start by getting a Project ID and Write Key from Keen. You will put them in the following code (this can also be found on GitHub):

<amp-analytics>
    <script type="application/json">
      {
        "vars": {
          "projectId": "YOUR_PROJECT_ID",
          "writeKey": "YOUR_WRITE_KEY"
        },
        "extraUrlParams": {
          "someCustomParam": "some value"
        },
       "requests": {
          "pageview": "https://api.keen.io/3.0/projects/${projectId}/events/pageviews?api_key=${writeKey}"
        },
        "triggers": {
          "trackPageview": {
            "on": "visible",
            "request": "pageview"
          }
        },
        "transport": {
          "beacon": true,
          "xhrpost": true,
          "img": false,
          "useBody": true
        }
      }
    </script>
</amp-analytics>

You can then place as many variables as you want to track inside the extraUrlParams property. All of the strings, integers, arrays and objects that you put inside the extraUrlParams will be sent to Keen’s API and saved in a database. While this implementation may take a little more time, it will return only the data that matters to you and may further speed up your site.

Impacts of AMP Analytics for Publishers

Delivering analytics on websites with AMP implementation is essential: publishers are looking to provide a better understanding to their writers of how their content performs. And since such a high percentage of traffic now comes from mobile devices it’s important to note that:

• AMP sites can load much faster for mobile visitors, which can result in lower bounce rates and increased customer satisfaction
• Google has recently begun to reward AMP sites with higher placement in organic search

Since the AMP project was started in 2015, we’ve noticed a few key trends. With the proliferation of digital advertising—including audience retargeting and autoplaying videos—many websites have become bloated. This results in a very poor experience for users, especially those on mobile devices that may have less-than-optimal speeds.

The goal of AMP was to solve this issue, attempting to strip out many of the scripts and other add-ons that were slowing down the web. The project did this to amazing effect, but cutting down to the bare bones came with a cost: while consumers were happy, businesses and publishers were unable to gather audience insights.

Today, we see the AMP project beginning to come into harmony with both consumer and business needs. After all, what good is a technology that can snappily serve web pages if it lacks analytics?

Looking toward the future, we see this continuous push-and-pull between consumers, businesses, privacy and data analytics. And with our team at Keen focused on building user-facing metrics solutions for developers, we will be innovating as the industry evolves.