AMP是什麼？AMP網頁對SEO的影響、AMP優缺點分享！
Welly SEO 編輯部
2024-01-03更新
# SEO優化
# 技術SEO
# SEO概念
AMP是什麼？AMP意思為Accelerated Mobile Pages，本文將分享AMP SEO 2024教學， 包含AMP設計原理、AMP SEO關係等，也會分享AMP Web工具，最後教你WP AMP設定、驗證與解除方法。
AMP起源為何？AMP Google演變與原理介紹！
有在經營網站的營銷人員，想必對於Google Analytics不陌生，而在GA中，我們可以發現「人手1台手機」的時代已經大大改變用戶上網的習慣，也就是說，從行動裝置進到網站的流量已成主流。
面對這樣的時代轉變，除了網站設計本身要採用像是RWD響應式設計，讓網站自動符合用戶行動裝置的螢幕大小之外，Google也推出了提升手機使用者體驗的技術－AMP。
究竟何謂AMP網站呢？AMP SEO之間的關係如何？
（一）AMP是什麼？究竟需不需要安裝AMP？
AMP意思為「加速頁面技術」，全名為Accelerated Mobile Pages。
Google官方於2016年2月發佈AMP網頁技術，透過這項網站技術可以協助手機或行動裝置加速讀取網站內容。
然而AMP對於SEO排名的影響於2021年起就不再擁有加權，會有這樣的AMP SEO演變，是因為雖然AMP將沒必要保留的元件刪除後，能夠加速網頁讀取的速度，但卻發現有部分排名位於SERP第1頁的網站內容並不符合使用者體驗。
因此往後有通過AMP驗證的網站也不會再於搜尋引擎上看到⚡️的符號，換言之，在2021年Google演算法更新之後，AMP網頁不再是提升SEO排名的必要王牌，反而要回歸初衷，好好經營「網站內容與使用者體驗」。
AMP設定的限制有哪些？
- 僅限於響應式網頁（RWD）。
- 只能使用 AMP-iframe ，無法利用全面客製化的JavaScript。
- 針對圖檔、文字字體等樣式，將限制大小與特定格式，以利減少網頁讀取的時間與負擔。
- 如有建立內鍵式樣式表（inline stylesheet），需注意不能超過50KB。
雖然AMP不再是Google搜尋引擎看重的SEO技術，但由此可見，行動裝置友善度、使用者體驗始終會是SEO優化的核心。
AMP 3種常見應用
- 網站：如上述所言，AMP網站可在行動裝置顯示時，移除不必要的元件，加速網頁的載入。
- 廣告：受眾對於廣告感到厭煩且較無耐心，如果廣告速度還很緩慢，那廣告的轉換率將更糟糕，因此AMP的技術應用在廣告上可以有效提升廣告載入速度，進而提升轉換率。
- Email電子郵件：Email Marketing是現在不管B2C、B2B產業都會採取的營銷手法，透過AMP技術，電郵推廣可以增加更多的互動操作， 且無需跳出到其他頁面，為用戶帶來更佳的互動體驗。
AMP介紹影片
✨想了解詳細的SEO優化介紹，建議你閱讀此篇文章：
（二）AMP SEO之間的關係為何？
由上述的 AMP SEO之所以總是一起被討論的原因如下：
透過AMP網站讀取速度加快，能夠有效降低使用者的跳出率，進而有機會提高SEO的排名表現。
而當我們深入探討如何加快網頁讀取速度時，可以將優化方法簡單統整成3個大方向：
- 手機效能：手機效能的好壞決定了讀取App和網站的快慢，但由於每個人選擇手機的訴求不同，因此不可控性較高。
- 網路速度：近幾年推出了網路5G，但普及率仍不高，有些鄉下地區甚至只有3G，因此優化的不可控性與成本過高，且不能因網路問題就忽視了一些地區的權益。
- 網頁內容與架構：網頁本身的內容與架構是否足夠簡潔，可以讓手機輕鬆、快速讀取，是優化方向中，可控性較高且最治本的方法。
最後，Google決定從網頁本身下手，將不必要的內容和元件刪除，如此一來，無論使用者的手機、網路再差，都可以輕鬆又快速的享受搜尋過程！
（三）AMP網站技術原理揭秘！3個主要組成介紹
Google團隊在2015年開發AMP這項技術，並分享了AMP的3個主要組成與內容，如下：
- AMP HTML：是一種專門為行動裝置優化而設計的HTML規範，它使用了專用標籤，像是amp-img、amp-video、amp-iframe，使圖片、影片和廣告顯示方面有更好的效果；此外，為了加速頁面載入速度，AMP限制了部分非必要的HTML語法使用。
- AMP JS：是一套JavaScript函式庫，主要用於保證AMP HTML能夠快速且正確地顯示內容，並快速載入、轉譯舊網頁。
- AMP Cache：是一種內容傳輸網路（CDN），專門用於快取和傳輸AMP網頁內容。當使用者點擊AMP網站時，他們會訪問AMP Cache，而不是直接訪問網站伺服器，從而快速取得經過AMP Cache最佳化的快取頁面。
以上對於沒有程式背景的人來說，可能難以理解，不如我們直接來看究竟AMP刪除了哪些內容、網頁會長什麼樣子，讓你快速知道AMP技術的強大。
（四）AMP刪除內容有哪些？
AMP主要刪除的內容有2大類：
- CSS：如果CSS大小超過50KB，或是使用外部CSS語法，都將遭AMP刪除。
- JavaScript：僅能使用AMP提供的元件，其他語法像是jQuery、AngularJS的資料庫皆不能應用在網頁上。
刪除以上這些內容之後，將導致網頁 呈現樣式較為單調、樸素，同時可能影響品牌特色的展現，僅會保留最基本的內容元素，像是標題、內文等，下圖為國外網站使用AMP之後的網頁長相：
圖片參考來源：
- Moz.com《AMP-lify Your Digital Marketing in 2018》
- Thee Digital《Is 2016 the year of Google Accelerated Mobile Pages (Google AMP)?》
（五）AMP常見疑慮：網站流量是否會被Google瓜分？
當你的網站經過AMP技術跳轉後，你可能會發現網址顯示的是「google.com.tw」，這時心中不免出現這個疑問：那我的網站流量是否會被Google瓜分？
會出現此狀況的原因為Google將網站內容快取並顯示暫存內容，以加速網頁讀取的速度。
如今Google官方已提出解方「Signed Exchange」，可以讓AMP網頁即時載入自己的網址，官方介紹如下：
Signed Exchange是網路套件規格中定義的檔案格式，可讓瀏覽器信任文件屬於您的來源。這樣一來，你就能使用第一方Cookie和儲存空間來自訂內容，並簡化數據分析的整合作業。網頁則會顯示在你的網址下方，而非google.com/amp網址。
✨詳細Google官方文件：即時載入自己網域中的AMP網頁
AMP優缺點有哪些？AMP效果又有哪些？
（一）AMP優缺點分享
| ⭕️AMP優點 | ❌AMP缺點 |
|---|---|
由此可見，雖然設置AMP技術對於流量、SEO優化、降低跳出率等有益處，但簡化版的AMP網頁其實存有不少的限制與缺點。
✨想知道詳細的Google廣告內容，建議你閱讀此篇文章：Google廣告教學｜Google Ads 6 大廣告類型詳細介紹
2大網頁驗證AMP工具分享
AMP的驗證方式除了可以透過自己的手機進行審視，也可以透過Google官方提供的AMP測試工具，使用步驟只要直接貼上網址，就可以輕鬆驗證AMP技術：
另外，如果想要知道自己的網站頁面載入速度，推薦你一款好用的工具－PageSpeed Insights，僅需要貼上想要偵測的網頁網址，即可知道網頁讀取速度等使用者體驗和效能問題：
👉🏻網站頁面載入速度偵測：PageSpeed Insights
AMP WordPress安裝與解除注意事項
✨如果想要了解WordPress SEO如何執行，建議你閱讀此篇文章：WordPress SEO怎麼做？WP SEO教學、4大SEO外掛推薦
（一）WP AMP安裝3步驟分享
關於WordPress AMP安裝其 實並沒有你想像的困難，相較於自己從無到有架設的網站，有了WordPress的網站技術基礎，只要插入擴充程式即可完成AMP裝置。
詳細的WP AMP安裝步驟如下：
- STEP1：到WP的外掛安裝頁面，並搜尋「AMP」進行下載、安裝、啟用
- STEP2：打開想要使用AMP技術的網頁
- STEP3：在該網址結尾輸入「/amp」
只要以上簡單3步驟，就可以成功在WordPress裝置AMP技術囉！
（二）WP AMP解除注意事項
如果想要解除AMP插件功能，只需要進入WP的控制台後台，找到正在使用的AMP外掛程式，並點選「停用」後即可解除。
但需注意：
AMP解除之後，網站可能會出現404找不到網頁的訊息。
因此解除AMP之後，務必將曾經後方有「/amp」的網址進行301重定向噢！
✨想要知道詳細的重定向（轉址）內容，你一定要閱讀此篇專業文章：
延伸閱讀：PWA（Progressive Web Application）
PWA（Progressive Web Application）為漸進式網路應用程式，在推出AMP之後，Google於2016年主要由設計師弗朗西斯·貝里曼和Google Chrome的工程師亞歷克 斯·羅素共同打造。
其主要是解決行動裝置或桌上型電腦需要跳出網頁下載APP的問題，換言之，PWA可以讓用戶在網頁中就享受到APP功能，無需到APP Store進行下載的動作，大大提升用戶體驗。
PWA優點與AMP相同，都能加快載入速度，此外，在沒有網路或是網路不穩定的情況下，PWA仍能透過緩存提供離線的內容；至於PWA缺點包含功能上的限制、無法使用應用程式商店的支援、瀏覽器兼容性的問題，都是在使用PWA必須考量的。
以上就是AMP加速頁面技術的介紹，如果您想要了解更多SEO資訊，或者想要獲取免費的SEO網站檢測，都可以透過下方黃色按鈕與Welly團隊聯繫！
