That which glitters is not always gold…or is it?

AMP was created to make the mobile web faster, but to do that, restrictions were enforced —like the limitations regarding custom code, HTML/CSS, and JavaScript. The 75kb CSS stylesheet limit is evidence of that because any web page that exceeds that will fail AMP validation.

Even with its limitations, digital marketers can customize pages with many AMP components. These specialized HTML tags act similarly to traditional HTML tags (with opening and closing tags, attributes, and some CSS styling capabilities) and are easily identifiable, always starting with the amp- prefix.

The complete list will likely be added to on an ongoing basis, but the following 23 AMP components give you a good idea how customized AMP pages can be.

(Instapage now offers AMP custom code to enable a wide variety of components. Go here for full details.)

23 AMP components to customize your pages

1. Accordion

Adding amp-accordion to your page provides an outline of the content and allows visitors to jump to a certain section of the page. Each of the AMP accordion’s immediate “children” is considered a section in the accordion (each section must contain only two direct “children”), and the first child of the section is considered the section heading. Clicking the heading will expand or collapse the section:

Two additional options for the AMP accordion component are nested accordions (to nest or stack multiple accordions within each other) and auto-collapsing accordions (which only allows one expanded section at a time).

2. Audio

Instead of the traditional HTML5 audio tag, AMP uses its own version: amp-audio. The AMP audio component can only be used for direct HTML5 audio file embeds, appearing on the page like this:

Although the audio controls shown above (play/pause, sound/mute, and download) are added by default, the download button on the right can be disabled:

3. Call tracking

AMP-call-tracking simply replaces static phone numbers with phone numbers designed for call tracking analytics.

4. Carousel

The AMP carousel component displays multiple images along a horizontal axis, with several different amp-carousel formats to choose from.

You can use type=”carousel” to display a list of images as a continuous strip:

5. Facebook

The AMP Facebook component embeds Facebook posts, images, and videos into AMP pages, only requiring the Facebook URL.

6. Facebook comments

AMP-facebook-comments allows embedding Facebook comments into AMP pages.

7. Facebook like

AMP-facebook-like allows embedding the Facebook like button into AMP pages.

8. Facebook page

AMP-facebook-page embeds a Facebook Page into AMP files, only requiring the href of the Facebook Page. The AMP Facebook Page component even allows you to show different tabs on the Facebook Page. For example, you can display the timeline and events tab by specifying data-tabs=”timeline, events:”

9. Font

The AMP font component allows you to design your pages with custom fonts in the body or header of the document:

It the chosen font isn’t supported, it displays as plain, red text:

10. Form

The AMP form component enables you to design AMP pages with detailed lead capture forms. The extension also allows you to provide success and error responses with special attributes, submit-success and submit-error:

11. Geo

The AMP geo extension allows small sections of content based on an approximation of a user’s location (country-level only, similar to the level of an ISO Country Code). It also offers the option to group different locations together, making it easier to apply attributes to several geographies at once.

12. iFrame

AMP-iframe embeds content into AMP pages via iFrame, which is ideal for displaying content otherwise not yet supported by AMP (Vimeo, Giphy, Google Maps, etc.).

AMP-iframe allows resizing the iFrame at runtime — either on page load (the embedded iFrame will resize itself to 200x200px) or on user interaction (pressing the button will resize the iFrame to 300x300px). The only restriction with this AMP component is that it must be either 600px away from the top, or not within the first 75% of the viewport when scrolled to the top — whichever is smaller.

13. Image lightbox

The AMP image lightbox component allows the user to expand AMP images to fill the viewport. You can also optionally display an image caption at the bottom of the viewport like this:

14. Instagram

Instagram videos and photos can be embedded into your AMP pages with amp-instagram, using the data-shortcode found in every photo/video URL. You can also include captions with the data-captioned attribute:

15. Lightbox gallery

AMP-lightbox-gallery provides a “lightbox” experience for other AMP components, such as amp-img and amp-carousel (only images are currently supported). When the visitor interacts with the AMP element, a UI component expands to fill the viewport until they close it again. If your page contains multiple elements, simply add the lightbox attribute to each image you want users to view in a lightbox.

16. Pinterest

Using amp-pinterest, adding a “Pin it” button to your page allows visitors to pin various content from your site:

To add a “Pin it” button, you’ll need these attributes:

• data-url: the URL to be shared
• data-media: the image URL to be pinned
• data-description: the default description that appears in the Pin

Or you can embed a complete Pin widget:

In this case, the data-url attribute must contain the fully-qualified URL of the Pinterest resource.

17. Pixel

The AMP pixel component is a fast way to track pageviews. AMP-pixel is a built-in component that doesn’t require loading an extension.

18. Reddit

Reddit posts and comments can both be included on AMP pages with amp-reddit. The AMP Reddit component requires you to specify between post or comment, and the source of the embed. When embedding comments, include the parent comment by specifying data-embedparent=”true”, and include updated comments by specifying data-embedlive=”true.”

19. SoundCloud

Visitors can play SoundCloud tracks on your AMP pages when you use the AMP SoundCloud component (all you need for amp-soundcloud is the trackid found in the SoundCloud embed code):

You can even embed a full SoundCloud playlist with the playlistid (also found in the SoundCloud embed code), by substituting data-trackid with data-playlistid:

20. Twitter

Similar to the other social media AMP components, amp-twitter embeds Tweets into your AMP pages:

If no image is necessary, or you’re trying to save space on your page, you can choose to deactivate Twitter cards using data-cards=”hidden:”

21. Favorite button

The AMP framework allows marketers to add a favorite/like/bookmark button. It also offers a more sophisticated version that includes a favorite count, and updates this number when the button is clicked:

22. Payments in AMP

AMP pages can support requesting payment information directly from the browser. To request payments in AMP, you’ll also need amp-iframe. Here’s an embedded iFrame with a “Buy Now” button, with all of the actual payment logic contained within the iframe src itself:

However, since AMP restricts JavaScript, the iFrame source must also handle instances where PaymentRequest isn’t available. Other options include:

• Swapping the “Buy Now” button for an “Add to cart” button
• Redirecting users to a standard checkout form

23. Star rating

Star-rating capabilities may be added to your AMP pages, with features including touch, mouse, and keyboard accessibility, and color-changing stars when the user hovers over them:

Which AMP components will you add to your page?

Even with AMP’s limitations, designing a beautiful, customizable page is completely possible. The 23 components above are only some of the additions you can make to your AMP pages to maximize conversions.

With the AMP feature in Instapage, marketers can create optimized landing pages with a user-friendly builder, advanced analytics, a built-in validator tool, and more. Start creating faster landing pages today. Book an Instapage demo to see how.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

When AMP launched years ago, it was intending to speed the mobile web by restricting the use of certain page elements. Today, though, between workarounds and new developments, it can support dynamic content and even entire websites.

Still, the misconception remains that it’s only effective for static content. And this isn’t the only misconception. Today, we set the record straight about key components of the AMP format and how they’ve evolved.
How the AMP format has changed
1. AMP contributors are growing in number and variety

AMP started as a small, Google-backed project with only two contributors. By 2018, 700 people had contributed to the project. A year later, that number had increased to 1,000 contributors from other sites like Twitter, Yahoo, eBay, and Pinterest. Only 22% of the contributors were from Google:

AMP format updates contributors
2. Google has given up control

Since Google launched AMP, it’s been open-source, with major decisions about its future left to Matt Ubl, AMP project lead.

However, projects like AMP impact the entire web: businesses, people, jobs, information, and more. And that’s why Ubl and his team planned to relinquish control to a governing body representative of the community that helped to build it.

Recently, the team followed through with that plan, by putting a “consensus-seeking governance model” in place. Says Ubl:

When choosing a governance model (a system that describes how decisions are made) for AMP, we initially focused on agility. AMP has always been powered by the voices and feedback of the developers and organizations that use it. However, governance was centered around the tech lead (which is me, the author of this post), who ultimately decided what got executed and how.

While this works great for smaller projects, we’ve found that it doesn’t scale to the size of the AMP Project today. Instead, we want to move to a model that explicitly gives a voice to all constituents of the community, including those who cannot contribute code themselves, such as end-users. The change we are proposing is based on months of research, through which we’ve decided to follow the lead of the Node.js project and move to a consensus-seeking governance model.

Coming to this decision involved consideration of the goals they wanted to achieve:

They wanted to encourage a variety of people to dictate the future of AMP: deciding features, bugs, contributions, etc. And that includes people who don’t contribute code, but are affected by AMP.

They wanted to clarify how an individual and a company can contribute to AMP. This extends beyond approving code to activities like setting product and tech road maps.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

Slow web pages make for low conversion rates. Research has shown that even a 100ms slowdown in load time can affect conversions on a web page. Ultimately, users don’t want to wait. It’s that truth that set Google out to speed the mobile web with Accelerated Mobile Pages years ago.

And though the AMP framework has grown capable of accommodating a variety of web pages across a variety of verticals, some still believe AMP can’t speed much beyond a static web page. Today, though, AMP is capable of serving dynamic content, checkout pages, entire websites, and even progressive web with its lightweight framework. As a result, brands are increasingly turning to AMP for ecommerce.

Using AMP for ecommerce

There’s a reason ecommerce brands have been slow to invest in AMP: Their needs are much more complex than the needs of news publishers, which AMP initially set out to serve. Ecommerce brands need product listings, login capabilities, dynamic content, checkout pages, and the highest levels of web security.

But years after its initial release, AMP is enabling ecommerce brands to meet these needs, with new components and technical workarounds that bring high-speed load times to all kinds of pages. Here are just a few impressive things AMP can support now:

• Dynamic content: The content of an ecommerce website is ever changing. AMP support for dynamic content ensures customers are always seeing the most up-to-date information.
• Checkout/payments: AMP now supports shopping carts, checkout flows and payment processing. Now, users can purchase directly from your AMP pages.
• Personalization/log-in: Personalization is the cornerstone of any relevant marketing campaign. Now, through AMP, you can provide personalized content to your customers, like recommended products and updated carts.

So how does AMP do it? And how can you? From amp-bind to amp-selector and beyond, here are some components you can use to create product pages, category pages, shopping carts, and more.

Useful components for AMP for ecommerce

1. Product pages

Often, users arrive at your product pages through a category page, a homepage, social media, or a paid advertisement. These pages detail your product’s features and benefits, and they’re highly visually appealing, with bold hero shots and enough angles to inform your visitor.

Creating them with AMP involves elements like amp-carousel and amp-video, which you can use to create striking hero shots, informational photos, and comprehensive videos.

For long product descriptions to accompany your photos, look to amp-accordion for the ability to expand and minimize content. The element amp-form will enable you create a comments system for your visitors to leave reviews of your product:

For something a little simpler, custom CSS will make it possible to enable a star review system for product ratings:

And with the element amp-social-share, you can offer users the ability to share the product to social media.

AMP can also now support a shopping cart, and “add to cart” button, when visitors are ready to purchase. And if they’re not, you can use the element amp-sidebar to implement a navigation menu across all pages. This is just one example of a product page built in AMP:

2. Product category page

Users often start their journey from a site’s homepage or a product category page. These are great pages to AMPlify first, as eBay discussed in their post.

These types of pages are very well suited for AMP. The content is typically static and geared toward offering the best showcase of available products.

Particularly useful on product category pages are elements like amp-carousel and amp-bind, which give visitors a way to create galleries that they can browse product and subcategory. These can also include captions that briefly describe the image.

When they need to search for a particular product, you can use amp-form to create a search bar, and you can serve those results on a different page, or the same one. You can even autocomplete terms:

Outside of the capability to search and organize by product or type, which comes natively in AMP, product category pages are usually quite simple. With a showcase of images and minimal text, they’re a straightforward design that can deliver experiences at unrivaled speeds.

AMP offers this example of a product page with a search function and product organization:

Here’s a better indication of a product category page you can build with AMP:

This comes from Myntra, the largest online fashion brand in India. When they invested in AMP, they saw a 60% improvement in speed and a 40% reduction in bounce rates across their most important post-click landing pages. And with the help of amp-bind, they didn’t have to compromise on user experience. Visitors could sort and filter products and sizes like they would on any non-AMP page. They got a great user experience delivered in the blink of an eye.

3. Display personalized content

Marketers’ most powerful tactic for boosting conversions is personalization. The more relevant an offer is to your audience, the more likely they are to claim it.

Now, with the amp-access component, marketers can display blocks of content based on the user’s status, like if they’re logged in or not. To display personalized content or recommendations in a carousel, users can take advantage of amp-list. Says Google:

The amp-mustache default behavior for rendering amp-list data is to cycle inside items objects; adding an amp-carousel inside the template would make the template render multiple carousels; one way to work around this is having the amp-list endpoint return a single entry in items.

They can also use amp-list to return personalized content to the user with the help of cookies (using the attribute credentials=”include”) or AMP’s client id:

Another way to display personalized content, says AMP, is to use amp-bind with a JSON endpoint. This is especially helpful when data needs to be updated after a user interaction, like a hotel displaying room availability after a booking.

4. Shopping cart

Support for a shopping cart now comes native in AMP. To build it, Google recommends the use of amp-list, which can display to the user a dynamic list of what they’ve added to it:

amp-list needs to send the session cookie on the header of the request so that the server can retrieve the contents of the cart on the session. For this reason, we use credentials=”include”, as an additional attribute.

Arranged this way, each row of the list can contain a user’s personalized shopping orders. And each item in that list will have a button to remove items from the cart. Additionally, support for adding those items is just as this demonstration shows.

5. Checkout flow and Payments

Once, if you wanted speed and the ability to take payments, you had to start with AMP and redirect your users to a non-AMP checkout page. Today, you can enable users to check out from your AMP pages.

In Chrome, you can use the Payments request API. This will allow users to check out via a dialog box in their browser. Here’s a quick example.

The other option is to build your checkout flow inside of AMP with amp-form. If paying for a product requires a login, you can combine these elements with amp-access.

And if you prefer to check out users on your website, that’s still an option, provided you can quickly and seamlessly transition visitors to your website’s payment process. Here’s an example from WompMobile:

6. Analytics

Measure the effectiveness of your use of AMP for ecommerce with amp-analytics. This element supports both third-party and in-house analytics tools. That includes popular solutions like Google Analytics, Adobe Analytics, Nielsen, Quantcast, and more.

For a general idea of how visitors are interacting with AMP pages, look to AMP’s native analytics. Currently, amp-analytics can track events like:

• Pageview
• Anchor Clicks
• Timer
• Scrolling
• AMP Carousel changes
• Form

To collect analytics data directly, you can integrate your solution with AMP. Just make sure that your AMP data is being accurately attributed. To test if this is the case, Google recommends loading your accelerated mobile pages via the Google AMP Cache.

7. And more…

The above features are ones supported natively by the AMP framework. To add features that aren’t supported by AMP yet, you can use amp-iframe to embed content or more sophisticated tools like chat apps, maps, or other third party solutions.

Another option is to look for support from a third-party app, like the ones created for Shopify users. Apps like these make it possible to use AMP with plugins and extensions, enabling users to launch a quick-loading site easily.

The most effective AMP apps for Shopify are capable of creating many page types, like product, collection, home, and blog pages. They’re usually affordable, or even free, and come with reliable support:

There are similar plugins for WordPress users, and for Magento users as well.

AMP for ecommerce examples

You’ve seen the components, now let’s take a look at how some of the biggest online brands use AMP for ecommerce. Here’s a short showcase, compiled by Plumrocket.

Newegg product page

1-800-Flowers category page

Eventbrite product page

Lancome product category page

Have brands succeeded with AMP for ecommerce?

According to Forrester, an AMP’d site with considerable traffic could expect to see a 20% increase in sales conversion rate on AMP pages, a 10% year-over-year increase in AMP site traffic, and a 60% increase in pages per visit. So, how are real-life brands faring?

AMP for ecommerce users, by the numbers

• Advance Create, Japan’s biggest insurance comparison website, decreased page load time by 61.2% and cost per action by 36.8%, while boosting conversion rate by 28.9%.
• Event Tickets Center produced a 20% increase in conversion rate, and a 13% increase in time on site, while lowering bounce rate by 10%.
• DiscoverCarHire.com generated a 22% increase in mobile visits and 29% more conversions from mobile devices through its Google Ads. They also improved the site’s mobile organic traffic by 73% using AMP.
• Fastcommerce’s clients saw a 15% lift in conversions across 2M pages when comparing AMP to non-AMP pages.
• WompMobile saw a 105% increase in conversion rates and a 31% decrease in bounce rates with ecommerce AMP pages compared to non-AMP pages.
• Wego.com generated a 95% increase in its partners’ conversion rates and a 3x increase in ad conversions after creating AMP versions of key landing pages.
• Greenweez saw half its mobile organic traffic come from AMP between Jan and March of 2017. They also boosted mobile conversion rates by 80% while decreasing mobile acquisition costs by 66%.

Boost your conversion rate with AMP for ecommerce

Though some argue that AMP can’t support ecommerce websites, it’s clear that’s not the case. Brands have already had success with AMP as a way to deliver user-friendly experiences much more quickly. And in ecommerce, time is money. Speed is revenue.

Similarly to the way Shopify, WordPress, and Magento support AMP apps, so does Instapage. That means, through the Instapage builder, you can create AMP post-click landing pages as intuitively as you would any other page. Learn how to do it at scale with an Instapage demo.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

Since its launch in 2015, AMP has grown to power billions of web pages from tens of millions of domains across all industries. With its growth, however, a number of misconceptions and myths surrounding the AMP project have also come about. In fact, many publishers and businesses are skeptical to adopt AMP because of its assumed flaws and limitations.

Today’s article wants to clear up those misconceptions and bust 10 of the most common AMP myths. Read on to learn how you can take advantage of its incredible page delivery speed.

10 AMP myths you need to stop believing

Myth #1: AMP is only for mobile.

Truth: AMP is built with responsive features to work across all devices.

At first launch, AMP stood for “Accelerated Mobile Pages”. Since then, though, the longer title has simply become AMP. That’s because, the framework involves optimizing all web pages to improve user experience, not just mobile.

AMP has expanded over the years to offer various responsive design features to improve web pages across all devices and screen sizes, including desktop and tablet. So rather than being mobile-only, AMP is actually mobile-first — optimized for mobile, but expanded for other device types.

(Note: Some features for third-party platforms (e.g. Google’s Top Stories carousel) may only be designed for the mobile experience, and you should confirm with the third-party platform for how they integrate with AMP.)

Myth #2: AMP is exclusively a Google project.

Truth: AMP is an open source initiative led by Google and other companies and members of the web community.

Although AMP is Google-led, it’s designed as a standalone open source project that invites developers and other members of the community to contribute as core committers, making AMP fully independent.

From day one, AMP was developed with publishers, ad vendors, technology providers, and platforms aside from Google, such as Twitter, Linkedin, and Pinterest. It was also conceived as an open source project of the “GitHub generation” with very open collaboration.

From 2016 to 2019, AMP has received contributions from over 850 contributors — 78% of whom were not employed by Google, including those above along with Yahoo, Bing, and eBay.

While Google does employ a team working full-time on AMP, the team’s weekly meeting notes are published for anyone to view in an attempt to make the project very accessible to outside contributors. AMP even moved to a new governance model that explicitly gives a voice to all constituents of the community, including those who cannot contribute code themselves.

The AMP framework’s overall goal is to make the mobile web work better for all — not just a single platform, one set of publishers, or one group of advertisers. Making the project truly open source enables people to share and contribute their ideas and code for making the mobile web faster and better.

Myth #3: AMP pages can only be accessed from Google.com.

Truth: AMP pages are accessible through any distribution platform and device.

Some platforms (e.g., Google, Bing, LinkedIn, Twitter, Yahoo JP, Baidu, etc.) will always serve AMP pages by default on mobile, when available. Others — including Google.com and Bing.com — take an extra step to cache your content for a much faster user experience.

The bottom line: Users can access AMP pages via links on any distribution platform or site — not just Google.com.

Myth #4: Every AMP page must have a non-AMP counterpart.

Truth: AMP pages don’t need to be associated with a non-AMP version.

It’s common to have both an AMP and non-AMP version of the same page, especially during the early phases of your AMP migration when you’re still testing — but it’s not a requirement.

Once you decide if AMP is the right solution for your business, there’s no need to maintain two versions of the same content anymore. You can opt for one page — an AMP version — to reduce creation, tracking, and management costs (as opposed to creating, tracking, and managing two page versions).

You can also choose to build your entire site using AMP, so then there’s no need to worry about creating or maintaining different versions of individual pages.

Myth #5: AMP post-click pages are difficult to build.

Truth: It typically takes less than a week to build AMP landing pages.

“AMP HTML” is built exclusively from existing web technologies, so the development process mirrors the one publishers and advertisers already use today. In addition, there are templates and plugins available to make building AMP pages an even more streamlined process.

Although AMP development time and difficulty level varies on the page type, 80% of development teams say they built their AMP post-click landing pages in less than a week.

(The Instapage AMP builder is even faster than that… with a built-in AMP validator, intuitive interface, and integrations support, you can create pages in a matter of minutes.)

Myth #6: AMP is only for publishers and static websites.

Truth: The majority of Google Search clicks to AMP pages go to non-static sites.

It’s true that AMP was initially adopted by publishers. Yet, the framework is now significantly leveraged by advertisers and ecommerce companies.

TransUnion is one non-news company who has experienced great success with AMP pages. After suffering from higher bounce rates and lower mobile conversion rates compared to desktop, the company turned to AMP to enhance the mobile experience, hoping to increase mobile conversions.

AMP was quickly confirmed to be an ROI-positive project for the credit reporting company, as their AMP pages loaded in 1.6 seconds compared to 7.1 seconds for the non-AMP versions. This enhanced user experience also led to:

• 26% lower bounce rate
• 2.5X more time spent on site
• 3% more conversions

These results and others are why more than 60% of Google Search AMP clicks now lead to non-news sites.

Myth #7: AMP is not for ecommerce websites.

Truth: AMP increases page speed, which can help ecommerce sites boost purchase conversions.

New components are available that allow brands to create fast, beautiful, interactive experiences. So not only is AMP great for publishers and static sites — but ecommerce businesses, too.

Consumers have high expectations for their mobile shopping experiences, and fortunately, AMP supports many features that are essential for ecommerce sites:

• Dynamic content — To ensure your customers are always seeing up-to-date information, amp-list and amp-bind can be used to fetch and render current content on your pages.
• Checkout/payments — With the Payment Request API or amp-form, you can implement seamless checkout flows directly from within your AMP pages.
• Personalization/log-in — Whether through recommended products or saved shopping carts, amp-list can be used to provide personalized content to your customers.

Many big ecommerce companies have demonstrated great success with proper AMP implementation, including Myntra — the largest online fashion player in India — who saw a 60% improvement in page load speed and a 40% reduction in bounce rates across their most important post-click pages:

Myth #8: Fresh content can’t be served on AMP Pages.

Truth: There are many ways to keep AMP page content up-to-date.

You can serve fresh content on AMP pages in several different ways, including:

• The default AMP Cache mechanism
• The update cache functionality
• Dynamic components (like amp-list and amp-bind mentioned above)

In Myntra’s success story, the brand also used amp-bind to implement sorting and filtering, and size selection to give their users a rich experience with the freshest content.

Myth #9: AMP is not secure or private.

Truth: The AMP framework was built with privacy protection and data security in mind.

It’s true that AMP landing pages are often served from the Google AMP Cache, which caches a version of your AMP landing page. But, this is simply to validate AMP documents and provide reliable, fast delivery — not for any other reason.

In fact, the Google AMP Cache — along with AMP JavaScript — are served from cookieless domains that do not track users in any way. AMP also has a security review process that is routinely used when launching new AMP components.

Myth #10: AMP pages don’t convert as well as non-AMP pages.

Truth: Properly optimized AMP pages often perform better than their non-AMP equivalents.

If you are experiencing poor performance with your AMP pages, it’s unlikely that the reason is the AMP framework itself.

Studies have shown that AMP pages can actually generate:

• A 20% increase in sales conversion rate
• 10% year-over-year increase in traffic
• 60% increase in pages per visit

So if you’re not seeing the positive results you might expect from your AMP pages, it’s more likely that you’re not providing dedicated, personalized, post-click landing pages with each of your offers.

Get an AMP demo

If your pages are experiencing high bounce rates and low engagement, it’s likely because of slow page load speed. The AMP framework offers optimization techniques that help not only with page speed, but also with providing users an overall ideal mobile experience.

Request the Instapage AMP Demo today to deliver near instantaneous loading, smooth scrolling and an overall better browsing experience.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

Since Google announced AMP in 2015 to increase page load speeds and enhance the overall mobile user experience — the open-source framework has continued to grow in popularity.

Not only that, the framework has updated significantly to support a vast array of on-page elements, better features and options, and improved interfaces — all to continue improving the user experience.

Here are some of the latest new AMP updates.

9 AMP updates you may not be aware of yet

1. Signed exchanges

When AMP originated, Google made trade-offs to deliver privacy-preserving instant loading web content. One was that the URLs displayed in address bars began with “google.com/amp” rather than the domain of the publisher:

This was one of the most prominent AMP criticisms. Businesses didn’t want Google to display the AMP URL in place of the domain the content actually comes from since domain names are essential for branding and publishing content.

In April 2019, Google announced a solution — a way to show the content’s original URL while still retaining instant loading capabilities. That solution is signed exchanges.

Google states:

A signed exchange is a file format, defined in the web packaging specification, that allows the browser to trust a document as if it belongs to your origin. This allows you to use first-party cookies and storage to customize content and simplify analytics integration.

Most importantly, though, signed exchanges display the publisher’s real URL when people use Google Search and click on an AMP link, instead of an “http//google.com/amp” link:

This is a big deal for two reasons:

1. Domain name is a core part of brand identity
2. It’s easier to get AMP analytics with your own URL

(Note: Google only links to signed exchanges when the publisher, browser, and search context all support it. That means you’ll need to publish both the signed exchange version and the non-signed exchange version of your content.)

2. Server-side rendering (SSR)

Server-side rendering (SSR) is a technique you can apply to AMP pages to make them load even faster — up to 50% faster as a matter of fact.

SSR works by improving first-contentful-paint times (FCP) for frameworks rendering the page client-side. The downside of client-side rendering is that all JavaScript necessary to render the page needs to be downloaded first, which delays page content load time and could potentially increase bounce rates.

As a solution, AMP SSR removes the AMP boilerplate code and renders the page layout on the server.

(Note: The AMP boilerplate code exists to prevent content jumps during page load, hiding content until the AMP framework has been downloaded and the page layout is established. That’s why AMP pages suffer from the same problem as other client-side frameworks — rendering is blocked until the JavaScript is downloaded.)

By removing the boilerplate code, AMP SSR results in 50% faster FCP times.

SSR’d AMP optimizations break the rules of the AMP spec, which makes the document invalid. However, as long as it’s indicated with a flag during setup, the AMP validator will still treat SSR’d AMP as valid AMP.

Currently, there are two tools available for AMP SSR:

1. AMP Optimizer — A NodeJs library for producing optimized AMP
2. AMP Packager — Ago command-line tool, usable with serving signed exchanges

3. Input masking

Completing forms online can be so cumbersome that they prevent users from doing so. This is truer on mobile devices where the screen is smaller and navigation more difficult. But as you know, forms are vital for collecting leads and completing sales.

To help make the form-completion process easier and more time-efficient, AMP enabled input masking. This feature allows developers to add formatting like spaces and interstitial characters, which is especially convenient when users are filling out dates, payment details, phone numbers, etc.:

With more and more people submitting their information online in today’s digital world, having an easier, faster system can make all the difference.

4. Video optimization

Several video improvements have been introduced to increase the many benefits of AMP.

Docking
Videos on mobile web pages often obstruct the user’s view if optimization isn’t implemented properly. This could easily lead to a poor user experience and deter them from viewing any future content.

This new dock attribute minimizes the video currently being watched when users scroll down the page, allowing them to view content and videos simultaneously, without any obstruction:

You can also customize where and how the video docks to find the best way to present your video to the user.

Video player
Another new update is the <amp-video-iframe> which lets you install a custom-built video player that includes all the AMP Video Interface features you may desire (autoplay, dock, etc.)

Video ads
Video advertisements can also be integrated and optimized into AMP — from any video ad network that supports the IMA SDK so you can track both ads and revenue.

5. Optimized lists

AMP recently added two new components to optimize lists on web pages:

Resizing
The <amp-list> allows you to specify when you want the list container to resize on user interaction, to better fit different kinds of content (e.g., when the <amp-list> contains an <amp-accordion> that a user taps).

Infinite scrolling
Infinite scrolling is now available, so when users reach the end of a list of items (search results, product cards, etc), the list is automatically populated with more items:

This provides users with seamless access to more content from a single page instead of having to click a “next” button and visit another list page.

6. Third-party integration

Cookies and data collection are essential for brands to record user information. However, with the GDPR, rules on data consent and privacy have become stricter and regulated across all sites. This led to many publishers relying on third-party Consent Management Platforms (CMPs) to collect data per GDPR.

With this in mind, AMP launched <amp-consent>, so CMPs could easily integrate with AMP. Meaning, AMP-enabled websites can now continue using CMPs to collect and manage user data without compatibility issues. They can also integrate data consent UI and prompt users before they provide their information.

7. Lightbox mode

Viewing images through a lightbox — expanding an element to fill the screen until it’s closed again by the user is increasingly common. Yet, it can be difficult for developers to deliver a smooth transition into lightbox mode, as it involves interpolating between two images of different positions and sizes.

This led to the AMP UI Working Group optimizing lightbox transitions and improving image viewability:

Now, <amp-lightbox-gallery> provides advertisers the opportunity to experiment with different sizes for their website and optimize how they want users to view their images.

8. Availability of custom JavaScript

One of the newest Google AMP updates is the availability of <amp-script> — providing the option to run JavaScript in a separate worker thread so advertisers can add custom JavaScript to their AMP page while still retaining its fast loading speed.

The new <amp-script> lets you cover use cases that weren’t possible with previously-existing AMP components. It also lets you share code across your AMP and non-AMP pages, and use a JavaScript framework.

Some examples the AMP team have built for <amp-script> include:

• Todo MVC using Vue
• A password checker
• Data visualization in an article using D3.js
• Multi-page forms where each section needs validation before proceeding to the next section:

To preserve AMP’s performance guarantee, though, there are some constraints:

• Content jumping — To avoid unexpected content jumping, <amp-script> requires user interaction to change the page content.
• Page load — Since <amp-script> doesn’t change page content without user interaction, it doesn’t modify content on page load either.
• Script size — The script used in a single <amp-script> must be smaller than 150kB.
• API support — Not all APIs are supported inside a Web Worker, and some DOM methods and properties are not yet implemented

(Note: <amp-script> is compatible with frameworks you may already be using such as React, Preact, Angular, Vue.js, jQuery, and D3.js.)

9. AMP Toolbox

AMP Toolbox is a collection of command-line tools and JS APIs to simplify AMP page publication. Each tool within the toolbox can be downloaded and used individually:

AMP CLI
A command-line interface available for most features included in AMP Toolbox, that can be installed globally via NPM.

AMP Linter
The new toolbox-linter checks your AMP documents for common mistakes and best practices.

AMP Optimizer
AMP Optimizer server-side enhances the rendering performance of AMP pages by implementing AMP performance best practices.

AMP Cache URLs
It’s a good idea to check whether an AMP page works on all AMP caches, and you can use the toolbox-cache-url component to do this, as it translates an origin URL to the AMP Cache URL format.

AMP Cache List
This provides a list of all official AMP Caches, which can be useful when quickly updating or removing AMP documents from an AMP Cache.

AMP CORS
Many AMP components (such as amp-list or amp-state) take advantage of remote endpoints by using CORS requests. AMP CORS is a connect/express middleware that will automatically add all CORS headers required by your AMP pages.

AMP Validation Rules
This is simply a JavaScript library for querying AMP validator rules.

Get an Instapage AMP post-click landing page demo

Since AMP has become commonplace in mobile optimization, consistent updates like these are vital and beneficial to developers, publishers, and advertisers. The newest updates above are all perfect for improving user experience and providing brands with more options to experiment with and test out to enhance their website’s features and on-page engagement.

To learn more about what AMP can do for your landing pages, get an Instapage demo today.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

There are 7 million advertisers on Facebook, and if you advertise online, you’re likely one of them. Nearly 60% of all digital ad dollars go to the Google/Facebook pair.

At this point, you may also be a user of AMP — the open-source framework started by Google to speed the lagging mobile web. So far, there are over 31,000,000 domains publishing AMP documents on the web.

What’s less likely, however, is that you’re using the two for conversion, together. And there’s a good reason why: Facebook, with its Instant Articles, once appeared a rival to AMP. Years later, though, they’re the perfect combination for building an optimized post-click landing page.

AMP’s move toward conversion

When AMP showed up, it was every bit the bare-bones framework it claimed to be. Of course, it had to be to trim the bloated mobile web.

But for speed, AMP sacrificed versatility. With a lightweight framework that restricted the use of JavaScript, it was only capable of supporting static content at first.

It became a favorite of publishers, who benefited not only from the speed increase by adopting the framework, but a bump to the top carousel on search engine results pages. Slate, Gizmodo, and the Washington Post were among the first to see big improvements in KPIs that were later reported by DoubleClick:

But AMP is open source, which, according to a blog post, has meant big things for its development in just a few years:

As the AMP project has grown thanks to the collaboration of the open-source community, new components have been built that allow companies to do design customization and create interactivity. Today, most interactive experiences are supported:

• Rich Media: there are ever-increasing AMP components and anyone can contribute if something is missing.
• Third-Party (3P) integrations: there are many available now and growing.

Add an accordion, lightbox, video, GIF, lead capture form — even accept payments with all the components available to AMP designers now.

As the framework’s versatility grew, AMP usage evolved. eBay was the first major non-news site to announce the AMPing of 8 million pages. Then, some conversion-related breakthroughs:

• TransUnion discovered that AMP pages do lead to better conversion rates. By adopting AMP, the company experienced a 26% lower bounce rate, 2.5X the amount of time spent on the site, and 3% more conversions.
• By switching from standard web pages to AMP pages, Monetti was able to reduce its page load times by 84%, and in turn, improve its conversion rate by 28%.

Today, over 60% of clicks from search engines to AMP pages are to non-news sites. From post-click landing pages to websites, and beyond to progressive web apps, AMP is being used to build it all.

So much has changed, in fact, that AMP isn’t even “accelerated mobile pages” anymore. It’s just “AMP”: mobile-first, not mobile-only. And at that intersection is where it meets Facebook.

Facebook’s move to mobile

Facebook has seen many changes since its inception in 2004. Perhaps the most significant was born from the mobile revolution. As the years went on, more users chose mobile, and they were spending time in a select few apps. One of them was Facebook.

This led to many mobile-first updates, like Instant Articles, which didn’t grow as planned. Among others were formats like Collection and Lead Ads, Stories, Instant Experience, and additions to objectives, updates to pages. There was also a major change to the way Facebook’s algorithm worked, writes the team in a former news release:

With this update, we’ll soon take into account the estimated load time of a webpage that someone clicks to from any link in News Feed on the mobile app. Factors such as the person’s current network connection and the general speed of the corresponding webpage will be considered. If signals indicate the webpage will load quickly, the link to that webpage might appear higher in your feed.

These changes have paid off for the network. As of January of 2019, 96% of people accessed Facebook via smartphone, and 91% of Facebook’s ad revenue comes from mobile.

For advertisers, this parallel to AMP’s original mission to improve mobile experience (specifically through speed) means only one thing: AMP and Facebook belong together.

Using Facebook Ads and AMP together

Facebook advertisers pour billions into the company every year. Yet, they spend this on only one half of the ad campaign: the pre-click experience. For the most part, the other half is neglected.

The pre- and post-click landing page

What makes Facebook and AMP a particular powerful duo is their ownership of their respective portion of the ad campaign. Facebook owns all things mobile advertising in the pre-click stage: outrageously powerful targeting, engaging formats, optimization tools, and more.

AMP, on the other end, owns the post-click landing page on the landing page and beyond: instant load speed, engaging media, lead capture, payment processing, etc.

Together, they provide a powerfully balanced ad campaign, with an emphasis on speed. Facebook’s targeting allows advertisers to get granular with their messaging to specific target segments, and after the click, a customized AMP page allows for instant transfer to the post-click, at which point dozens of components contribute to the conversion. And conversion optimization is quickly becoming a strength of the AMP framework.

Consider a study by Forrester Research, involving 4 major AMP users, which found that a site implementing AMP could expect:

• a 20% increase in sales conversion rate on AMP pages
• a 10% year-over-year increase in AMP site traffic
• a 60% increase in pages per visit

Based on these results, Forrester built a model to predict the return from implementing AMP over a period of three years. Using that model, a website with 4 million monthly visits and a 10% profit margin would expect to recuperate the costs of implementing AMP and generate positive gains in 6 months or less:

Specifically, Forrester’s model found that this hypothetical AMP’d site with 4 million monthly visitors could expect to generate upwards of $1,005,447 over three years, from an investment of $210,827, producing an ROI of 377%:

We know Facebook is the king of targeting. And it’s clear that AMP can generate conversions. So what are some tips for using them together?

Recommendations for using Facebook and AMP together

In a help article from Facebook, the social network recommends some tactics for improving mobile ad performance. Here are a few, combined with our own recommendations for the pre- and post-click landing page:

• Opt for mobile-first formats: Instant Experience, Collection ads, Stories Ads are just a few you can take advantage of on mobile. Designed primarily for mobile, they provide a speedy user experience according to Facebook, with up to 10 times faster response times than the average mobile site.
• Avoid lead ads: Lead ads are Facebook’s attempt at making forms easier for users to fill out. The ad pops up, you click it, and it flips over to reveal a form:

While there are some benefits to lead ads, the major problem is branding and customization. Without a dedicated post-click landing page, you’re constrained to Facebook’s design capabilities. What’s more, the chance to build brand equity, or to immediately nurture the lead deeper into the funnel, are lost if they remain on Facebook. Not to mention that, while Lead Ads load quickly, AMP pages load instantly. So when it comes to speed, the two are a wash.

• Use a dedicated post-click landing page: Believe it or not, this is still a major issue facing businesses today. Facebook marketing consultant Jamie Forrest says:

I’ve seen people optimise their ads endlessly, but continue to send them to a boring, unfocused landing page - I even audited a charity whose ads were being run by an agency doing this, they were getting nice low numbers for their reports, and then blaming the lack on conversions on the charity’s follow up team.

Say it with us: Every promotion needs its own page. And more specifically, every audience should have its own page. When you leverage Facebook’s powerful targeting capabilities, optimize your ads until they’re perfectly segmented, but you drive those ads to a generic landing page, you waste your ad spend.

• Optimize for landing page views: The way your campaign performs has a lot to do with which objective you choose to optimize for. This will tell the Facebook algorithm what you want it to prioritize when it comes to the audience who sees your ad. Optimizing your ad for landing pages views can improve the quality of traffic to them by showing the ad to people who will be more likely to land on your ad’s destination URL, not simply click its link. Facebook says, for example: “If someone clicks your ad’s link, but then closes the page before it loads, that would count as a link click, but not a landing page view.” Quality of traffic should be something you consider highly over quantity.
• Optimize for conversions: Post-click landing page views are just one of many objectives you can optimize for. So, if your goal is conversion in the post-click stage as opposed to the quantity of traffic or landing page visit, you can optimize for conversions. This will tell the Facebook algorithm to show your ad to people in your audience who are most likely to take action on your post-click landing page. Do this by installing the Meta Pixel and create an ad for website conversions, then select the event you want to optimize for — like a purchase, for example.

According to Jamie, this technique is way underused. “Conversion ads are really powerful, but people often stick with traffic ads, focusing on Click-through-rates rather than opt-ins or sales.” For those aiming to drive action beyond the click in the bottom of the funnel, optimizing for conversions is a powerful option.

• But don’t neglect the rest of the funnel: Just because Facebook and AMP work well together doesn’t mean you can go straight for the sale. Use the two at the bottom of the funnel for demos and sales, but at the top, too, for ebooks and tip sheets and lighter content for building the relationship. Going straight for the sale isn’t likely to work for a new prospect. And, at the top of the funnel is where you’ll find other objectives that prioritize traffic a highly valuable option.
• Personalize more than ever before: AMP supports dynamic content to ensure your page is always up to date, and personalization to provide a unique experience to each visitor. Take this to the next level with Instapage’s Personalization Solution, which integrates with AMP. It uses UTM parameters to show each audience only the content you want. Now, you can offer each Facebook segment a post-click landing page that perfectly matches the pre-click.

• A/B test: AMP supports A/B testing, which advertisers agree is one of the most effective ways to determine the highest converting version of a web page. Compare one post-click landing page to the other, generate equal traffic, and control for confounding variables over no less than a month, and at the end, you may have yourself a new high-performing page. The ability to AB test comes built-in with Instapage, too, and it’s easier than ever to set up.

How will you use Facebook and AMP?

At the intersection of Facebook and AMP is speed. Benefit from a boost by Facebook for your AMP adoption, and drive your users to your post-click landing page faster than ever before. Remember, just a 3 second load time will deter 40% of internet users from waiting for your page.

Learn more about how to use AMP with Facebook, and other platforms, with the help of AMP integration from Instapage.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

Study after study confirms it: online searches drive offline phone calls to businesses. From SEO to text-based search ads to Google Shopping ads, companies are seeing an increase in call conversions from search.

One primary reason is the emergence of smartphones as our de facto device for product research. Most searches take place on smartphones, and mobile searchers often call a business’s call center, store, dealership, branch, or other location to ask questions, book appointments, or place orders.

Google says that mobile searchers are 39% more likely to call a business, while analyst firm BIA/Kelsey estimates that mobile searches will drive 61 billion calls to businesses this year — a 113% increase from 2014:

Phone calls are an essential part of the customer journey for industries with complex, expensive, infrequent, or urgent purchases. Consumers prefer to call and speak to a real person, regardless of the device they use to research a product or service. For marketers in these industries, your ROI often hinges on your ability to drive high-intent callers to your locations and call centers:

Call tracking helps you make better data-driven decisions

For advertisers in those industries, it’s important to take the same data-driven strategies for offline calls as you do online clicks. Call tracking and analytics solutions like DialogTech can help. They make calls as measurable and optimizable as clicks, so you know what calls from each marketing source drive leads, opportunities, and revenue to your business and can make smarter optimizations to drive the best return — both online and over the phone.

So what does a data-driven strategy for calls look like? Based on DialogTech’s experience with many of the world’s biggest brands for industries that want calls, here are six of the most common actions leading marketers take for the calls they generate to their business.

1. Attribute calls from marketing source to sale to prove ROI

First, you can use call tracking and analytics solutions to understand how your channels, campaigns, ads, search keywords, and pages on your website drive calls that convert, whether that’s to a sales opportunity, appointment, purchase, or other KPI. This enables you to link your marketing activities better and spend on business outcomes. You can prove your true ROI and more accurately forecast the results of future marketing initiatives.

For example, Arbor Memorial, one of Canada’s largest cemetery and funeral service providers, uses DialogTech to attribute calls to their 150 business locations. That attribution data on callers is integrated with their CRM system, connecting calls from marketing to resulting sales. It enables Arbor Memorial to attribute 150% more revenue on average from their marketing spend than if they only attributed online conversions.

2. Use what’s said on calls to improve audience targeting

When consumers call, those conversations are a rich source of insights into that caller’s intent, urgency, product interest, preferences, and value to your business. Some call tracking and analytics solutions use AI to analyze phone conversations at scale, enabling you to add each caller to the best search, Facebook, YouTube, display, and other audiences based on what happened during their call:

• For unconverted callers who are good leads, retarget them with a special offer for the product/service they called about across your digital channels and bid more for them on paid search.
• For callers who converted to customers, put them into the most relevant upsell or cross-sell ad campaigns. You might also decide to add them to lookalike campaigns to extend your reach and find new business resembling your best leads.
• You don’t want to waste budget retargeting a website visitor who already purchased over the phone — or who called looking for a job or soliciting your business. Add these callers to your exclusion lists so you don’t serve them ads that aren’t relevant.

Building audiences from conversations is an effective strategy for Comfort Keepers, a leading senior care provider with 450 locations. When a prospect calls a Comfort Keepers location and converts to a customer, the marketing team adds that caller to lookalike campaigns. They can then find new quality audiences that resemble those good callers and target them with display ads encouraging the consumer to call Comfort Keepers. This strategy generates 16x the conversions than the next best targeting tactic:

3. Route callers based on their data to provide better experiences

The experience when someone calls should be as frictionless, relevant, and as personalized as the online experience. Studies show that 84% of callers would cease doing business with a company after a negative call.

When consumers call, they expect to receive the right assistance right away. It’s important to connect them in conversation with your most appropriate agent or location immediately. Some call tracking and analytics solutions enable marketers to set up rules to dynamically route callers based on a wide range of criteria — including the campaign or webpage the person called from, their location, day/time of the call, and more:

One dealer with 27 locations started using DialogTech’s analytics and routing and increased answer rates on service and parts calls by 50%. Their service department, which takes 1,000 calls daily, saw a 10% increase in monthly revenue from callers.

In another example, a large retail brand uses the call channel to support its online store. If a consumer is shopping on the retailer’s site, begins the checkout process, but calls the retailer’s contact center before finalizing a purchase, the retailer uses DialogTech to route that caller directly to a live agent to assist. By bypassing the standard IVR and call queues, these callers receive the immediate assistance they need to complete the purchase.

4. Answer caller questions on your site to increase visits and conversions

Calls provide marketers access to the questions that consumers have — in their own words — for each of your products and services at each stage of the customer journey. They reveal the answers your business gave to those questions and whether it helped win or lose the customer. By optimizing post-click landing page or website content for the important questions callers ask — and the answers that won their business — you can show up for those search queries that have real buying intent and better convert the consumers on your post-click page:

5. Use calls as coaching tools to improve call-to-sale conversion rates

Driving high-intent, high-value callers from search is only the first step. Your sales agents and locations still need to convert them for your ROI to increase. Marketers should analyze what happens on the calls they send to their call centers (and locations) to see why some convert and others don’t. Are underperforming agents struggling to explain a new product? Do your more successful agents use terms like “easy installation” or “money-back guarantee” to increase conversion rates?

Call tracking and analytics solutions give marketers the answers. First, look at reports for each agent and location to see if callers are on hold too long, going to voicemail, or abandoning calls altogether.

• Is your IVR too complicated?
• Is the call center or location understaffed at key times?
• Are you sending callers to locations when they are closed?

Next, use your call tracking and analytics solution to pull up a list of quality phone leads that did not convert to customers. Then pull up a list of ones that did convert. Share the recordings with locations and call center managers so they know what tactics are working best — and which avoid — and can train their staff to improve close rates.

6. Share call tracking data with the rest of your tech stack

You should also pass your call tracking and analytics data into Instapage and other digital marketing tools like Google Ads, Facebook Ads Manager, Adobe Experience Cloud, Salesforce, and more. Together, this online and call data will give you a complete understanding of which strategies, channels, ads, and webpage variations drive the most valuable conversions – both online and over the phone. That way, you can make smarter optimizations to increase revenue and decrease cost per acquisition.

One of North America’s largest pest control companies uses search advertising to generate service appointments. Besides attributing conversions made online through their website, the company also passes call conversion data from DialogTech into Marin and Google Ads. By optimizing for the search ads, keywords, and days/times driving the most online requests and calls that converted to customers, the company drove a 12% increase in revenue from paid search spend.

To learn more about how to take a data-driven approach to calls from search, you can download The Search Marketer’s Playbook for Offline Conversions.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO

Since the AMP framework became available in 2015, new updates have been consistently rolling out. This meant that our original list of 5 Use Cases When to Use AMP needed to be expanded upon.

As a reminder, some of AMP’s main benefits include:

• Lightning-fast load speed
• Higher Quality Score and better rankings
• Less drain on your servers
• Improved user experience
• Higher performance of core business metrics
• Easy to create and reduces developer overhead
• Applied across various web touch points

Despite those, AMP may not be the best solution for everyone — maybe those pros don’t outweigh the few existing restrictions for every business.

To help you determine if AMP will benefit your brand and audience, here are four more ideal AMP uses cases in addition to our previous list.

4 More use cases when to use AMP

1. High mobile ad clicks but low conversions

If this is the case, maybe consider: Do AMP pages convert better than non-AMP pages?

Research shows that they do. Not just because they’re AMP enabled websites, but because faster load speed plays a huge role in providing a better user experience. Customers can engage faster with AMP content, making them more likely to convert.

Conversely, non-AMP pages have lower conversion rates likely because people don’t even get the chance to see the full offer or conversion opportunity before they decide to leave out of frustration.

Even tenths of a second matter and can greatly impact conversion rate. One retail industry study by Akamai showed that desktop pages that loaded in 2.7 seconds experienced a conversion rate of 12.8%, whereas pages that loaded in 2.8 seconds (only 100 milliseconds slower) experienced a 2.4% decrease in conversion rate:

Notice that the effect of page load speed on mobile devices was even more significant with a 7.1% and 3.8% decrease in conversion rates, respectively. And as page speed continued to slow down by one and two seconds, the impact only got worse. Conversion rates on desktop pages with a two-second delay had decreased by nearly 37%.

While tenths of a second don’t impact bounce rate quite as much conversion rate, one and two seconds do:

If your page takes just one second longer to load, it could mean about 50% higher bounce rate. And at 2 seconds longer — almost 103% higher.

So if you’re getting high mobile ad clicks but low conversions, visitors are likely bouncing before even seeing your offer and CTA button. If that’s the case, consider implementing AMP for your post-ad click experiences.

2. Click-through pages

AMP pairs perfectly with click-through pages. AMP’s fast-loading framework allows you to quickly educate prospects about your offer, and the click-through aspect lets them learn about the information without immediately being intimidated by a lead capture form.

An AMP click-through page enables you to more quickly convince visitors to click through to the next page to take further action.

This Home Chef AMP page loaded almost instantly, which was already a great start:

On top of that, instead of displaying a lead capture form, it presented the entire offer using persuasive elements:

• Social proof (#1 in customer satisfaction)
• Aesthetically pleasing images
• Directional cues (bouncing arrow leading visitors below the fold)
• Multiple corresponding CTA buttons

Only after the visitor learns about Home Chef’s meal kit service they see the short form:

3. If you’re an ecommerce brand

Ecommerce brands spend a significant amount of money on ads. In fact, worldwide digital ad spend is predicted to reach $385 billion in 2020. For the first time ever, digital will account for more than half of the global ad market.

This means ecommerce marketers must ensure they’re maximizing conversions and ROI from their ads. Unfortunately, AMP hasn’t always been able to provide the level of interactivity that most ecommerce brands typically require.

However, with AMP adding a Live List Component and the Bind Component, it’s now ideal for ecommerce brands to use the framework to its full advantage.

When compared to non-AMP sites, AMP enabled ecommerce websites generate:

• 32.1% increase in organic traffic
• 42.16% increase in SERP impressions
• 12.4% higher SERP click-through rates

In addition, as of October 2017, they produce a 20% increase in sales conversions compared to non-AMP pages.

Consider this AMP page from Myntra, the largest fashion ecommerce site in India:

They began implementing AMP in May 2017 and have since reduced their overall page load time by 65%, and their bounce rate by 40%. In addition, their mobile revenue contribution is higher than ever before, and continuing to increase.

4. For lead generation

At first launch, AMP publishers mainly depended on the framework’s speed and ability to increase page views. Now, about four years later, brands rely on AMP for more than that. Advertisers today use AMP for lead generation and revenue growth:

• TransUnion discovered that AMP pages generate more leads and better conversion rates. By adopting AMP, they saw a 26% lower bounce rate, 2.5X the amount of time spent on the site, and 3% more conversions.
• With 5X faster-loading AMP pages, U.S. Xpress witnessed a significant increase in completed job applications. With AMP, 3.41% of visits converted into completed job applications, while the non-AMP page only converted 2.12%.
• When Monetti switched from standard web pages to AMP pages, they reduced page load time by 84%, and in turn, improved conversion rate by 28%.

To allow brands to focus even more on lead gen, Google enabled all of its advertisers to link their mobile search ads to AMP post-click pages beginning back in September 2017.

One lead gen company saw an immediate drop in mobile visits to the non-AMP version of their page, with a 27% increase in mobile traffic to the AMP version:

For a lead gen website, though, traffic is just part of the equation — conversions matter more.

Fortunately, the company also saw an 18% conversion improvement after implementing AMP on their key post-click pages:

To increase lead gen even more, AMP offers a variety of components to increase personalization:

• Amp-access to tailor content to viewers to potentially increase conversions (varying content is displayed to the user depending on their particular status, such as if they are logged in or not).
• Amp-analytics to see how users are engaging with a site and to determine if you should make changes to increase leads

How will you use AMP for your post-click landing pages?

All brands can benefit from a more effective mobile strategy, and for many, AMP is the best way to implement one. By investing in AMP, you’re putting yourself on an even playing field with other top brands, driving more post-click traffic, improving user experience, and maximizing lead gen.

If you’re still unsure if the framework is right for your brand — request an AMP demo today to experience the Instapage AMP builder in action.

See the Instapage Enterprise Plan in Action.

Demo includes AdMap™, Personalization, AMP,

Global Blocks, heatmaps & more.

I WANT A DEMO