Faster page loads with AMP deliver truckloads of new drivers to U.S. Xpress
AMP is an open-source HTML framework that provides a straightforward way to create web pages that are fast, smooth-loading and prioritize the user-experience above all else
Success Stories
Triplelift and Cloudflare boost Time Inc.’s revenue with AMP Ads
Teads brings AMP'd mobile video inventory to nearly 100 publishers
DiscoverCarHire.com drives conversions with faster mobile page load times via AMP
Leading French organic retailer doubles mobile conversions with AMP
Metromile lowers costs, reaches more potential customers with AMP
Hearst integrates key partner and product solutions on AMP
Wired AMP’s its 20+ year archive to meet audiences online
AMP makes Gizmodo 3x faster on mobile
Bind
Amp-bind allows you to add custom interactivity to your pages beyond using AMP's pre-built components.
Accordion
An accordion provides a way for viewers to have a glance at the outline of the content and jump to a section or their choice at their will.
Carousel
A generic carousel for displaying multiple similar pieces of content along a horizontal axis; meant to be highly flexible and performant.
Animation
An amp-animation element defines such an animation as a JSON structure.
P - Observer
Monitors the position of an element within the viewport as a user scrolls, and dispatches events that can be used with other AMP components.
Lightbox
The amp-lightbox component defines child elements that display in a full-viewport overlay/modal.
AMP - Bind
The amp-bind component allows you to add custom stateful interactivity to your AMP pages via data binding and JS-like expressions.
Note
For performance and to avoid the risk of unexpected content jumping, amp-bind does not evaluate expressions on page load. This means that the visual elements should be given a default state and not rely amp-bind for initial render
AMP - Accordion
Provides a way for viewers to glance at the content outline and jump to any section. This is helpful for mobile devices where even a couple of sentences into a section requires scrolling.
Behavior
The amp-accordion component allows you to display collapsible and expandable content sections. Each of the amp-accordion component’s immediate children is considered a section in the accordion. Each of these nodes must be a <section> tag.
AMP - Carousel
A generic carousel for displaying multiple similar pieces of content along a horizontal axis; meant to be highly flexible and performant.
Behavior
Each of the amp-carousel component’s immediate children is considered an item in the carousel. Each of these nodes may also have arbitrary HTML children. The carousel advances between items if the user swipes, uses arrow keys, or clicks an optional navigation arrow.
AMP - Animation
An amp-animation element defines such an animation as a JSON structure.
Placement in DOM
<amp-animation> is only allowed to be placed as a direct child of <body> element if trigger="visibility". If trigger is not specified and animation's playback is controlled programmatically via its actions, it can be placed anywhere in the DOM.
AMP - Position Observer
Monitors the position of an element within the viewport as a user scrolls, and dispatches events that can be used with other AMP components.
Overview
The amp-position-observer component monitors the position of an element within the viewport as a user scrolls, and dispatches enter, exit and scroll:<Position In Viewport As a Percentage> events (Low Trust Level), which can be used to trigger actions (Only Low Trust Actions) on other components (e.g., amp-animation.
AMP - Lightbox
The amp-lightbox component defines child elements that display in a full-viewport overlay/modal.
Behavior
When the user taps or clicks an element (e.g., a button), the amp-lightbox ID referenced in the clicked element's on attribute triggers the lightbox to take up the full viewport and displays the child elements of the amp-lightbox.
Business Benefits
Web page speed improves the user experience and core business metrics
AMP pages load near instantly, enabling you to offer a consistently fast experience across all devices and platforms.
Building AMP pages is easy and reduces developer overhead
You can often convert your entire archive in days especially if you use a popular CMS such as Wordpress or Drupal.
AMP can be applied across various web touch points
Used by popular and global platforms like Google, Bing and Twitter, AMP allows you to ensure users from all these surfaces get an unparalleled, often instantaneous and native-feeling experience by defaulting to AMP pages when available.
Developer Benefits
Maintain flexibility and control and reduce complexity in your code
You can use CSS to customize your styling, dynamic data to fetch the freshest data where needed, to build the best possible userexperience for your customers.
Building blocks that ensure performance
It takes a lot of time and effort to build a great website. AMP components are already optimized for the best performance.
Build for a sustainable future in the open web for everyone
The AMP Project is an open source initiative to protect the future of the web helping everyone deliver a better, faster more user-friendly experience.