AMP Roadmap Update for End-Q3 2016

We’ve updated the AMP Roadmap to give you a clear idea of where AMP’s larger projects stand today. Below is a summary across the focus areas:

Format

The past quarter has ushered in support for several new use cases in AMP. Now you can publish live-updating live blogs with <amp-live-list>. We’ve also improved the user experience for ads, video, and other embeds in <amp-carousel>, with an update to enable swiping over iframes. In addition, soon you’ll be able to collect newsletter signups, enable basic site searches, and support other core forms use cases with the amp-form extension (which you can try out today experimentally).

Our focus over the next few months will include enhancements to the seamless transition from AMP documents to native apps, with the ability to promote app installations using <amp-app-banner>, and a component for better deep-linking. We’ve also added experimental support for image grouping in <amp-lightbox>, to enable more immersive experiences at the page and carousel level, and will continue to refine that toward an expected Q4 launch.

In addition, we continue to work on better, more immersive video experiences on AMP pages and platforms, as well as growing the AMP format for e-commerce experiences. This includes further enhancements to form support, component support for product galleries, and tabbed content navigation.

Analytics

In August, <amp-experiment> launched to enable running A/B-style content experiments on AMP pages. The past quarter also saw some improvements to <amp-analytics>: the ability to have a “hidden” trigger and support for element-level data variables.

Heading into Q4, supporting video and e-commerce analytics will remain focal points.

Ads

Recently we added support for a major publisher ask to improve ad monetization, multi-size ad requests. The A4A(AMP for Ads) team finalized the A4A format spec to allow publishers and advertisers to create innovative, performant AMP format ad creatives.

Heading into Q4, we are focused on ramping up delivery of AMP format creatives by supported ad servers. We are also working to ensure that A4A creatives are supported and performant outside of AMP pages. Last, we are working on some UX improvements for all ads in AMP, which includes features like consistent ad labeling and default placeholders and fallbacks.

Access

We continue to work on server-side access and sign-in support, and to seek input on these features. We hope to launch alpha versions of both in Q4.

* * *

Thanks to readers for your time, and to the AMP development community for your work taking AMP even further. As always, please let us know if you have any feedback.

Posted by Eric Lindley, Product Manager, AMP Project

AMP Roadmap Update for End-Q3 2016

Multi-size ad request support in AMP

The AMP project has always always strived to help publishers monetize the content they publish to AMP pages as effectively as possible. That means helping publishers capture the most advertiser demand possible for each ad slot on their pages.

One way we’re enabling publishers to do this is by allowing ad slots on AMP pages to serve multiple ad unit sizes, while maintaining AMP’s promise of a stable layout that doesn’t “jump around” in front of the user. With more ad units eligible to serve in a single ad slot, more advertisers can compete in programmatic auctions and drive up the revenue potential of that slot.

Today, we are announcing that both Yieldmo and DoubleClick have implemented multi-size ad request support for AMP pages.

The issue with multi-size ad requests today

Publishers have been using multi-size ad requests to optimize revenue across their web properties for a while now. However, the implementation to date has led to poor user experiences. Existing multi-size ad slots have caused pages to reflow, which in turn could lead to:

1) Accidental ad clicks taking the user out of the original content experience

2) Undesirable content experiences with content bouncing to fit the new ad unit

3) Poor technical performance of the page

The AMP solution

AMP always prioritizes user experience and page performance over anything else. Accordingly, it strictly enforces the principle of containment, i.e. the ad response can never cause the rest of the content to reflow.

AMP will always reserve the primary size required for the ad slot before the ad request is made. In order to support multi-size ad requests, the render-start API  was enhanced to accept an optional size parameter. When this parameter is sent by the ad tech provider, AMP will automatically resize the primary size of the container (when necessary) to fit the creative without causing page reflow.

Enabling Yieldmo clients to leverage multi-size ad requests on AMP

As an early supporter of the AMP project, Yieldmo has been deeply invested in helping publishers effectively monetize their content on AMP pages.

“Publishers and advertisers have been asking for us to provide multi-size ad request support in AMP for a while now. But doing this in a way that wasn’t intrusive to the user-experience was a challenge. We collaborated very closely with the AMP team on this project, even helping define some of the implementation. Integrating with the new API was really easy, and we’re excited to see how this new feature will drive revenue for our clients.” – Rahul Rao, Yieldmo.

For more details on Yieldmo’s implementation, check out the documentation.

To learn more about DoubleClick’s support for multi-size ad requests, check out the documentation and examples.

Posted by Rahul Rao, Director, SDK, Yieldmo & Vamsee Jasti, Product Manager, AMP Project

Multi-size ad request support in AMP

Experience the Lightning Bolt

Editor’s note: The following was originally posted on eBay’s Blog by Senthil Padmanabhan, Principal Engineer. 

eBay continues to leverage AMP technology to accelerate and improve mobile experiences.

Experience the Lightning Bolt

Shopify Merchants Will Soon Get AMP’d

Editor’s note: The following was originally posted on Shopify’s Blog by Haani Bokhari, Front End Developer. Read below to learn how Shopify is using AMP.

Today we’re excited to share our involvement with the AMP Project.

Life happens on mobile. (In fact, there are over seven billion small screens now!) We’re not only comfortable with shopping online, but increasingly we’re buying things using our mobile devices. Delays can mean the difference between a sale or no sale, so it’s important to make things run as quickly as possible.

AMP, or Accelerated Mobile Pages, is an open source, Google-led initiative aimed at improving the mobile web experience and solving the issue of slow loading content. (You can learn more about the tech here.) Starting today, Google is pointing to AMP’d content beyond their top stories carousel to include general web search results.

We’ve been playing with AMP for the past few months, tinkering with ways to improve the mobile experience for Shopify merchants. We’ve created an app that merchants can install to provide AMP to all of their products. This means, when a Shopify merchant’s product would normally appear in Google search results, a customer will go from results to checkout page in two quick taps. Over the next weeks, we’ll be slowly rolling out our AMP alpha for select merchants.

This work continues our commitment to open source projects, which you can find on GitHub, and to mobile projects that meaningfully benefit merchants. Keep your eyes on this space as we continue to work on AMP and share our learnings.

Posted by Haani Bokhari, Front End Developer

Shopify Merchants Will Soon Get AMP’d

A Faster Reddit with Accelerated Mobile Pages

Editor’s note: The following was originally posted on Reddit’s Blog by u/illymc, Product Manager, Channels. Read below to learn how Reddit is using AMP.

Reddit is creating web pages that load almost instantly by leveraging Accelerated Mobile Pages (AMP for short). Slow to load pages are the primary reason that 39% of mobile users are unhappywith their web browsing experience. Creating fast mobile web experiences turns out to be very challenging; Vox Media, a tech company whose sites get over 150 million unique visitors a month, declared “performance bankruptcy” in 2015 citing pages that took 23 seconds to finish loading on average. AMP is a game changer for the mobile web because it makes it easy to create pages that load in a tenth of a second. Google’s performance experts have helped create the AMP standard so you know it’s reliable.

Today, we are announcing the launch of tens of millions of AMP pages on Reddit. These pages load between 7 and 30 times faster than our previous mobile pages. Every self-post created on Reddit now has a corresponding AMP version. Google will be showing these pages in it’s search results more and more over time. These pages focus on the most important part of the Reddit experience — the great content our users create.

Here’s an example:

jeremy-blog-post-visual

We were pleased to discover that creating AMP pages was a snap for our engineering team. AMP is a set of components verified by performance experts at Google to load incredibly quickly. As a result, building web pages becomes more like putting together LEGO blocks instead of having to carefully craft every aspect of your page. Some product developers might worry that having a constrained set of choices would lead to a compromised user experience. However, we found that being limited to AMP’s components made it easy to focus our design efforts on the content that users come to Reddit for.

Today, most companies are creating separate AMP versions of pages they already have. Here at Reddit, we are so excited about AMP that we’re experimenting with developing new pages in AMP. AMP pages look great and load fast on desktop just like they do on mobile. Maintaining good performance to pages as they change often amounts to a time consuming game of Whack-A-Mole but we can be confident our AMP pages will always be fast. So, for many kinds of pages, we think the AMP version is the only version we’ll ever need.

Posted by u/illymc

A Faster Reddit with Accelerated Mobile Pages

AMP and React+Redux: Why Not?

Editor’s note: The following was originally posted on Reddit’s blog by u/arbeitrary, Senior Software Engineer. Read below to learn how Reddit is using React to enable AMP.

At Reddit, we recently built alternate versions of some comments pages that use Accelerated Mobile Pages (AMP) technology — a technology designed by Google and others in the open source world to ensure that pages load instantly from search results on mobile devices. We have implemented it to improve the Reddit experience for mobile users.

We’ve built this as a Node.js app using React and Redux. React is a modern web framework that solves a number of problems that occur during web development. Redux is a library that helps maintain UI application state and abstracts state transitions away from user controls and API callbacks, providing an immutable, single source of truth about application state to the view components. React and Redux might seem like an odd choice for an app that essentially renders static markup, but we found the combination to be effective. Our decision was more about people and productivity than the code itself.

We have an awesome team working hard on a new version of our mobile web app that uses React and Redux. It will replace the site currently running on m.reddit.com, and will ship in the coming weeks. The new app is a single-page app, which means that instead of the server rendering each page, client-side JavaScript code handles clicks, makes data requests to the API, and renders new views live in the browser. To support a great experience when the app first loads, we also support full and partial rendering of a page on the server-side.

Our primary goal for choice of technology to build the AMP app was to let us move quickly while creating a great user experience. Since AMP is a fundamentally mobile experience, we chose to use the new React and Redux-based version of our mobile web app as a starting point, but using it exclusively with server-side rendering. Starting with an existing codebase let us focus attention on how an AMP experience for Reddit should differ from the core mobile web experience. React let us use AMP components like amp-img or amp-accordion to build our views the same way we use any HTML element, so we maintained a consistent paradigm with our other React projects without adding glue for each new component.

As our AMP traffic increases, we learn more about AMP in production, and we continue to explore more ways to serve mobile redditors, the line between our AMP app and our core mobile web app may blur. We have intentionally left the door open for merging our AMP app and mobile web app together. At a basic level, this makes code sharing simpler while giving us flexibility to draw on fast-loading AMP to gracefully enrich the interactivity of our pages as new users become regular redditors.

From both a technology and user experience perspective, we’re excited about new tools and ecosystems like AMP and React. Both enable developers to write better code for a fast and engaging web. Anything is fair game when it helps us build solid technology for helping redditors find their home on the Internet.

Posted by u/arbeitrary

AMP and React+Redux: Why Not?

Google Search Results are officially AMP’d

Editor’s note: The following was originally posted on Google’s Inside Search Blog by David Besbris, VP Google Search. Read below to learn how Google Search is using AMP on Search results

Along with many others in the open source Accelerated Mobile Pages Project, we’ve been working to make the mobile web experience faster. In February, we launched AMP in the Top Stories” section of Google Search, delivering news in a fast and reliable way. In August, we previewed linking to AMPs across the entire mobile search results page. Today we’re excited to announce that we’re rolling out that faster experience to users across the world.  

Now when you search on your mobile device, you’ll see a label that indicates a page is AMP’d. This doesn’t change Search results but will show you which sites have pages that are ready to load lightning fast.

amp-result-v3-cellphonecase

Today, the median time it takes for an AMP page to load from Google Search is less than one second. Beyond just saving you time with fast loading pages, AMP will also save you data — AMP pages on Search use 10 times less data than the equivalent non-AMP page.

To date we have over 600 million AMP documents created by sites such as eBay (US), Reddit (US), Shopify (Canada),  Konga (Nigeria), WikiHow (US), Cybercook (Brazil), Skyscanner (UK), and many more from all over the world (232 locales and 104 languages). These pages cover retail, travel, recipe, general knowledge and entertainment. That’s a lot of fast-loading pages!

To find out more about AMP, check out ampproject.org.

Posted by David Besbris, VP Google Search

 

Google Search Results are officially AMP’d