EN

Make your Web Stories discoverable

Ensure your Web Stories are reaching your intended audience by including necessary metadata and markup.

AMP-specific metadata

Web Stories with missing or incorrect AMP-specific metadata may not surface in search engines or third party platforms.

Required <amp-story> attributes

Web Stories must include the following <amp-story> attributes.

<body>
    <amp-story standalone
    title="Web Story Title"
    publisher="Web Story Publisher"
    publisher-logo-src="https://example.com/logo/1x1.png"
    poster-portrait-src="https://example.com/my-story/poster/3x4.jpg">
    ...
    </amp-story-standalone>
</body>

title

The title of the Web Story.

publisher

The name of the Web Story publisher.

publisher-logo-src

A URL to the Web Story publisher's logo image. The logo image should be larger than or equal to 96x96px and maintain a 1:1 aspect ratio. This logo appears in the right corner on the top of the poster image on platforms currently (October 2020) supporting Web Stories.

poster-portrait-src

A URL to an image used as the Web Story poster. Used as the cover for the Web Story and should be representative of the story. Do not embed or burn-in the Web Story title on it. Should be at least 640x853px and maintain a 3:4 aspect ratio.

Recommended <amp-story> attributes

poster-landscape-src

A URL to an image used as the Web Story poster in landscape format. Used as the cover for the Web Story and should be representative of the story. Do not embed or burn-in the Web Story title on it. Should be at least 853x640px and maintain a 4:3 aspect ratio.

poster-square-src

A URL to an image used as the Web Story poster. Used as the cover for the Web Story and should be representative of the story. Do not embed or burn-in the Web Story title on it. Should be at least 640x640px and maintain a 1:1 aspect ratio.

Metadata

Platforms that surface Web Stories rely on metadata to correctly index and display them. Include the following recommended information to give users a delightful Web Story experience.

Include the following recommended HTML markup in your Web Stories for the best user experience.

All Web Stories must include a canonical URL that points to the Web Story itself.

<link rel="canonical" href="https://www.example.com/url/to/Web/Story.html">

favicon

Include a favicon to display as the icon in the browser tab.

Document title

Give your Web Story document a title by including a </a></code> tag.</p> <h2 id="image-alt-text">Image alt-text</h2> <p>Maximize accessibility and indexability by including <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Accessibility_concerns">meaningful alt-text for images</a>.</p> <h2 id="video-subtitles-and-captions">Video subtitles and captions</h2> <p>Maximize accessibility and indexability by including <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video">video subtitles and/or captions</a>.</p> <h2 id="page-attachments">Page attachments</h2> <p>Use <a href="https://amp.dev/documentation/components/amp-story-page-attachment/">page attachments</a> to present additional information in “classic article form” alongside your Web Story. This can be useful to provide extra detail, deep dives, or onward journeys for the content presented in your Story.</p> <h2 id="schema.org-metadata">Schema.org metadata</h2> <p>Including <a href="https://schema.org/">schema.org</a> structured data vocabulary defines important information about your Web Story that allows third-party platforms, such as search engines, to display and index them.</p> <p> <div class="ap-m-tip"> <div class="ap-a-ico ap-m-tip-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#speech-bubble"></use></svg> </div> <div class="ap-m-tip-content"> Validate your schema.org data using Google's <a href="https://search.google.com/test/amp">AMP Test</a>. </div> </div></p> <h2 id="ogp-facebook-metadata">OGP Facebook metadata</h2> <p>Including <a href="https://ogp.me/">Open Graph protocol</a> enables Web Stories sharing on Facebook.</p> <h2 id="twitter-card-data">Twitter card data</h2> <p>Including <a href="https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards">Twitter card data</a> allows you to attach photos, videos and media experiences to a Tweet sharing your Web Story.</p> <p> <div class="ap-m-tip"> <div class="ap-a-ico ap-m-tip-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#bookmark"></use></svg> </div> <div class="ap-m-tip-content"> Read more about <a href="https://blog.amp.dev/2020/02/12/seo-for-amp-stories/">SEO for Web Stories in the AMP Blog</a>. </div> </div></p> </section> <section class="ap--content"> <hr> <ul class="ap-o-mini-card-list"> <li class="ap-o-mini-card-list-item"> <div class="ap-m-mini-card"> <amp-img alt="Author avatar" src="https://github.com/CrystalOnScript.png?size=38" width="38" height="38" class="large" style="max-width: 38px" layout="responsive"> </amp-img> <span> <strong>Written by <a href="https://github.com/CrystalOnScript" rel="nofollow" target="_blank"> @CrystalOnScript </a> </strong> </span> </a> </li> </ul> </section> </div> </main> <amp-sidebar id="sidebar-left" class="ap--ampsidebar" layout="nodisplay" side="left"> <nav class="ap--ampsidebar-toolbar" toolbar="(min-width: 768px)" toolbar-target="ap--sidebar-content"> <ul> <div class="ap-m-format-toggle"> <button class="ap-m-format-toggle-selected ap-m-format-toggle-link-stories"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-stories"></use></svg> </span> <span>stories</span> <span class="ap-a-ico ap-m-format-toggle-angle"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </span> </button> <div class="ap-m-format-toggle-formats"> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-websites" href="/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=websites"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-websites"></use></svg> </span> <span>websites</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-ads" href="/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=ads"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-ads"></use></svg> </span> <span>ads</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-email" href="/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=email"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-email"></use></svg> </span> <span>email</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-nation-usa" href="/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=nation-usa"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-nation-usa"></use></svg> </span> <span>nation-usa</span> </a> </div> </div> <div class="ap-o-sidebar-default"> <div class="ap-o-sidebar"> <div class="nav"> <ul class="nav-list level-1"> <li class="nav-item level-1"> <span class="nav-link"> <span>Start</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/"> <span>Create your first Web</span> <span class="nav-link-lastword">Story<svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg></span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/setting_up/"> Setting up </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/parts_of_story/"> Understanding the parts of an AMP story </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/start_story/"> Starting our story </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/create_cover_page/"> Creating the cover page </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/add_more_pages/"> Adding more pages </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/animating_elements/"> Animating elements </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/validation/"> Validating your AMP HTML </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/documentation/guides-and-tutorials/start/visual_story/congratulations/"> Congratulations! </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/start/create_successful_stories/"> Best practices for creating a successful Web Story </a> </li> <li class="nav-item-tutorial-divider"></li> </ul> </li> <li class="nav-item level-1"> <span class="nav-link"> <span>Learn</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-actions-and-events/"> Actions and events </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/common_attributes/"> Common element attributes </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/webstory_technical_details/"> Web Story technical details </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/experimental/"> Enable experimental features </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-html-layout/"> <span>AMP's Layout System</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-html-layout/"> AMPHTML Layout System </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-html-layout/layouts_demonstrated/"> Demonstrating AMP layouts </a> </li> </ul> </li> <li class="nav-item level-2"> <span class="nav-link"> <span>Validation Workflow</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/validation-workflow/validate_amp/"> Validate AMP pages </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/validation-workflow/validation_errors/"> AMP validation errors </a> </li> </ul> </li> <li class="nav-item level-2"> <span class="nav-link"> <span>AMP Caches & CORS</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cache-debugging/"> Debug AMP Cache issues </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests/"> CORS in AMP </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-caches-and-cors/how_amp_pages_are_cached/"> How AMP pages are cached </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cache-urls/"> AMP Cache URL Format and Request Handling </a> </li> </ul> </li> </ul> </li> <li class="nav-item level-1"> <span class="nav-link"> <span>Develop</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/"> <span>Style & Layout</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/style_pages/"> Supported CSS </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/control_layout/"> Layout & media queries </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/placeholders/"> Placeholders & fallbacks </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/art_direction/"> Responsive images with srcset, sizes & heights </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/responsive_design/"> Create responsive AMP pages </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/style_and_layout/custom_fonts/"> Add custom fonts </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/media_iframes_3p/"> <span>Include media, iframes & third-party content</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/media_iframes_3p/"> Include images & video </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/advertise_amp_stories/"> Advertise in Web Stories </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/develop/story_ads_best_practices/"> Best practices for creating a Web Story ad </a> </li> <li class="nav-item-tutorial-divider"></li> </ul> </li> <li class="nav-item level-1"> <span class="nav-link"> <span>Integrate</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/integrate/web-story-player-guide/"> Creating Web Story experiences using the Web Story Player on non-AMP sites </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/integrate/embed-stories/"> Integrate stories in AMP pages </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/integrate/embed-stories-nonamp/"> Integrate Web Stories in non-AMP pages </a> </li> </ul> </li> <li class="nav-item active level-1"> <span class="nav-link"> <span>Optimize & Measure</span> </span> <input class="nav-trigger" type="checkbox" checked/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/"> <span>Using an AMP Optimizer</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/explainer/"> How an AMP Optimizer works </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/node-amp-optimizer/"> Node.js AMP Optimizer Guide </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/"> <span>Track engagement with analytics</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/analytics-vendors/"> Analytics Vendors </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/analytics_basics/"> Analytics: the basics </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/deep_dive_analytics/"> Deep dive into AMP analytics </a> </li> </ul> </li> <li class="nav-item active level-2" autoscroll> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/"> Make your Web Stories discoverable </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/optimize_amp/"> Optimize your hosted AMP pages </a> </li> <li class="nav-item-tutorial-divider"></li> <li class="nav-item-tutorial-divider"></li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/optimize-and-measure/tracking-engagement/"> How to configure basic analytics for your AMP pages <svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg> </a> </li> </ul> </li> <li class="nav-item level-1"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/"> <span>Contribute</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/"> How to contribute </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/integrate-your-analytics-tools/"> Integrate your analytics tool with AMP </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/contribute-documentation/"> <span>Contribute documentation</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/contribute-documentation/documentation-types/"> Documentation types </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/contribute-documentation/terminology/"> AMP terminology </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/contribute-documentation/formatting/"> Formatting guides & tutorials </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/vendor-contributions/"> <span>Third party contributions</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/vendor-contributions/release-schedule/"> Release Schedule </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/documentation/guides-and-tutorials/contribute/translations/"> Contribute translations </a> </li> </ul> </li> </ul> </div> </div> </div> </ul> </nav> </amp-sidebar> <footer class="ap--footer"> <div class="ap-o-footer"> <div class="ap-o-footer-line-top"> <div class="ap-o-footer-openjsf"> <amp-img src="/static/img/logo-ontomatica.svg" alt="Ontomatica Logo" width="652" height="98" layout="responsive"></amp-img> </div> </div> <div id="tools" class="ap-o-footer-line-bottom"> <div class="ap-o-accordion"> <amp-accordion disable-session-states> <section > <header class="ap-o-accordion-header"> <div class="ap-o-accordion-title"> <h4>How does advertising work on Accelerated Mobile Pages?</h4> <div class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> </div> </header> <div class="ap-o-accordion-content"> <p>A goal of the Accelerated Mobile Pages Project is to ensure effective ad monetization on the mobile web while embracing a user-centric approach. There is currently support for a comprehensive range of ad formats, ad networks and technologies in Accelerated Mobile Pages. As part of that, those involved with the project are also engaged in crafting Sustainable Ad Practices to ensure that ads in AMP files are fast, safe, compelling and effective for users.</p> </div> </section> <section > <header class="ap-o-accordion-header"> <div class="ap-o-accordion-title"> <h4>Are publishers able to sell their own ad inventory?</h4> <div class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> </div> </header> <div class="ap-o-accordion-content"> <p>Yes, as with their existing websites, publishers control their ad inventory and how they sell it.</p> </div> </section> <section > <header class="ap-o-accordion-header"> <div class="ap-o-accordion-title"> <h4>How do subscriptions and paywalls work with Accelerated Mobile Pages?</h4> <div class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> </div> </header> <div class="ap-o-accordion-content"> <p>It is a core objective of the Accelerated Mobile Pages project to support subscriptions and paywalls. AMP currently supports a flexible access framework where publishers can control the document viewing experience for subscribers, metered users and anonymous users.</p> </div> </section> <section > <header class="ap-o-accordion-header"> <div class="ap-o-accordion-title"> <h4>How are analytics being handled in this AMP format?</h4> <div class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> </div> </header> <div class="ap-o-accordion-content"> <p>Ensuring publishers are able to get robust analytics insight is a core design goal for the project. AMP currently supports the collection of analytics information using features like amp-analytics, which can integrate with 3rd party systems without compromising the AMP file speed or size. Several analytics providers are <a href="/support/faqs/supported-platforms.html#analytics">participating</a> in the project.</p> </div> </section> <section > <header class="ap-o-accordion-header"> <div class="ap-o-accordion-title"> <h4>Do publishers receive credit for the traffic from a measurement perspective?</h4> <div class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> </div> </header> <div class="ap-o-accordion-content"> <p>Yes, an AMP file is the same as the rest of your site – this space is the publisher’s canvas.</p> </div> </section> <section > <header class="ap-o-accordion-header"> <div class="ap-o-accordion-title"> <h4>How do I become a part of this project?</h4> <div class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> </div> </header> <div class="ap-o-accordion-content"> <p>We welcome interested individuals and companies who want to get involved to get in touch via <a href="https://github.com/ampproject/amphtml/issues/new">GitHub</a>, so that we can add you to a distribution list and keep you posted on any new information.</p> </div> </section> </amp-accordion> </div> </div> </div> </footer> <amp-analytics type="gtag" data-credentials="include" data-block-on-consent> <script type="application/json"> {"extraUrlParams": {"cd2": "${ampdocHost}"}, "requests": {"CWV_EVENT": "${base}?v=1\u0026t=event\u0026tid=${gtag_id}\u0026cid=0\u0026ec=cwv", "base": "https://google-analytics.com/collect/"}, "triggers": {"banner": {"on": "click", "selector": "#top-banner", "vars": {"event_action": "click", "event_category": "guides-and-tutorials", "event_label": "banner", "event_name": "banner"}}, "breadcrumbLink": {"on": "click", "selector": ".ap-m-breadcrumbs-crumb", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "breadcrumbs", "event_name": "breadcrumbs"}}, "cls": {"extraUrlParams": {"cls": "${cumulativeLayoutShift}"}, "on": "visible", "request": "CWV_EVENT"}, "defaultPageview": {"on": "visible", "request": "pageview", "vars": {"title": "{{title}}"}}, "fid": {"extraUrlParams": {"fid": "${firstInputDelay}"}, "on": "visible", "request": "CWV_EVENT"}, "formatToggle": {"on": "click", "selector": ".ap-m-format-toggle-link", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "format-toggle", "event_name": "format-toggle"}}, "lcp": {"extraUrlParams": {"lcp": "${largestContentfulPaint}"}, "on": "visible", "request": "CWV_EVENT"}, "navigation": {"on": "click", "selector": ".ap--header a, .ap-o-burger-menu-link", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "navigation", "event_name": "navigation"}}, "scrolledEnd": {"on": "scroll", "scrollSpec": {"verticalBoundaries": [90]}, "vars": {"event_action": "end", "event_category": "guides-and-tutorials", "event_label": "scroll", "event_name": "scroll"}}, "scrolledHalf": {"on": "scroll", "scrollSpec": {"verticalBoundaries": [50]}, "vars": {"event_action": "half", "event_category": "guides-and-tutorials", "event_label": "scroll", "event_name": "scroll"}}, "searchButton": {"on": "click", "selector": "#searchTriggerOpen", "vars": {"event_action": "open", "event_category": "search", "event_label": "search", "event_name": "search"}}, "sidebarLink": {"on": "click", "selector": ".ap-o-sidebar a", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "sidebar", "event_name": "sidebar"}}, "sidebarToggle": {"on": "click", "selector": "label[for=\"sidebar-desktop\"], label[for=\"sidebar\"]", "vars": {"event_action": "toggle", "event_category": "guides-and-tutorials", "event_label": "sidebar", "event_name": "sidebar"}}, "tocLink": {"on": "click", "selector": ".ap-o-toc a", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "toc", "event_name": "toc"}}, "tocToggle": {"on": "click", "selector": ".ap-o-toc label", "vars": {"event_action": "toggle", "event_category": "guides-and-tutorials", "event_label": "toc", "event_name": "toc"}}}, "vars": {"config": {"G-ER2QN5NTTD": {"groups": "default"}}, "gtag_id": "G-ER2QN5NTTD"}} </script> </amp-analytics> <amp-install-serviceworker src="/serviceworker.js" data-iframe-src="https://ngfalls.netlify.app/serviceworker.html" layout="nodisplay"></amp-install-serviceworker> </body> </html>