這個新技術依賴於 AMP 的 HTML ，一個建立在已有網頁技術之外的全新的、開放的技術框架，它可以幫助網站加載非常輕量級的網頁。而根據其他相關的報導， AMP 技術不會預先加載影音或是圖片，只有在您已經向下滾到它們的時候才會加載，這可以讓您打開網頁的速度更快；同時， Google 也將使用最頂級的服務器來加載網頁，1秒可以同時處理600萬個查詢任務。當然，這個技術可以運用在任何形式的內容上。
範例：
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <!--Start with the doctype <!doctype html>--> <!doctype html> <!--Contain a top-level <html 閃電> tag (<html amp> is accepted as well).--> <html amp lang="zh-TW"> <!--Contain <head> and <body> tags (They are optional in HTML).--> <head itemscope itemtype="http://schema.org/WebSite"> <!--Contain a <meta charset="utf-8"> tag as the first child of their head tag.--> <meta charset="utf-8"> <meta name="Author" content="Henry Inc." /> <title>Google 的移動網頁加速計畫</title> <!--Contain a <link rel="canonical" href="$SOME_URL" /> tag inside their head that points to the regular HTML version of the AMP HTML document or to itself if no such HTML version exists.--> <link rel="canonical" href="http://localhost/workspace/google_amp_template.html" /> <!--Contain a <meta name="viewport" content="width=device-width,minimum-scale=1"> tag inside their head tag. It’s also recommended to include initial-scale=1.--> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> <!--Contain <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript> in their head tag.--> <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript> <!--Contain a <script async src="https://cdn.ampproject.org/v0.js"></script> tag as the last element in their head (this includes and loads the AMP JS library).--> <script async src="https://cdn.ampproject.org/v0.js"></script> </head> <body> </body> </html> |
如何驗證語法是否符合 AMP 的規範呢?
請使用 Chrome 瀏覽器，要打開控制台選項卡，請執行下列操作之一：
1. 使用鍵盤快捷鍵命令 + 選項 + J（Mac）或控制 + Shift + J鍵（Windows/ Linux）的。
2. 選擇 Chrome
>更多工具> JavaScript控制台 。3. 裡面會顯示驗證的結果，如下圖。
 |
| 成功的內容。 |