方格精選
如何令到網站更快更吸引？(二)
閱讀時間約 3 分鐘
Google 經常更新網站性能的指標和工具，務求在衡量網站方面的用戶體驗與時並進。那讓我們來看看今年Google 提出的網站性能基準其中之一：FID — First Input Delay 首次輸入延遲吧。
相信大家都知道，給予客人良好的第一印象是多麼重要，其可以使訪客成為忠實用戶，願意在網頁上多作停留。但問題是，是什麼因素能夠建立良好印象，以及如何衡量網站可能對用戶產生何種印象？除了載入時間、視覺穩定性之外，網頁互動性亦相當重要。
在網頁上，第一印象可以以不同形式來展現，對於網站的設計、視覺上吸引力，以及對其速度和響應程度。用戶可以使用 First Paint（FP） 和 First Contentful Paint（FCP） 等指標，來衡量用戶對網站加載速度的第一印象 。不過，您的網頁在屏幕上完成內容繪製的速度只是其中一部分，但是同樣重要的，是用戶何時能夠開始與頁面內容進行互動。
針對用戶對網頁互動性和響應能力的衡量，Google 引入了一個名為First Input Delay的全新指標。
什麼是 FID ？
首次輸入延遲 (First input delay, FID) 測量從使用者第一次與你的網站互動（例如點擊連結、按鈕等等），瀏覽器實際上能夠回應此次互動的時間點。它是個在首次使用者於網頁互動，以及瀏覽器回應此互動的時間長度。
這個時間介於內容已經在頁面繪製完成 (FCP) ，以及所有功能都能夠回應使用者的互動時間。這通常取決於網站程式碼需要進行下載、剖析以及執行，而且受裝置速度的影響 (例如考慮到一些較低階的行動裝置)。延遲時間越長，使用者體驗就會越差。以下就是一些常見的延遲問題：
- 點選連結或按鈕載入內容延遲
- 文字對話框無法立即輸入文字
- 打開下拉式選單畫面延遲
- 無法勾選對話方塊
為什麼只考慮第一個輸入？
雖然任何輸入的延遲都可能導致糟糕的用戶體驗，但Google主要建議測量第一次輸入延遲，原因有幾個：第一次輸入延遲將是用戶對你的網站響應速度的第一印象，而第一印象對於塑造在網站質量和可靠度的整體印象至為重要。
在網絡上看到的最大的互動性問題發生在頁面加載過程中。因此Google認為，最初專注於改善網站的首次用戶互動，將對提高網絡的整體互動性產生最大的影響。
如何改善FID？
為了改善用戶體驗，網頁管理者應努力讓其網頁的首次輸入延遲小於0.1秒。要注意的是FID僅在事件處理中測量「延遲」，不代表事件處理時間本身；所以若要具針對性的改善策，你的目標便是讓延遲時間縮短。而改善的方案可以是：
- 減少JavaScript等網頁程式碼的運作時間
- 減低網頁的請求數和檔案大小
- 減少主執行緒的工作
- 減低第三方程式碼的影響
Google為了鼓勵大家提升網頁速度 ，特別開發了能追蹤FID的Javascript程式庫，以便大家追蹤到的 FID 事件，也能透用追蹤碼傳送到Google Analytics作出檢視和分析。
Ref：
為什麼會看到廣告
留言0
查看全部
你可能也想看
Google News 追蹤
這個秋，Chill 嗨嗨！穿搭美美去賞楓，裝備款款去露營⋯⋯你的秋天怎麼過？秋日 To Do List 等你分享！
秋季全站徵文，我們準備了五個創作主題，參賽還有機會獲得「火烤兩用鍋」，一起來看看如何參加吧～
11/20日NVDA即將公布最新一期的財報, 今天Sell Side的分析師, 開始調高目標價, 市場的股價也開始反應, 未來一週NVDA將重新回到美股市場的焦點, 今天我們要分析NVDA Sell Side怎麼看待這次NVDA的財報預測, 以及實際上Buy Side的倉位及操作, 從
Hi 大家好，我是Ethan😊
相近大家都知道保濕是皮膚保養中最基本，也是最重要的一步。無論是在畫室裡長時間對著畫布，還是在旅途中面對各種氣候變化，保持皮膚的水分平衡對我來說至關重要。保濕化妝水不僅能迅速為皮膚補水，還能提升後續保養品的吸收效率。
曾經，我的保養程序簡單到只包括清潔和隨意上乳液
來自香港唱作人Sophy王嘉儀去年發行的這張全概念創作新專輯《水性．揚花》可謂是一張實足的驚喜之作，若要問我怎麼來形容這張專輯，我會說「玩到赤裸」、「天生變態」。或許大多數人會覺得這些字眼實在算不得褒獎，但相信在一同聽她深度解讀整張專輯後，你會了解到，王嘉儀是如何用她鮮明個性的態度重新定義这些字眼。
Hi 我是 VK~
這期來聊聊 YouTube 上的「3C 評測之王」 MKBHD。他在早期是如何成為 YouTuber，到如今建立近 2000 萬訂戶的媒體事業？
MKBHD 在十多年的創作生涯中，有什麼是他堅持的原則？他對觀眾的了解，如何幫助他打造科技產品評測的內容？Humane AI Pi
充滿競爭的數位世界中，越來越多的人選擇創業，並將目光投向了電子商務。 互聯網的普及和電子商務的迅速崛起為個人創業者提供了前所未有的機會，讓人們可以通過網路銷售產品或服務，實現自己的創業夢想。
在這個背景下，建立一個成功的網店品牌成為了一項重要的任務。 然而要從品牌定位到網站設計，再到產品規劃和行
我加入了艾多美!
如果您對艾多美有任何疑惑或想更深入了解，歡迎參考我的分享。艾多美是直銷，但也是大型網路購物中心，提供保健食品、保養品等產品。
很多人開始經營了自媒體，也有很多人想要了解自媒體以及各人品牌的經營，這裡來分享Jerry的兼職做個人品牌自媒體三年來的心路歷程，三年從 月入1.5K 到月入150K。
自媒體經營會是輔助你的本業收入成長 or 下班後的第二收入的好方法，尤其如果你是有網路行銷、影片剪輯、編輯寫作等經驗，在目前上方
我曾經是一個普通的大學生，沒有什麼特別的背景和資源。但是，我相信只要我努力，就能夠實現自己的夢想。今天，我將分享我的經驗，希望能幫助更多人實現財務自由。
首先，我要強調的是教育的重要性。我選擇了電腦專業，這個選擇為我後來的職業生涯打下了堅實的基礎。在大學期間，我深入學習了程式設計、資料結構、演算
這個秋，Chill 嗨嗨！穿搭美美去賞楓，裝備款款去露營⋯⋯你的秋天怎麼過？秋日 To Do List 等你分享！
秋季全站徵文，我們準備了五個創作主題，參賽還有機會獲得「火烤兩用鍋」，一起來看看如何參加吧～
11/20日NVDA即將公布最新一期的財報, 今天Sell Side的分析師, 開始調高目標價, 市場的股價也開始反應, 未來一週NVDA將重新回到美股市場的焦點, 今天我們要分析NVDA Sell Side怎麼看待這次NVDA的財報預測, 以及實際上Buy Side的倉位及操作, 從
Hi 大家好，我是Ethan😊
相近大家都知道保濕是皮膚保養中最基本，也是最重要的一步。無論是在畫室裡長時間對著畫布，還是在旅途中面對各種氣候變化，保持皮膚的水分平衡對我來說至關重要。保濕化妝水不僅能迅速為皮膚補水，還能提升後續保養品的吸收效率。
曾經，我的保養程序簡單到只包括清潔和隨意上乳液
來自香港唱作人Sophy王嘉儀去年發行的這張全概念創作新專輯《水性．揚花》可謂是一張實足的驚喜之作，若要問我怎麼來形容這張專輯，我會說「玩到赤裸」、「天生變態」。或許大多數人會覺得這些字眼實在算不得褒獎，但相信在一同聽她深度解讀整張專輯後，你會了解到，王嘉儀是如何用她鮮明個性的態度重新定義这些字眼。
Hi 我是 VK~
這期來聊聊 YouTube 上的「3C 評測之王」 MKBHD。他在早期是如何成為 YouTuber，到如今建立近 2000 萬訂戶的媒體事業？
MKBHD 在十多年的創作生涯中，有什麼是他堅持的原則？他對觀眾的了解，如何幫助他打造科技產品評測的內容？Humane AI Pi
充滿競爭的數位世界中，越來越多的人選擇創業，並將目光投向了電子商務。 互聯網的普及和電子商務的迅速崛起為個人創業者提供了前所未有的機會，讓人們可以通過網路銷售產品或服務，實現自己的創業夢想。
在這個背景下，建立一個成功的網店品牌成為了一項重要的任務。 然而要從品牌定位到網站設計，再到產品規劃和行
我加入了艾多美!
如果您對艾多美有任何疑惑或想更深入了解，歡迎參考我的分享。艾多美是直銷，但也是大型網路購物中心，提供保健食品、保養品等產品。
很多人開始經營了自媒體，也有很多人想要了解自媒體以及各人品牌的經營，這裡來分享Jerry的兼職做個人品牌自媒體三年來的心路歷程，三年從 月入1.5K 到月入150K。
自媒體經營會是輔助你的本業收入成長 or 下班後的第二收入的好方法，尤其如果你是有網路行銷、影片剪輯、編輯寫作等經驗，在目前上方
我曾經是一個普通的大學生，沒有什麼特別的背景和資源。但是，我相信只要我努力，就能夠實現自己的夢想。今天，我將分享我的經驗，希望能幫助更多人實現財務自由。
首先，我要強調的是教育的重要性。我選擇了電腦專業，這個選擇為我後來的職業生涯打下了堅實的基礎。在大學期間，我深入學習了程式設計、資料結構、演算