AcceleratedMobilePages
Accelerated Mobile Pages(簡稱AMP,意為「加速行動頁面」)是 Google 𤆬領開發的開源專案,目的是為著提升行動的裝置對網站的存取速度。AMP 嘛會當指其衍生的標準佮庫等專案成果。AMP 佇咧 HTML 等廣泛使用的網路技術基礎上進行改良,伊的核心的叫做是AMP HTML,是 HTML 的一種。服務佇技術預覽期結束了後的二空一六年二月正式發佈。
構成
AMP 較大概會當分做AMP HTML、AMP JS和AMP Cache三部份。
AMP HTML 是描述網頁所用的標記式語言,佮普通網頁做使用 HTML 之亞種。AMP HTML 佇圖像顯示等方面使用佮 HTML 無仝款的專用標籤,另外閣限制矣 HTML 部份功能的使用。
AMP JS 是一套 JavaScript 庫,保證 AMP HTML 的正確佮快速顯示。除了這以外,AMP JS 閣負責佇咧干焦支援普通 HTML 的瀏覽器內底擔任橋梁,使其能正確的支援 AMP HTML 的專用功能。AMP HTML 會當呼叫該函式庫。
AMP Cache 是緊取傳輸 AMP 頁面的 CDN,進一步提懸 AMP 網頁的效能。使用者咧搜揣 ia̋n-jín 中點擊 AMP 網頁的時陣,實際上存取的是最佳化後的快取頁面。Google 的 AMP Cache 號做Google AMP Cache。
AMP HTML
佮建立普通網頁的時陣建立的 HTML 類似,建立 AMP 頁面是以 AMP HTML 的方式來建立,寫法上大部份佮 HTML 相仝。副檔名亦仝款是 ` . html `,猶毋過嘛有人選擇 ` . amp . html ` 以示區別。
AMP 著專案網站頂懸有 AMP HTML 的詳細標準,叫是其中閣特別的所在。
頭部
AMP HTML 的頭殼格式如下。
其中 DOCTYPE 聲明佮普通的 HTML 五完全仝款,毋過起頭標籤 ` < html > ` 改做 ` < html amp > ` 抑是包含繪文字的 ` < html ⚡ > `。
` < head > ` 標籤愛有一寡元素包括 ` charset ` 和 ` viewport ` 元標籤,固定的 ` < style > ` 元素,以及讀取 AMP JS 庫的 ` < script > ` 元素等(其中一部份順序嘛有規定)。 此外,通過加入 JSON-LD 形式的結構化資料等等的,頁面會當包含向搜揣 ia̋n-jín 等工具傳遞合適資訊的元資料。
自訂元素
除普通 HTML 元素外,AMP HTML 閣會當使用一寡獨有的元素(標籤), 即自訂元素。譬如講用顯示圖像的 ` < amp-img > `(取代普通的 ` < img > ` 元素), 顯示布局邊仔欄的 ` < amp-sidebar > `,顯示外部站點內容的 ` < amp-facebook > `、` < amp-twitter > `,等咧。
AMP 袂當使用使用者 JavaScript,毋過有作為代替家己做元素,代表性的有顯示廣告的 ` < amp-ad > ` 佮用於存取分析的 ` < amp-analytics > `。
部份自訂元素要求使用時添加一寡附加 JavaScript 庫(佇咧 ` < head > ` 標籤內底)。
看仿
AMP 頁面佮普通頁面仝款,使用 CSS 做按呢式布局。猶毋過 CSS 袂當用外部檔案表示,嘛袂使佇咧各元素的 ` style ` 屬性中分別定義,著愛寫佇咧 AMP HTML 開始部份 ` < head > ` 標籤內底的單一 ` < style > ` 元素內底(會當侍服器捀動態生成 CSS 後楷入去 AMP HTML)。 包括媒體查詢器佮多數的屬性選擇器在內,大部份 CSS 功能攏佇咧 AMP 中使用,禁用的是有 ` ! ` ` important ` 限定符和 ` * ` 選擇器等等。
另外咧,AMP 允准通過元素的 ` layout ` 屬性控制布局。比如講,自適應圖像會當通過 ` < amp-img layout=" responsive " > ` 表示。
HTML 限制
部份 HTML 元素佮屬性的使用受著限制,特別是圖像佮媒體方面,遮的均由 AMP 自有的自訂元素來替換。
指令碼
AMP 中,使用者家己的 JavaScript,以及 jQuery、AngularJS 這類的普通 JavaScript 庫原則上袂使用。成做代替方案,會用得 AMP HTML 的自訂元素製作互動式網頁。
優點
使用 AMP 的網頁會當快速讀冊並顯示,存取者在點擊連結了後無需要等待就會使看著頁面的內容。根據 Google 發布的資料,網頁若準閣儉速度過慢,多數使用者會放棄並關店網頁,快速載入來的頁面對網站製作者嘛有利。
佇咧 Google 揣起來結果內底,妥善建立的 AMP 網頁邊仔會出現 AMP 標誌,新聞等部份的內容猶閣會用輪播(carousel)的特殊款式。
爭議
AMP 收著科技行業的廣泛批評。一寡人認為 Google 試圖通過制定網站的構建佮盈利方式來保持其佇咧網際網路的主導地位、共出版商鎖定佇其生態系統內底。
比較
AMP 定定予人與 Facebook Instant Articles 佮蘋果新聞較,三者攏發布佇二空一五年,旨咧提供閣較緊的行動內容。AMP 專案的支持者聲稱:APM 是發佈者佮技術公司間的合作成果;AMP 是為網際網路,毋是專屬應用程式設計的。
應用
部份媒體已經開始使用 AMP,包括講 CNN、美國廣播公司佮福斯新聞。安裝第三方外掛程式了後,WordPress 部落格嘛會使用 AMP。
二空一七年三月七號,Google 宣佈百度、搜狗佮 Yahoo ! JAPAN 搜揣共支援 AMP;其中的百度咧搜揣結果當中將 AMP 頁面標註做「MIP」(行動網頁加速器), 百度主導、佮 AMP 類似的專案。
參考文獻
外部連結
- 官方網站(英文)
- Official Google Blog : Introducing the Accelerated Mobile Pages Project , for a faster , open mobile web(英文)