New tools for building user controls in AMP pages


A couple weeks ago, we talked about our plans to give publishers and tech vendors tools to implement their preferred user controls on AMP pages. Today we’re announcing the initial availability of these tools.

We are introducing the new <amp-consent> component, in AMP, as a new tool for publishers to implement user controls. The component enables three main things:

  • Determining if the user should be asked to interact with the control.
  • Capturing the user’s decision — either a positive response or a negative response — and remembering it for future use during the current page lifecycle and future page loads.
  • Making the user’s setting available to elements on the AMP page in order to modify the page’s behavior.

Determining if the user should interact with the control

User controls may be applicable for certain users or circumstances but not others. Publishers can specify a remote URL to ping in order to determine if the user will be prompted to make a choice, thereby setting the control. If so, a UI container will be presented that is completely configurable within the page and can be used to capture the user’s choice.

Capturing the user’s decision

The currently supported semantics for a user control are either an “accept” or “reject” action. The publisher can designate a button corresponding to each of these choices. In addition, the publisher can implement a “dismiss” action, which will result in neither state being set and the user control remaining unresolved.

Modifying element behavior

Once the user has made a choice, the publisher can specify how the page should behave to respect that choice. By adding a simple HTML attribute, publishers can configure AMP elements  to be blocked from loading if the user setting is undetermined or is in a negative state (that is, the user rejected). This makes it possible to, for example, only load ads and/or analytics when user consent is given. Additionally, elements can be further customized by vendors to have more sophisticated behaviors that depend on the user’s setting.
Check out the documentation to learn more about how to implement and configure amp-consent. You can find some sample implementations on AMP by Example as well.

We plan to add more features to <amp-consent> over time. You can find some already planned ideas on GitHub and we invite you to submit new ideas by filing an issue. If you’re a vendor who wants to customize how your AMP extensions behave based on user controls, please get started by following our contribution guidelines and reading documentation on the topic here.

Posted by Rudy Galfi, Product Manager for AMP