利用科學數據，決定網頁是否安裝特定外掛，優化網站配置﹍實作範例

過去我們網站擺放的各種外掛、小工具，一開始是如何決定的呢？是因為個人喜好，還是因為別的網站有裝，還是猜測訪客應該需要？

如果不確定為何而裝，那麼想必站長們都知道，外掛裝越多，網頁載入速度越慢，那麼究竟哪些外掛該移除呢？

還有，我們會在網站各處擺放各種想推廣的文章連結，你知道哪些有人點、哪些沒人點，哪些該換別的連結以獲得更好的成效呢？

以上所有的事，其實可以不依靠第六感，直接收集實實在在的數據，從報表就能輕鬆分析出該如何取捨，本篇從實作範例來看看如何做到。

一、安裝 GA 事件追蹤器

只要網站有安裝 Google Analytics (GA)，就可利用本站開發的「GA 事件追蹤器(會員加值文章)」，追蹤網站所有連結的點擊成效。

使用這個版本的優點有這些：

• 排除 Blogger 站長自己的點擊
• 對所有點擊事件進行分類，例如區分為導覽列、側邊欄、頁尾等等
• 監測動態 JS 產生的小工具連結
• 指定要監測的小工具
• 排除不要監測的小工具

文章開頭圖片的 GA 數據報表，為本站在上個月進行實測的結果，以下將分析這些點擊記錄，試著進行各種網站優化的評估。

二、網頁各區塊的評估

進入「GA 官網」→ 左側選單 → 行為 → 事件 → 總覽 → 並且套用選定的日期範圍後，可看到類似以下的報表。



從以上的數據，可看出對於本站而言：

• 文末的「延伸閱讀」工具 (postSeries)是最重要的一個區塊，佔了訪客將近 3 成的點擊率，所以這是不可或缺、極重要的一個外掛。
• 導覽列下拉選單區塊 (dropdown_menu) 也非常重要，同樣佔了訪客將近 3 成的點擊率
• 側邊欄所有點擊加總，將近 1/4，次數也不少，但側邊欄佔據網頁的面積遠大於前兩者，所以側邊欄的外掛取捨，需要看進一步的數據來決定。
• 標頭 (header)、頁尾 (footer) 區塊，雖然點擊比例沒那麼多，但由於都只是超連結而已，不會對網頁效能有任何負面影響，相較之下其實是 CP 值超高的兩個區塊，可以看做是無本生意、卻能創造出這麼多的點擊。
• 本站比較可惜的是紅框標出來的兩個區塊：首頁輪播(cross_slider)、首頁推薦文章(label_posts)
  
  • 輪播等於 1 天只有 2 次點擊而已，但是載入了 6 張大圖、執行一個輪播外掛(3 個額外的 CDN HTTP 請求)，CP 值不算好 → 將來我可能會移除輪播區塊
  • 首頁推薦文章更慘，1 天不到 1 次點擊，但是載入了 8 張大圖、6 張小圖、3 個額外的 HTTP 請求 → 目前我已決定會移除這 3 個推薦文章區塊

接下來我們一一針對個別數據，來看看可以如何進行解讀。

三、延伸閱讀的重要性

1. 文字版相關文章



點進「延伸閱讀」區塊的報表，上圖可看到所有被點擊的連結文字：

• 一方面可瞭解讀者對哪方面的主題、內容最有興趣
• 看是要多寫相關的文章，還是推廣這些容易受到關注的文章
• 另一方面可看到「所有相關主題文章一覽」這個連結的點擊數最多

一般的「延伸閱讀」工具並沒有這個功能，「所有相關主題文章一覽」是我自行開發的功能，點擊後會進入該標籤的頁面，讓讀者參考該標籤的所有相關文章，可增加更多的點擊機會。

當初設計這功能時，其實我不確定訪客是否會點擊「所有相關主題文章一覽」這個連結，現在有了數據支持，可以確定這是非常正確的決定。

所以從統計數據可以看出，文末區塊是讀者剛閱讀完文章，注意力最高的一個區塊，在這裡放「延伸閱讀」工具可以說是網站 CP 值最高的一件事。


2. 圖片版相關文章

從本站的數據來看，文字版的相關文章有這麼大的效用，那麼很多網站會擺放的「圖片版相關文章」效用又是如何呢？

一方面載入圖片會花費不少 HTTP 請求，如果沒有好的點擊效果，跟「文字版相關文章」比較之下，對於網站效能是很浪費的。

很可惜本站目前沒使用這樣的工具，所以缺乏資料評估效用，站長們需要自行安裝「GA 事件追蹤器」，讓數據來說話。

四、導覽列的連結配置

來看看所有導覽列被點擊的數據細節：

• 算是不意外，首頁永遠是點擊率最高的連結
• 我看過有些站長導覽列沒放「首頁」連結，這是很吃虧的，盡量在各方面滿足訪客的操作需求，可以逐步累積訪客的好感，聚沙成塔
• 其他的數據跟「延伸閱讀」的效果類似，可以了解讀者對哪些標籤、連結最有興趣

根據導覽列的點擊排行，我們可以做的事大致是這樣：

• 把點擊率高的標籤或文章連結，排序的位置往上移動，減少讀者眼球的移動距離
• 點擊率低的連結，一方面排序往下，一方面也可思考是否下架
• 沒什麼點擊的連結，可更換其他連結再測試一個月
• 從數據反覆評估找出導覽列所有連結的最佳解
• 說不定有些連結的成效是季節性的，這需要不一樣的實驗時間區間才看得出來

五、側邊欄的工具取捨

前面兩個區塊很單純，都只有一個工具而已，而側邊欄的小工具數量就很多了，我們點進側邊欄區塊來看細節。

• 雖然「樹狀標籤」是本站最熱門的工具，但我一直不確定讀者到底有沒有在用本站的這個工具，直到現在看到 Label1 的數據，而且是遙遙領先，總算心裡比較踏實，這個工具沒有白裝了 → 樹狀標籤是側邊欄最重要的工具
• ArchiveList 是 Blogger 官方工具「文章彙整」，長久以來一直不想安裝這工具，因為我自己不會去使用。前陣子覺得訪客或許會用這個工具吧，才加到側邊欄，沒想到數據顯示「文章彙整」是本站排行第 2 名的側邊欄工具，而且位置還很偏僻。這也讓我醒悟，安裝工具與否需要讓數據說話，而不是憑自己的感覺。
• sidebar_float 是側邊欄浮動區塊，由於固定在畫面上，有一定的點擊不意外
• blog_collection 與 blogger_collection 都是精選文章的區塊，雖然點擊數沒很多，但這些都只是超連結而已，不需要 http 請求，也就是無本生意，只要有點擊都是賺。

剩下幾個幾乎沒有點擊數的工具，倒是可以討論一下：

• 這幾個只有個位數點擊量的工具，剛好都是位於隱藏的分頁，沒有顯示出來
• 所以側邊欄不適合使用分頁工具，數據證明，訪客的時間很寶貴，他們不會特地去打開隱藏的分頁
• 最新文章 (newPosts) 與熱門文章 (popularPostArea) 都是部落格側邊欄的常見工具，但可惜本站都放在隱藏的分頁，所以此次無法測出這兩個工具的實際效用，這就留待其他站長的實測結果了

六、標頭、頁尾的連結

本站的標頭、頁尾區塊，沒有安裝任何工具，代表載入頁面不需要任何額外的 http 請求，完全不影響網頁載入速度，所以任何連結的點擊都算是淨賺。




特別來看一下標頭區塊的點擊細節，本站的標頭一共只有 5 個連結，但是這 5 個連結一共貢獻了數百次點擊，必須說「標頭」是本站 CP 值最高的一個區塊。

• 首頁點擊率都是最高前面提過，此處省略
• 剩下的幾個連結，有的是推廣本站的業務
• 有的是本站工具懶人包整理，該篇有數十個更多的文章連結
• 有的是增加分站曝光度

此次進行統計才知道「標頭」是非常能吸引訪客注意的區塊，那麼建議讀者好好規劃這個區塊的連結，成效可能會超出想像。

有的站長會在標頭放廣告，當然轉換成收益也是滿實在的，不過建議站長們評估一下，究竟這個區塊用來拿現金比較划算，還是獲得大量點擊會有更好的影響力。

七、小結

本篇分享的 GA 點擊數據，僅僅是本站 4 月份的績效，相信對本站的版面配置、小工具去留有很大的參考價值。然而是否所有網站都能依照本站的經驗來進行規劃呢？我相信某些可以，但不是所有數據都能依樣畫葫蘆。

舉例來說，數據顯示本站的輪播功能青睞度不高，這很有可能是輪播圖片不夠吸引人，或是輪播圖片不夠大張，又或者本站的性質本來就不適合放輪播。如果是美食、旅遊、美妝網站，或許首頁有高質感的輪播圖，點擊率就不一樣了。

所以不同性質的網站，版面配置、擺放的工具、連結的安排，可能訪客習性都不一樣，自然點擊習慣也不一樣，那麼一切還是回歸各自的網站數據才準確。

那麼本篇算是讓讀者瞭解，「面對數據時，可以進行什麼樣的思考與應對」。而真正規劃自己網站時，還是得請站長們好好收集 GA 點擊數據，才能為自己的網站配置做出最佳化。

更多「提升網站效能」相關文章：