AMP項目(Accelerated Mobile Pages)是一個開放源代碼計劃，旨在為所有人打造更好的網絡體驗。借助該項目，使用者可以打造出在各種裝置和分發平台上都能始終如一地快速加載且效果出色的精美網站和廣告。AMP項目已于2016年2月24日啟動，數以千計的開發者成為這個項目的積極參與者。無數的網站現在都有AMP版本的頁面，許多開發者正在學習使用AMP——在這裡，我們和ytkah一起來學習使用WordPress來使用AMP。
谷歌非常重視，這也是他們搜尋引擎排名的标準之一。在這種情況下，谷歌正在使AMP幾乎成為許多網站的必需品。在這篇文章中，ytkah将給大家介紹谷歌的加速移動頁面項目的詳細資訊。這包括在您的WordPress站點中調用它的步驟。
AMP是什麼？
有些開發人員可能并不熟悉AMP。它是一個移動友好的架構，可以快速加載移動浏覽器上的網頁。它是一種開源技術，旨在為網站營運者有效地提高在移動裝置上加載内容頁面的速度和使用者體驗。所有這些增強都對廣告收入産生零效應。
如果您是一位經驗豐富的開發人員，您可以通過全面的頁面加載優化實作類似的增強。加速的移動頁面使得這些優化非常容易執行，而不需要花費太多的時間和精力在移動布局上。
對于那些已經為網站花費很多時間在SEO排名上的朋友，這隻是增加更多的任務到他們的待辦事項清單，當然，因為AMP頁面也可以提高搜尋引擎優化排名你的網站。這或許也是大企業采用AMP的主要原因。
AMP 網頁采用 3 大核心元件建構而成。
1、AMP HTML 是為確定可靠性能而具有某些限制的 HTML。
AMP HTML 本質上是使用自定義 AMP 屬性擴充的 HTML。最簡單的 AMP HTML 檔案如下所示：
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<link rel="canonical" href="hello-world.html">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>Hello World!</body>
</html> 複制
盡管 AMP HTML 網頁中的大多數标記都是正常 HTML 标記，但部分 HTML 标記替換為了 AMP 專用标記（另請參閱 AMP 規範中的 HTML 标記)。利用這些自定義元素（稱為 AMP HTML 元件）可以輕松高效地實作常見的模式。
例如，amp-img 标記可提供完整的 srcset 支援，即使在尚不支援該标記的浏覽器中也是如此。
AMP 網頁通過 HTML 标記被搜尋引擎和其他平台 <link rel=""> 發現。您可以選擇分别提供您網頁的非 AMP 版本和 AMP 版本，而不僅僅提供 AMP 版本。
2、AMP JS 庫可確定快速渲染 AMP HTML 網頁。
AMP JS 庫 可實作所有 AMP 的最佳性能做法、管理資源加載，并為您提供上面提到的自定義标記，所有這些都是為了確定快速渲染您的網頁。
最重大的優化之一就是它可使來自外部資源的所有内容保持異步，讓網頁中的任何内容都能毫無阻礙地渲染。
其他性能技術還包括：将所有 iframe 沙盒化，加載資源之前對網頁上每個元素的布局進行預先計算，以及禁用性能緩慢的 CSS 選擇器。
3、Google AMP Cache 可用于提供緩存的 AMP HTML 網頁。
Google AMP Cache 是一種基于代理的内容傳遞網絡，用于傳遞所有有效的 AMP 文檔。它可提取 AMP HTML 網頁，對這些網頁進行緩存，并自動改進網頁性能。使用 Google AMP Cache 時，文檔，所有 JS 檔案及所有圖檔都從使用 HTTP 2.0 的同一來源加載，進而可實作最高效率。
此外，Google AMP Cache 還帶有内置驗證系統，可确認網頁能夠正常工作，并且不依賴于外部資源。此驗證系統運作一系列斷言，确認網頁的标記符合 AMP HTML 規範。
另一個版本的驗證器與各個 AMP 網頁捆綁提供。此版本可在網頁渲染時将驗證錯誤直接記錄到浏覽器的控制台中，讓您可以看到代碼中的複雜變化可能會對性能和使用者體驗産生怎樣的影響
wordpress怎麼用AMP加速器呢？有插件可以實作，直接在wordpress背景插件市場搜尋amp關鍵詞就有很多可以用，有些是收費，有些樣式單一，如果要好看的樣式還是自己寫比較好，當然你也可以找ytkah定制，詳情可以檢視amp模闆展示amp網站也可以做得很好看
本文參與 騰訊雲自媒體分享計劃 ，歡迎熱愛寫作的你一起參與！
本文分享自作者個人站點/部落格
http://www.cnblogs.com/ytkah/
複制
如有侵權，請聯系 [email protected] 删除。