Bento AMP正式釋出,AMP網頁的未來發展將會如何?

Bento AMP正式釋出,AMP網頁的未來發展將會如何?
2016年時AMP誕生,在2019年時AMP已經提出有預計要做 Bento AMP概念,於2021年初時發布了入門指南,時至今日2021年12月終於正式公開 Bento AMP的官網

Component元件做成的 Bento AMP
Bento AMP 是用Component方式將AMP實裝的技術 (Bento為日文的" 弁当"讀音而來,意即像便當餐盒一樣每樣菜色為獨立但可被裝填於便當中)
使用AMP時,在網頁中必須使用AMP專屬的HTML語法和啟動程式才能做成AMP頁面,而Bento AMP是可將AMP Component元件單獨使用,在一般的網頁中也能有部分AMP的機制。
image

AMP Component舉例來說像以下這些:

在Bento AMP中同樣也能製作的Component例如:

Bento AMP 的好處
使用Bento AMP有什麼好處呢? 它具有三大優勢
1.出色的使用者體驗

載入Bento AMP 專用的 JavaScript 和 CSS與一般的JavaScript/ CSS 載入方式有不同地方,不會有頁面發送的問題,也就是說在使用者體驗上Bento AMP是較具有優勢的,原本的AMP是為了高速載入頁面並強調極佳的使用者體驗而發展出的框架系統,Bento AMP 也繼承了這樣的特徵,例如 :依據Web Vitals的指標,讓頁面不會產生CLS位移問題,並且讓 Lazy-loading(延遲載入)也具有效果。

Bento AMP使用者體驗

2.不需要依賴Framework
無論什麼樣的環境都可以使用Bento AMP,沒有一定要使用JavaScript框架或CMS(內容管理系統)才能用運作,另一方面,Bento AMP的 Web Components是使用 React/Preact 製作而成,因此可以和React 或Preact 整合,只要有載入Bento AMP的程式,許多CMS(例如WordPress或 Eleventy)都可以運作,不需要自行編寫JavaScript。
Bento AMP Guides 
3.Component分離可單獨使用
Bento AMP和其他的Component是分開的,不會有非預期影響,也不需要擔心被不信任的第三方竄改程式。 從性能和安全的角度來看Bento AMP是令人安心的。
Component分離可單獨使用
 
循序漸進AMP化
以前AMP和非AMP網頁是兩種對立與不同的形態,但Bento AMP要將兩者共存讓網頁能逐漸接近AMP,例如: 網頁上先將Sidebar改成 Bento Sidebar,下次再將輪播改成 Bento carousel,再下次將 lightbox 改為Bento lightbox...階段性的更改網頁內容,最終讓整個網頁AMP化,Bento AMP 解決了最初開始就要全面AMP化的難題。
 
Bento AMP 是AMP的救世主嗎?

AMP讓網頁速度加快曾享有SEO排名優勢,但由於獨樹一格的寫法、多種限制、維護不易等等,加上Google提出了Web Vitals指標,只要一般網頁有符合條件也能有較佳排名,AMP的優勢越來越少,2021年時twitter也停止AMP的支持、知名的網站也陸續停止使用AMP,Bento AMP 介於AMP與非AMP網頁的一個可選擇的方式,或許透過Bento AMP讓原本AMP的概念繼續能夠使用,並且能使網頁更加優化。

參考文章 :
Bento AMPをGoogleが正式公開?AMP存続の救世主になるか?
AMPに明るい未来はあるのか? アメブロやTwitterなど有名サイトが次々とAMPサポートを打ち切る

文章關鍵字:Bento AMP AMP AMP教學

更多文章:

  1. AMP教學-AMP Email格式介紹
  2. AMP 2020 線上發表重點整理
  3. AMP教學-amp-img圖片
  4. AMP教學-amp-carousel 輪播
  5. AMP教學-amp-instagram把IG照片放入文章中